From 6f205f07d2040ed7c5df1a7b5878492f72bbf1c2 Mon Sep 17 00:00:00 2001 From: Robin Malfait Date: Tue, 24 Jan 2023 20:08:38 +0100 Subject: [PATCH] Fix crash when reading `headlessuiFocusGuard` of `relatedTarget` in the `FocusTrap` component (#2203) * ensure `relatedTarget` is an `HTMLElement` Or in other words, Robin trust the type system... I was assuming that this was always an `HTMLElement` or `null` but that's not the case. Just using `e.relatedTarget` shows that `dataset` is not always available. * update changelog --- packages/@headlessui-react/CHANGELOG.md | 1 + .../src/components/focus-trap/focus-trap.tsx | 4 ++-- packages/@headlessui-vue/CHANGELOG.md | 1 + .../@headlessui-vue/src/components/focus-trap/focus-trap.ts | 4 ++-- 4 files changed, 6 insertions(+), 4 deletions(-) diff --git a/packages/@headlessui-react/CHANGELOG.md b/packages/@headlessui-react/CHANGELOG.md index 738e1d1..1da0b7a 100644 --- a/packages/@headlessui-react/CHANGELOG.md +++ b/packages/@headlessui-react/CHANGELOG.md @@ -17,6 +17,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Fix `failed to removeChild on Node` bug ([#2164](https://github.com/tailwindlabs/headlessui/pull/2164)) - Don’t overwrite classes during SSR when rendering fragments ([#2173](https://github.com/tailwindlabs/headlessui/pull/2173)) - Improve `Combobox` accessibility ([#2153](https://github.com/tailwindlabs/headlessui/pull/2153)) +- Fix crash when reading `headlessuiFocusGuard` of `relatedTarget` in the `FocusTrap` component ([#2203](https://github.com/tailwindlabs/headlessui/pull/2203)) ## [1.7.7] - 2022-12-16 diff --git a/packages/@headlessui-react/src/components/focus-trap/focus-trap.tsx b/packages/@headlessui-react/src/components/focus-trap/focus-trap.tsx index a0a6033..606d267 100644 --- a/packages/@headlessui-react/src/components/focus-trap/focus-trap.tsx +++ b/packages/@headlessui-react/src/components/focus-trap/focus-trap.tsx @@ -109,8 +109,8 @@ export let FocusTrap = Object.assign( let allContainers = new Set(containers?.current) allContainers.add(container) - let relatedTarget = e.relatedTarget as HTMLElement | null - if (!relatedTarget) return + let relatedTarget = e.relatedTarget + if (!(relatedTarget instanceof HTMLElement)) return // Known guards, leave them alone! if (relatedTarget.dataset.headlessuiFocusGuard === 'true') { diff --git a/packages/@headlessui-vue/CHANGELOG.md b/packages/@headlessui-vue/CHANGELOG.md index 17a5016..35069d5 100644 --- a/packages/@headlessui-vue/CHANGELOG.md +++ b/packages/@headlessui-vue/CHANGELOG.md @@ -18,6 +18,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Fix `Tab` key with non focusable elements in `Popover.Panel` ([#2147](https://github.com/tailwindlabs/headlessui/pull/2147)) - Don’t overwrite classes during SSR when rendering fragments ([#2173](https://github.com/tailwindlabs/headlessui/pull/2173)) - Improve `Combobox` accessibility ([#2153](https://github.com/tailwindlabs/headlessui/pull/2153)) +- Fix crash when reading `headlessuiFocusGuard` of `relatedTarget` in the `FocusTrap` component ([#2203](https://github.com/tailwindlabs/headlessui/pull/2203)) ## [1.7.7] - 2022-12-16 diff --git a/packages/@headlessui-vue/src/components/focus-trap/focus-trap.ts b/packages/@headlessui-vue/src/components/focus-trap/focus-trap.ts index faa6501..4cd3790 100644 --- a/packages/@headlessui-vue/src/components/focus-trap/focus-trap.ts +++ b/packages/@headlessui-vue/src/components/focus-trap/focus-trap.ts @@ -111,8 +111,8 @@ export let FocusTrap = Object.assign( let allContainers = new Set(props.containers?.value) allContainers.add(container) - let relatedTarget = e.relatedTarget as HTMLElement | null - if (!relatedTarget) return + let relatedTarget = e.relatedTarget + if (!(relatedTarget instanceof HTMLElement)) return // Known guards, leave them alone! if (relatedTarget.dataset.headlessuiFocusGuard === 'true') {