larsthorup/mocha-vite-puppeteer

ReferenceError: global is not defined

Closed this issue · 4 comments

steve-taylor-medirecords commented

I created a fresh CRA project with TypeScript:

npx create-react-app mocha-vite-puppeteer-poc --template typescript

I added Counter.tsx, Counter.test.tsx and test.html exactly as documented in README.md, except with extensions (and references to them) changed from .js and .jsx to .ts and .tsx.

Running npx mocha-vite-puppeteer produces the following output:


  vite v2.3.2 dev server running at:

  > Local: http://localhost:3001/
  > Network: use `--host` to expose
[vite] connecting...
[vite] connected.

Download the React DevTools for a better development experience: https://reactjs.org/link/react-devtools
file:///Users/steve/POC/mocha-vite-puppeteer-poc/node_modules/mocha-vite-puppeteer/cli.js:67
    throw new Error(message);
          ^

Error: ReferenceError: global is not defined
    at node_modules/pretty-format/build/plugins/AsymmetricMatcher.js (http://localhost:3001/node_modules/.vite/@testing-library_react.js?v=4cf13379:20464:19)
    at __require (http://localhost:3001/node_modules/.vite/chunk-22DOMQDG.js?v=4cf13379:9:44)
    at node_modules/pretty-format/build/index.js (http://localhost:3001/node_modules/.vite/@testing-library_react.js?v=4cf13379:21184:53)
    at __require (http://localhost:3001/node_modules/.vite/chunk-22DOMQDG.js?v=4cf13379:9:44)
    at http://localhost:3001/node_modules/.vite/@testing-library_react.js?v=4cf13379:33334:39
    at file:///Users/steve/POC/mocha-vite-puppeteer-poc/node_modules/mocha-vite-puppeteer/cli.js:67:11
    at /Users/steve/POC/mocha-vite-puppeteer-poc/node_modules/puppeteer/lib/cjs/vendor/mitt/src/index.js:51:62
    at Array.map (<anonymous>)
    at Object.emit (/Users/steve/POC/mocha-vite-puppeteer-poc/node_modules/puppeteer/lib/cjs/vendor/mitt/src/index.js:51:43)
    at Page.emit (/Users/steve/POC/mocha-vite-puppeteer-poc/node_modules/puppeteer/lib/cjs/puppeteer/common/EventEmitter.js:72:22)
    at Page._handleException (/Users/steve/POC/mocha-vite-puppeteer-poc/node_modules/puppeteer/lib/cjs/puppeteer/common/Page.js:684:14)
    at /Users/steve/POC/mocha-vite-puppeteer-poc/node_modules/puppeteer/lib/cjs/puppeteer/common/Page.js:153:66
    at /Users/steve/POC/mocha-vite-puppeteer-poc/node_modules/puppeteer/lib/cjs/vendor/mitt/src/index.js:51:62
    at Array.map (<anonymous>)
    at Object.emit (/Users/steve/POC/mocha-vite-puppeteer-poc/node_modules/puppeteer/lib/cjs/vendor/mitt/src/index.js:51:43)
larsthorup commented

Hey @steve-taylor-medirecords thank you for the detailed report!
My guess is that something in @testing-library/react expects global being defined as if it was running in a Node.js environment. To work around this, you can add global = window in your test.html. See the file https://github.com/larsthorup/mocha-vite-puppeteer/blob/main/test/app/test.html (part of the end-to-end test here in this repo).
Please let me know if this solves the issue?

larsthorup commented

Looks like it could be the same issue as this one: testing-library/dom-testing-library#756

larsthorup commented

Closing for lack of reply. Feel free to add additional comments!

fatso83 commented

This is even mentioned in the Vite docs. If your code expects global to be defined, then just add global = window in a small script tag before your module executes, just like @larsthorup suggests.

  • 👍1