{closeButtonToRender}
diff --git a/src/tests/clipperUI/mainController_tests.tsx b/src/tests/clipperUI/mainController_tests.tsx index 3ba143f1..0f27f925 100644 --- a/src/tests/clipperUI/mainController_tests.tsx +++ b/src/tests/clipperUI/mainController_tests.tsx @@ -467,6 +467,17 @@ export class MainControllerTests extends TestModule { "The close button should render when the clipper is not clipping to OneNote API"); } }); + + test("The main controller should have role='dialog' and aria-modal='true' for accessibility", () => { + MithrilUtils.mountToFixture(this.defaultComponent); + + let mainController = document.getElementById(Constants.Ids.mainController); + ok(mainController, "The main controller element should exist"); + strictEqual(mainController.getAttribute("role"), "dialog", + "The main controller should have role='dialog' to prevent Voice Access from numbering background controls"); + strictEqual(mainController.getAttribute("aria-modal"), "true", + "The main controller should have aria-modal='true' to mark it as a modal dialog"); + }); } private getMockRequestError(): OneNoteApi.RequestError { From 9fb6f3e9c6f81c2810410fbb28905dc736d3115a Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Mon, 30 Mar 2026 10:53:30 +0000 Subject: [PATCH 3/4] Fix Voice Access background controls: set aria-hidden on document.body from inject script Agent-Logs-Url: https://github.com/OneNoteDev/WebClipper/sessions/6ec55267-0506-4b18-a277-54f3f90edcb7 Co-authored-by: KethanaReddy7 <257986085+KethanaReddy7@users.noreply.github.com> --- src/scripts/extensions/clipperInject.ts | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/scripts/extensions/clipperInject.ts b/src/scripts/extensions/clipperInject.ts index 8a66cd3d..9517e08c 100644 --- a/src/scripts/extensions/clipperInject.ts +++ b/src/scripts/extensions/clipperInject.ts @@ -84,6 +84,14 @@ export class ClipperInject extends FrameInjectBase { this.updateUiSizeAttributes(); this.overrideTransformStyles(document.documentElement); + // The clipper frame is now visible; hide page body from assistive technologies + // so that tools like Voice Access do not number background page controls. + // The frame is appended to (not ), so marking + // only hides page content while keeping the clipper iframe accessible. + if (document.body) { + document.body.setAttribute("aria-hidden", "true"); + } + this.logger = new CommunicatorLoggerPure(this.uiCommunicator); this.updatePageInfo(); @@ -316,6 +324,9 @@ export class ClipperInject extends FrameInjectBase { this.uiCommunicator.registerFunction(Constants.FunctionKeys.hideUi, () => { this.frame.style.display = "none"; + if (document.body) { + document.body.removeAttribute("aria-hidden"); + } }); this.uiCommunicator.registerFunction(Constants.FunctionKeys.refreshPage, () => { @@ -375,6 +386,9 @@ export class ClipperInject extends FrameInjectBase { private toggleClipper() { if (this.frame.style.display === "none") { this.frame.style.display = ""; + if (document.body) { + document.body.setAttribute("aria-hidden", "true"); + } } this.uiCommunicator.callRemoteFunction(Constants.FunctionKeys.toggleClipper); } From 271fb4cac401a6fffe5a13b3718eea9b29176c97 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Tue, 31 Mar 2026 04:36:19 +0000 Subject: [PATCH 4/4] Add inert alongside aria-hidden on body to fully suppress Voice Access background numbering Agent-Logs-Url: https://github.com/OneNoteDev/WebClipper/sessions/b160429a-a946-4869-9c23-834931415ee1 Co-authored-by: KethanaReddy7 <257986085+KethanaReddy7@users.noreply.github.com> --- src/scripts/extensions/clipperInject.ts | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/scripts/extensions/clipperInject.ts b/src/scripts/extensions/clipperInject.ts index 9517e08c..a493b4ca 100644 --- a/src/scripts/extensions/clipperInject.ts +++ b/src/scripts/extensions/clipperInject.ts @@ -87,9 +87,12 @@ export class ClipperInject extends FrameInjectBase { // The clipper frame is now visible; hide page body from assistive technologies // so that tools like Voice Access do not number background page controls. // The frame is appended to (not ), so marking - // only hides page content while keeping the clipper iframe accessible. + // and inert only hides page content while keeping the clipper iframe accessible. + // aria-hidden removes body from the AT tree; inert also disables pointer events + // so Voice Access cannot enumerate or activate background controls. if (document.body) { document.body.setAttribute("aria-hidden", "true"); + document.body.setAttribute("inert", ""); } this.logger = new CommunicatorLoggerPure(this.uiCommunicator); @@ -326,6 +329,7 @@ export class ClipperInject extends FrameInjectBase { this.frame.style.display = "none"; if (document.body) { document.body.removeAttribute("aria-hidden"); + document.body.removeAttribute("inert"); } }); @@ -388,6 +392,7 @@ export class ClipperInject extends FrameInjectBase { this.frame.style.display = ""; if (document.body) { document.body.setAttribute("aria-hidden", "true"); + document.body.setAttribute("inert", ""); } } this.uiCommunicator.callRemoteFunction(Constants.FunctionKeys.toggleClipper);