Open Bug 1651109 Opened 4 years ago Updated 1 year ago

Narrate popup overlaps the content being narrated


(Toolkit :: Reader Mode, defect, P3)

78 Branch




(Reporter: bugzilla, Unassigned)


(Blocks 1 open bug)


(Whiteboard: [about-reader-ui])


(3 files)

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:78.0) Gecko/20100101 Firefox/78.0

Steps to reproduce:

Go to Reader View and click the "Listen" button.

Actual results:

The new design of Reader View has two problems:

  1. The buttons used to be on the left-hand side of the window, but now they're directly to the left of the page text. This means that the pop-out controls for the Listen button now overlap the text. So if I want to be able to read the text at the same time as listening to the TTS, I have to click a second time on the Listen button to hide the pop-up. Then I have to click on it for a third time if I want to stop the TTS.

  2. Given that this feature is particularly important for those with eyesight problems and other disabilities, it seems like a bad move to have made the buttons smaller.

A screenshot is attached.

Expected results:

It would be preferable to have the buttons far enough to the left that the pop-up does not overlap the text (if enough space is available), and to have the buttons restored to their previous size.

Bugbug thinks this bug should belong to this component, but please revert this change in case of error.

Component: Untriaged → Reader Mode
Product: Firefox → Toolkit

In terms of the sizing, the previous size was 40x40px, and now it's 32x32px, which I don't think is a huge difference. We could conceivably make the hit area for the buttons larger and keep the styling the same, if that would help, though it's not clear to me whether it would.

Moving the buttons closer to the text was done to make it more obvious they were there at all - user research showed that people generally did not find the controls at all, which meant they had a suboptimal experience.

Abe, what do you reckon we should do here?

Ever confirmed: true
Flags: needinfo?(awallin)
Summary: Problems with new Reader View design → Narrate popup overlaps the content being narrated
Whiteboard: [about-reader-ui]

This is an existing issue prior to the redesign. Depending on the screen and column width the popup for listen mode overlaps. See attached screenshot.

We could redesign the listen menu to minimize the chances of overlap. Possible using a vertical layout.

Flags: needinfo?(awallin)

Example of overlap occurring in the current release version of Firefox.

Severity: -- → S3
Priority: -- → P3
Assignee: nobody → hujintao

The bug assignee is inactive on Bugzilla, so the assignee is being reset.

Assignee: hujintao → nobody
You need to log in before you can comment on or make changes to this bug.