thorium-reader icon indicating copy to clipboard operation
thorium-reader copied to clipboard

Screen reader output does not sync reading progress in scroll and paginated views

Open danielweck opened this issue 6 years ago • 6 comments

@mutterback says: https://github.com/readium/readium-desktop/pull/758#issuecomment-538382881

Text does not advance. The program says it has two settings for content, scrollable and paging. I’d expect with scrollable, the text would automatically advance as I read but it doesn’t with any of the three screen reader’s I tried (JAWS, NVDA and Narrator). What I assume are buttons for paging, named left and right, didn’t change the text with any of the screen readers. [My interpretation of this is that the screen reader is reading text below of the visible text in the window, however the text displayed on the screen does not advance with the screen reader - Matt]

danielweck avatar Oct 04 '19 14:10 danielweck

MacOS VoiceOver test with the main chapter of "children's literature", using Google's Chrome web browser (because this is Chromium, just like Electron):

http://readium2.herokuapp.com/pub/L2FwcC9taXNjL2VwdWJzL2NoaWxkcmVucy1saXRlcmF0dXJlLmVwdWI%3D/EPUB/s04.xhtml

Alternative link: https://readium2.now.sh/pub/L2hvbWUvbm93dXNlci9zcmMvbWlzYy9lcHVicy9jaGlsZHJlbnMtbGl0ZXJhdHVyZS5lcHVi/EPUB/s04.xhtml

The VO key (CTRL + OPT) + A reads aloud from the cursor, onwards. Voice Over seems to automatically generate a scroll event to somehow bring the spoken text into view, but it is not precise in the sense that the bold black outline is not in sync with the narrated text.

When reading the same chapter with Thorium / readium-desktop, I observe the same behaviour. In paginated mode, the sense of "out of sync-ness" is accentuated, because CSS columns move out of alignment ("snapping"). This is probably because screen readers use a special mechanism to scroll the content area (normally, the r2-navigator-js component detects out-of-sync scrolls and automatically aligns CSS columns, this happens for example when keyboard-tabbing into hyperlinks or other focusable HTML elements).

So, as far as I can tell, this is the normal / expected behaviour, or at least on par with a web browser experience.

danielweck avatar Oct 04 '19 14:10 danielweck

The interaction is "bi-directional": the other direction is (in Thorium) the user manually scrolling (using the mouse wheel, scrollbar clicks, space bar, previous/next buttons, etc.) or manually "turning pages".

In this case, the screen reader does not track the currently-visible content fragment. This is also what I observe in a standard web browser. In fact the screen reader re-syncs at the next utterance (e.g. new sentence or paragraphs), thereby "cancelling" the user's interaction.

danielweck avatar Oct 04 '19 14:10 danielweck

Note that Books.app on MacOS does not even allow continuous / uninterrupted reading from page to page, so Thorium seems to do a better job in that respect.

danielweck avatar Oct 04 '19 15:10 danielweck

Hi, I have the same issue as described above when using Thorium 1.8.0 with Jaws 2022. When changing page in Thorium the screen readers outout does not "follow" but remains on the previous page. Have there been any solution to this since this post was created or is it an ongoing issue (or am I missing somehting)

MTMJohan avatar Apr 29 '22 09:04 MTMJohan

ping @danielweck

MTMJohan avatar May 05 '22 09:05 MTMJohan

@MTMJohan I am using a ReactJS and this is the solution that i've tried and it works.

import React, { useRef, useEffect } from "react"; // I import useRef and useEffect

//Then i just create a constant headref to handle the useRef null state.

const headerRefMenu = useRef(null);

useEffect(() => {
    if (headerRefMenu && headerRefMenu.current){
        headerRefMenu.current.focus();
    }
})

//Then i add a ref tag and tabindex attribute into the header of my page, so everytime i transition into this page the screen reader focus will be at the header of the page.

  <img ref={headerRefMenu} tabIndex={0} src={IMAGES.LOGO} aria-label="Any Logo You Want" className="w-28 pt-2" />

//Make sure you set your tabIndex into 0.

Hope it will help you mate. Btw I'm using Chrome Vox Screen Reader as a Extension in my browser.

ir3ax avatar May 14 '22 04:05 ir3ax

I believe the problem originally described in this issue was solved in recent Thorium versions. Support for screen reader has been improved significantly over several releases.

danielweck avatar Aug 26 '22 17:08 danielweck