preact crashes while using with mui

[wight554]

After adding mui to preact project, my test started crashing here:
https://github.com/capricorn86/happy-dom/blob/master/packages/happy-dom/src/nodes/document/Document.ts#L615
The error:

 FAIL  test/src/components/App/App.test.tsx > App > should render title
TypeError: Cannot read properties of undefined (reading 'toUpperCase')
 ❯ CustomElementRegistry.get node_modules/happy-dom/lib/custom-element/CustomElementRegistry.js:54:36
 ❯ HTMLDocument.Document.createElementNS node_modules/happy-dom/lib/nodes/document/Document.js:664:66
 ❯ HTMLDocument.Document.createElement node_modules/happy-dom/lib/nodes/document/Document.js:644:21
 ❯ j node_modules/preact/dist/preact.js:1:6618
 ❯ I node_modules/preact/dist/preact.js:1:6013
 ❯ m node_modules/preact/dist/preact.js:1:2096
 ❯ j node_modules/preact/dist/preact.js:1:7049
 ❯ I node_modules/preact/dist/preact.js:1:6013
 ❯ m node_modules/preact/dist/preact.js:1:2096
 ❯ I node_modules/preact/dist/preact.js:1:5831

tried logging args and got this:

stdout | unknown test
http://www.w3.org/1999/xhtml div undefined
http://www.w3.org/1999/xhtml style undefined
http://www.w3.org/1999/xhtml div undefined
http://www.w3.org/1999/xhtml undefined undefined

I managed to fix it by doing (qualifiedName || '').toUpperCase(), but there might be a better fix

[capricorn86]

Thanks for reporting @wight554! 🙂

It is a weird error. It seems like MUI sends in something else than a string to document.createElement() (e.g. document.createElement(undefined)).

It is most likely a bug in MUI, but apparently it is supported to send in other types in the browser as it is parsed to a string. I have added support for converting the value to a string now.

You can read more about the release here:
https://github.com/capricorn86/happy-dom/releases/tag/v2.53.1

[wight554]

That might be how CssBaseline work, thanks for a fix anyway