diff --git a/src/utils/focus/getActiveElement.ts b/src/utils/focus/getActiveElement.ts index b42f0c92..c7eae36c 100644 --- a/src/utils/focus/getActiveElement.ts +++ b/src/utils/focus/getActiveElement.ts @@ -1,4 +1,5 @@ import {isDisabled} from '../misc/isDisabled' +import {isElementType} from '../misc/isElementType' export function getActiveElement( document: Document | ShadowRoot, @@ -10,6 +11,11 @@ export function getActiveElement( if (activeElementInShadowTree) { return activeElementInShadowTree } + } else if (activeElement && isElementType(activeElement, 'iframe')) { + const contentDocument = (activeElement as HTMLIFrameElement).contentDocument + if (contentDocument) { + return getActiveElement(contentDocument) + } } // Browser does not yield disabled elements as document.activeElement - jsdom does if (isDisabled(activeElement)) { diff --git a/tests/keyboard/index.ts b/tests/keyboard/index.ts index 898f4b6f..76451277 100644 --- a/tests/keyboard/index.ts +++ b/tests/keyboard/index.ts @@ -190,3 +190,26 @@ customElements.define( } }, ) + +test('typing on focused element with iframe', async () => { + let iframe: HTMLIFrameElement + let iframeButton: HTMLElement + const {user} = setup( + '
', + ) + iframe = document.createElement('iframe') + window.document.body.appendChild(iframe) + iframeButton = iframe.contentWindow!.document.createElement('button') + iframe.contentWindow!.document.body.appendChild(iframeButton) + let keydown = jest.fn() + let keyup = jest.fn() + iframeButton.addEventListener('keydown', keydown) + iframeButton.addEventListener('keyup', keyup) + + iframeButton.focus() + await user.keyboard('[Space]') + expect(keydown).toHaveBeenCalled() + expect(keyup).toHaveBeenCalled() + + iframe.remove() +})