cfaester / enzyme-adapter-react-18

MIT License
38 stars 12 forks source link

TextEncoder is not defined #1

Closed joegasewicz closed 1 year ago

joegasewicz commented 2 years ago

    ReferenceError: TextEncoder is not defined

      5 | configure({adapter: new Adapter()});

Stack:

      at node_modules/react-dom/cjs/react-dom-server.browser.development.js:145:19
      at Object.<anonymous> (node_modules/react-dom/cjs/react-dom-server.browser.development.js:7002:5)
      at Object.<anonymous> (node_modules/react-dom/server.browser.js:9:7)
      at Object.<anonymous> (node_modules/@cfaester/enzyme-adapter-react-18/dist/ReactEighteenAdapter.js:11:34)
      at Object.<anonymous> (node_modules/@cfaester/enzyme-adapter-react-18/dist/index.js:6:48)
      at Object.<anonymous> (tests/setupTests.ts:7:49)
dooman87 commented 1 year ago

I had the same issue and this is what solved it for me:

global.TextEncoder = require('util').TextEncoder;
global.TextDecoder = require('util').TextDecoder;
const Adapter = require('@cfaester/enzyme-adapter-react-18').default;

import Enzyme from 'enzyme';

global.URLSearchParams = require('url').URLSearchParams;
Enzyme.configure({adapter: new Adapter()});

Using require instead of import is important.

cfaester commented 1 year ago

Thanks guys. I'll take a quick look.

cfaester commented 1 year ago

Hello everyone. Sorry for getting back so late.

Unfortunately JSDOM appears to have removed Node API's when you activate it, since version 17. This is a problem for us, since we depend on ReactDOM.renderToStaticMarkup() to accurately create a render tree for Enzyme.render(). I've just pushed a new version instructing a workaround (the aforementioned essentially) if you wish to use .render().

Ideally I'd want to polyfill this on the fly, but until I find a good method for this, I don't want to leave you hanging without anything.

This is available in v0.6.0.

Closed.