CdsDropdown throws an exception in jsdom
ashleyryan opened this issue · 3 comments
Describe the bug
When rendering CdsDropdown in a react-testing-library test, it throws an exception: [TypeError: Cannot read property 'disconnect' of undefined]
How to reproduce
vmware-clarity/starters@main...ashleyryan:rtl-cdsdropdown
Steps to reproduce the behavior:
cd create-react-appyarn installyarn test
You'll see the failure
Expected behavior
The test should pass
Versions
Clarity project:
- Clarity Core
- Clarity Angular/UI
Clarity version:
- v3.x
- v4.x
- v5.x
- v6.x
Framework:
- Angular
- React
- Vue
- Other:
Additional notes
The stack trace indicates this line is the issue: https://github.com/vmware/clarity/blob/4006bea6dfe7b31a4708cc656dc628aad47562fa/packages/core/src/internal/controllers/first-focus.controller.ts#L33
MutationObserver is implemented in jsdom, but they might do something weird, which may have something to do with it.
good catch. that should be easy to fix by changing the line to...
this.observer?.disconnect();
Apparently, listenForAttributeChange() can return undefined in some environments. 🤔
Apparently, listenForAttributeChange() can return undefined in some environments. 🤔
I saw that as well, which doesn't make sense, unless listenForAttributeChange is somehow never called in jsdom. I'm hoping I can repro it in my jsdom environment that I used for cds-select.
That should be an easy fix, but the type isn't nullable, so it's going to be weird to add the ?
Hi there 👋, this is an automated message. To help Clarity keep track of discussions, we automatically lock closed issues after 14 days. Please look for another open issue or open a new issue with updated details and reference this one as necessary.