TypeError: Cannot read properties of null (reading 'deleteRule')
- Dominant language
- JavaScript
- Stars
- 7.1k
- Forks
- 386
- PR merge metrics
- No merged PRs in 30d
Description
In cypress in UI mode, after a test has finished hovering on some of the commands restores a snapshot of the dom. This often causes this error to be thrown:
```
TypeError: Cannot read properties of null (reading 'deleteRule')
at DomRenderer.replaceRule (jss.esm.js:2000:1)
at StyleSheet.replaceRule (jss.esm.js:1146:1)
at Array.onProcessStyle (jss-plugin-nested.esm.js:87:1)
at PluginsRegistry.onProcessStyle (jss.esm.js:1313:1)
at PluginsRegistry.onProcessRule (jss.esm.js:1303:1)
at StyleSheet.replaceRule (jss.esm.js:1135:1)
at Array.onProcessStyle (jss-plugin-nested.esm.js:87:1)
at PluginsRegistry.onProcessStyle (jss.esm.js:1313:1)
at PluginsRegistry.onProcessRule (jss.esm.js:1303:1)
at StyleSheet.replaceRule (jss.esm.js:1135:1)
```
It seems related to this line:
https://github.com/cssinjs/jss/blob/6d17e19e4f54051ddecf0d1c51c5299fc7d26022/packages/jss/src/DomRenderer.js#L418
The `sheet` property of the element has been set to `null` by the browser. A simple null check here to exit early might well fix the issue.
From what I can tell it originates from MUI's `makeStyles` that changes styles based on props e.g.
```js
makeStyles({
// run when props changes but because of cypress the expected stylesheet has gone...
root: (props) => ({
color: props.a ? '#000' : '#fff'
})
})
```
We are using JSS 10.9.2 from MUI 4.11.4
Thanks
Dave
Contributor guide
Assessment
This issue has not been assessed yet.