When running examples/with-material-ui example error is shown

[jtiai]

When trying to run examples/with-material-ui the following error is thrown:

$ deno task dev
Task dev deno run -A --no-check --watch ./server.tsx
Watcher Process started.
error: Uncaught ReferenceError: document is not defined
    at $0 (https://esm.sh/v102/@mui/material@5.10.3/X-ZS9AZW1vdGlvbi9yZWFjdCxAZW1vdGlvbi9zdHlsZWQscmVhY3Q/deno/material.bundle.js:2:22710)
    at https://esm.sh/v102/@mui/material@5.10.3/X-ZS9AZW1vdGlvbi9yZWFjdCxAZW1vdGlvbi9zdHlsZWQscmVhY3Q/deno/material.bundle.js:2:23722

Expected result:

App starts and accessing localhost:8000 would render small example page.

[cdoremus]

I am able to run the example without errors from the examples/with-material-ui folder using the latest code and Deno 1.29.2.

[vinaybedre]

@cdoremus did you used the repo as is? I am on same version of deno as you mentioned 1.29.2 on Mac M1 and I still get the same error.

[cdoremus]

@vinaybedre yes, I used the repo as is, and I am running ultra using Ubuntu 20.04. Did you install Deno with Homebrew? I've heard some people have issues when Deno is installed on a Mac using Homebrew.

[jtiai]

I am able to run the example without errors from the examples/with-material-ui folder using the latest code and Deno 1.29.2.

I tested with both, homebrew and installed directly from Deno site using curl. Both were 1.29.4 and I get the same error about document not being defined. I'm on Mac M1 too.

[jtiai]

My colleague tested in Ubuntu (wsl2) and he got the same error.

[deckchairlabs]

Could the people having issues with this example please try running the Dev task with the --reload flag and report back.

[jtiai]

With --reload same thing in both Mac M1 and Ubuntu in WSL2.

[deckchairlabs]

Getting this example to work initially was a real pain, so I'm not quite sure whats changed to be causing this issue now. I can reproduce. This is the culprit as far as I can find.

error: Uncaught ReferenceError: document is not defined
    var ssrStyles = document.querySelectorAll("style[data-emotion]:not([data-s])");
                    ^
    at createCache2 (https://esm.sh/v104/@mui/material@5.11.6/X-ZS9AZW1vdGlvbi9yZWFjdCxAZW1vdGlvbi9zdHlsZWQscmVhY3Q/deno/material.development.bundle.js:2889:21)
    at https://esm.sh/v104/@mui/material@5.11.6/X-ZS9AZW1vdGlvbi9yZWFjdCxAZW1vdGlvbi9zdHlsZWQscmVhY3Q/deno/material.development.bundle.js:2986:13

[robomatic]

I also get a similar error using react-hot-toast

Watcher Process started.
error: Uncaught ReferenceError: document is not defined                                                                     
    at j (https://esm.sh/v111/goober@2.1.12/deno/goober.js:2:113)
    at Object.h (https://esm.sh/v111/goober@2.1.12/deno/goober.js:2:1765)
    at https://esm.sh/v111/react-hot-toast@2.4.0/X-ZS8q/deno/react-hot-toast.js:2:3446```

This error happens on the server side, hence the error in the terminal?