Closed Bug 1799215 Opened 2 years ago Closed 2 years ago

Cancel, Copy, and Download buttons in the Screenshots overlay are not focusable (component)

Categories

(Firefox :: Screenshots, defect, P2)

Desktop
Unspecified
defect

Tracking

()

VERIFIED FIXED
111 Branch
Tracking Status
firefox111 --- verified
firefox112 --- verified

People

(Reporter: tgiles, Assigned: niklas)

References

(Blocks 1 open bug)

Details

(Whiteboard: [fidefe-quality-foundation] )

Attachments

(1 file)

We don't currently have a way to take a screenshot by keyboard only, so there would be no way to reach these buttons currently anyway without using the mouse...but we should treat these buttons like the Save visible/Save full page buttons and thus they should be focusable.

STR:

  • Set screenshots.browser.component.enabled to true
  • Navigate to https://bugzilla.mozilla.org/home (or any webpage)
  • Use keyboard shortcut (Ctrl + Shift + S on Windows, not sure on Mac or Linux) to take a screenshot
  • Use mouse to take a screenshot of some element on the page
  • Attempt to Tab navigate (or use F6 to navigate around) to the Cancel, Copy, and Download buttons

Expected:

  • I'm able to reach these buttons via keyboard

Actual:

  • I am unable to reach these buttons via keyboard

This WFM on macOS, fwiw.

OS: Unspecified → Windows 10
Hardware: Unspecified → Desktop

Hmm, this issue doesn't appear on macOS for me either. I'm able to reproduce this issue on Windows and Ubuntu though.

OS: Windows 10 → Unspecified

These controls are keyboard-accessible when using the extension. If you keep hitting TAB, you do eventually focus the the "Download" button, but there is almost no visible focus state so its hard to see. So this would represent a regression if we flip the pref to ship the component implementation.

Severity: -- → S3
Priority: -- → P2

As it stands, I'm not able to reach the overlay content at all from the keyboard. For context, when you activate Screenshots it does 2 things: It shows a popup toolbar on the top/right with "Save visible page" and "Save full page" buttons. And an overlay is placed over the current document with controls and interactions to select a particular element or arbitrary rectangle on the page to capture. Once that region is identified, we show a toolbar on the overlay with copy/download/cancel buttons. This overlay toolbar - and all the controls in the overlay - seem to be completely inaccessible currently when using the screenshots.browser.component.enabled = true implementation.

The overlay is implemented using an anonymous content document, using the same technique as devtools' highlighters.

Summary: Cancel, Copy, and Download buttons are not focusable (component) → Cancel, Copy, and Download buttons in the Screenshots overlay are not focusable (component)
Assignee: nobody → nbaumgardner
Status: NEW → ASSIGNED
Whiteboard: [fidefe-quality-foundation]
Pushed by nbaumgardner@mozilla.com: https://hg.mozilla.org/integration/autoland/rev/9856fa27ddb1 Screenshots overlay buttons should have focus states. r=cmkm
Status: ASSIGNED → RESOLVED
Closed: 2 years ago
Resolution: --- → FIXED
Target Milestone: --- → 111 Branch
Flags: qe-verify+

Reproducible on a 2023-01-25 Nightly build on Windows 10.
Verified as fixed on Firefox 111.0b4(build ID: 20230221190142) and Nightly 112.0a1(build ID: 20230222214030) on Windows 10, Ubuntu 22, macOS 12.

Status: RESOLVED → VERIFIED
Flags: qe-verify+
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: