material-components-web-react: ReferenceError: Element is not defined on SSR
Hello, I’m getting a ReferenceError: Element is not defined when I try to SSR the Drawer component, running on version 0.7.1.
The issue is probably some optimization on the webpack build process where it removes “dead-code”, because the error occurs on the tabbable npm package, imported from focus-trap, specifically on this line. But, as you can see, it has a check specifically to avoid this issue when running on node environments. I have checked the minified code and have confirmed that the check for the typeof Element is optimized away.
Unfortunately I don’t have a reproducible codesandbox snippet as it doesn’t execute the code with SSR 😔
About this issue
- Original URL
- State: closed
- Created 6 years ago
- Reactions: 2
- Comments: 20 (19 by maintainers)
Wow, awesome! Thanks, @lucasecdb! Also, thanks @moog16; I’m sorry I didn’t have time to continue working on my PR related to this. I started a new software engineering job, so that has been taking a lot of my time lately, though I think as I settle in there, I will be able to spend more of my time on GitHub again. 💜
0.43.0 released today!
This hasn’t been slated for 0.9.0 but seems like a blocker for some people. Can someone update to 0.43.0 when it is landed next week?
The main contributors of this project are moving to MDC Web’s typescript conversion project (which will last for about 1 - 3 months). All issues/prs will be reviewed, however we will not be able to contribute. I will add more detail in our Roadmap, but just wanted to see if there are any volunteers who could fix this.
I have an idea: add this package to the externals during the
npm run buildstep. This should force the drawer package to look atnode_modulesinstead of trying to minify it. I think this should work