diff --git a/src/scripts/clipperUI/components/sectionPicker.tsx b/src/scripts/clipperUI/components/sectionPicker.tsx index 43339d23..204929ce 100644 --- a/src/scripts/clipperUI/components/sectionPicker.tsx +++ b/src/scripts/clipperUI/components/sectionPicker.tsx @@ -235,6 +235,32 @@ export class SectionPickerClass extends ComponentBase { + if (ev.keyCode === escKeyCode) { + // Check if the dropdown popup is currently visible + let sectionPickerPopup = document.querySelector(".SectionPickerPopup"); + if (sectionPickerPopup) { + // The popup is open - schedule focus return after it closes + setTimeout(() => { + let locationButton = document.getElementById(Constants.Ids.sectionLocationContainer); + if (locationButton) { + locationButton.focus(); + } + }, 10); + } + } + }; + // Use capture phase to run before OneNotePicker's handler + document.addEventListener("keydown", handleKeyDown, true); + } + } + addSrOnlyLocationDiv(element: HTMLElement) { const pickerLinkElement = document.getElementById(Constants.Ids.sectionLocationContainer); if (!pickerLinkElement) { @@ -246,6 +272,9 @@ export class SectionPickerClass extends ComponentBase { + let done = assert.async(); + let clipperState = MockProps.getMockClipperState(); + let mockNotebooks = MockProps.getMockNotebooks(); + initializeClipperStorage(JSON.stringify(mockNotebooks), undefined); + + let popupToggleCalled = false; + let component = { popupToggleCalled = true; }} + clipperState={clipperState} />; + let controllerInstance = MithrilUtils.mountToFixture(component); + + // Open the popup first + MithrilUtils.simulateAction(() => { + document.getElementById(TestConstants.Ids.sectionLocationContainer).click(); + }); + + // Focus another element to simulate focus being elsewhere + let anotherElement = document.createElement("button"); + document.body.appendChild(anotherElement); + anotherElement.focus(); + + // Close the popup by calling onPopupToggle with false + controllerInstance.onPopupToggle(false); + + // Wait for the deferred focus (setTimeout) to execute + setTimeout(() => { + // Verify focus was restored to the location container + strictEqual(document.activeElement.id, TestConstants.Ids.sectionLocationContainer, + "Focus should be restored to sectionLocationContainer when popup closes"); + ok(popupToggleCalled, "The parent onPopupToggle callback should have been called"); + + // Clean up + document.body.removeChild(anotherElement); + done(); + }, 10); + }); } }