While converting an existing CEP app over to UXP we ran into a problem. The existing app heavily relies upon `@material-ui/core` for its layout and components, namely `<Box />`. The source code for `Box` tries to access `cssRules` on a container, but fails to do so. Here is the complete stacktrace:
I do not receive this error message when opening the `index.html` in the browser directly. This implies that it's a problem with the UXP browser implementation. There was a previous bug with Firefox (that was patched a while ago) that caused the same error. Here is a link to it.
Steps to reproduce: 1. Create a UXP plugin using `uxp-photoshop-plugin-samples/ui-react-starter` 2. yarn add `@material-ui/core` 3. import the Box component and use it inside of the `PanelController`. No props necessary... just a plain ol' Box 4. Load and debug the plugin. The error should be visible in the console.
Here's a breakdown of the error -
Material UI is attempting to add css styling rules to an element. While debugging I noted that it is a `style` element. One of the functions in the stacktrace is accepting a container element. If none is given it uses `this.element.sheet`. The value of `sheet` is undefined and this is what it is relying on to apply the CSS rules.
I looked through the docs and known issues, but didn't see anything relating to `sheet` not being implimeneted. Can someone please take a look at this or tell me how to work around it?