Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

TypeError: Cannot read properties of undefined (reading 'includes') #642

Closed
jdk2pq opened this issue Nov 2, 2022 · 1 comment · Fixed by #797
Closed

TypeError: Cannot read properties of undefined (reading 'includes') #642

jdk2pq opened this issue Nov 2, 2022 · 1 comment · Fixed by #797
Labels
bug Something isn't working

Comments

@jdk2pq
Copy link

jdk2pq commented Nov 2, 2022

This may be similar to: #540

I'm getting this error from node.querySelector(selector) if selector is undefined. For context if it helps, I'm using Quasar and opening a QDialog modal in my tests:

TypeError: Cannot read properties of undefined (reading 'includes')
 ❯ Function.getSelectorParts node_modules/happy-dom/lib/query-selector/QuerySelector.js:180:44
 ❯ Function.querySelector node_modules/happy-dom/lib/query-selector/QuerySelector.js:42:34
 ❯ HTMLElement.querySelector node_modules/happy-dom/lib/nodes/element/Element.js:690:40
 ❯ Array.<anonymous> node_modules/quasar/src/components/dialog/QDialog.js:241:40
    239|           return
    240|         }
    241|         node = (selector !== '' ? node.querySelector(selector) : null)
       |                                        ^
    242|           || node.querySelector('[autofocus][tabindex], [data-autofocus][tabindex]')
    243|           || node.querySelector('[autofocus] [tabindex], [data-autofocus] [tabindex]')
 ❯ Module.removeFocusWaitFlag node_modules/quasar/src/utils/private/focus-manager.js:18:30
 ❯ showPortal node_modules/quasar/src/composables/private/use-portal.js:53:6
 ❯ node_modules/quasar/src/components/dialog/QDialog.js:208:9

Seems to be coming from here: https://github.com/capricorn86/happy-dom/blob/master/packages/happy-dom/src/query-selector/QuerySelector.ts#L233

The code in Quasar seems to be relying on a null value being returned from a bad or non-existent selector and then checking for other selectors from there.

If I try the same thing in a browser, I get:

> div = document.createElement('div')
<div></div>​

> div.querySelector(undefined)
null

> div.querySelector(null)
null

FWIW, it does seem odd to me to pass in an undefined or null to .querySelector(), but on the other hand, the browser appears to handle it just fine and not throw an error unless the selector is an empty string.

@jdk2pq jdk2pq added the bug Something isn't working label Nov 2, 2022
btea added a commit to btea/happy-dom that referenced this issue Feb 26, 2023
capricorn86 added a commit that referenced this issue Apr 4, 2023
#642@patch: Handle selector special value.
@capricorn86
Copy link
Owner

Thank you for reporting @jdk2pq! 🙂

It should now be fixed:
https://github.com/capricorn86/happy-dom/releases/tag/v9.1.5

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants