instructure/instructure-ui

"Element is not defined" with Nextjs

Closed this issue · 2 comments

Question

I would like to use Instructure-ui in Nextjs

As stated in the documentation for SSR, I need to substitute Element from the DOM API. I've done this in the _app.js file, although I'm not entirely sure if I did it right.

It seems like Portal is the one that's causing issues, when I run npm ls @instructure/ui-portal to see which package depends on it, I only get ui-select.
The strange thing is: the ui-select component renders fine. But the AppNav (in Nav, which is in Layout) is also causing issues.

What is going on here? How can I substitute Element in the right way?

Code Sample

I've created a minimal project that isolates the problem here: https://github.com/SimonVanherweghe/nextjs-instructure-ui

Hi @SimonVanherweghe!

Thanks for the issue report and the repro project!
After some testing, it does not seem like you did anything wrong. The issue is not really clear to me at this point, but I will investigate about it and report back to you.

Fixed in: #1168