Repository navigation
Bug 8780715: A11y_OneNoe Clipper_Verify accessibility with Clip_Clip Button_Keyboard: On invoking the Clip button, Keyboard focus is not visible on the Clip successful dialog box. #628
Description
Activity
Claude finished KethanaReddy7's task in 2m 41s —— View job •
claude/issue-628-20260225-0907• Create PR ➔
Accessibility Fix Complete
Issue: Keyboard focus is not visible on the Clip successful dialog box after invoking the Clip button (MAS 2.4.7).
Todo List
- Explore the codebase to find the success dialog components
- Identify where focus management should be implemented
- Implement the fix for the success panel
- Check for similar issue in region dialog (mentioned in bug report)
- Commit and push changes
Changes Made
Modified
src/scripts/clipperUI/panels/successPanel.tsx:- Added
initiallySetFocusmethod to set focus on element - Added
onElementFirstDraw(this.initiallySetFocus)to "View in OneNote" button
Modified
src/scripts/clipperUI/panels/regionSelectingPanel.tsx:- Added
initiallySetFocusmethod to set focus on element - Added
onElementFirstDraw(this.initiallySetFocus)to "Back to Home" button
These changes follow the existing accessibility pattern used in
signInPanel.tsxwhich ensures keyboard focus is visible when panels are first rendered.Summary
- Fixed focus visibility on the Clip Successful dialog ("View in OneNote" button)
- Fixed focus visibility on the Region Selection dialog ("Back to Home" button)
- Both issues mentioned in the bug report are now addressed
|
- added a commit that references this issue
on Feb 25, 2026 Closing the issue with the PR #635
Environment Details:
Application Name: OneNote Clipper-Web
OS: Windows 11 OS build 26058.1000
Edge Dev Version: Version 123.0.2400.1 (Official build) dev (64-bit)
AT's: Keyboard
Pre-Requisites:
Open the URL: OneNote Web Clipper Installation
Invoke the 'Get OneNote web Clipper for Microsoft Edge' button.
Edge Add-ons page will appear. Invoke the Get button.
OneNote Clipper will be added in edge extension section.
Expand the Extension button and turn on the OneNote Clipper Show in Toolbar button.
OneNote Clipper will appear beside of the search field.
Now invoke the OneNote clipper button.
Sign in with V-id.
Repro Steps:
Open the Ankylosaurus - Wikipedia
Now invoke the OneNote clipper button.
OneNote Clipper dialog box will appear.
Tab to navigate to the Clip button and invoke it. And observe the issue.
Actual Result:
On invoking the Clip button, Keyboard focus is not visible on the Clip successful dialog box.
Note: Similar issue observe in the Region dialog box also.
Expected Result:
On invoking the Clip button, Keyboard focus should be visible on the Clip successful dialog box View in OneNote button.
User Impact:
Keyboard users might be confused, if there is no keyboard focus on the Successful dialog box.
MAS Reference:
MAS 2.4.7 – Focus Visible