Enzyme: TypeError: Cannot read property 'current' of undefined

Created on 6 Feb 2019  路  35Comments  路  Source: enzymejs/enzyme

image

This happened after "enzyme-adapter-utils" was updated to version 1.10.0.

As well, I have import 'jsdom-global/register'; at the beginning of the test file.

API

  • [X] shallow
  • [ ] mount
  • [ ] render

Version

| library | version
| ------------------- | -------
| enzyme | 3.7.0
| react | 16.6.3
| react-dom | 16.6.3
| react-test-renderer | 16.8.0
| adapter (below) | 1.6.0
| jsdom-global | 3.0.2

Adapter

  • [X] enzyme-adapter-react-16
  • [ ] enzyme-adapter-react-16.3
  • [ ] enzyme-adapter-react-16.2
  • [ ] enzyme-adapter-react-16.1
  • [ ] enzyme-adapter-react-15
  • [ ] enzyme-adapter-react-15.4
  • [ ] enzyme-adapter-react-14
  • [ ] enzyme-adapter-react-13
  • [ ] enzyme-adapter-react-helper
  • [ ] others ( )
Need More Information

Most helpful comment

@benedyktdryl Updating React isn't always an option.

All 35 comments

I have the same issue with the same packages

Same issue here!

Is this to do with being a stateless component that you're testing? We have the same issue, but its only happening on components that are not extending from React.Component

Is this to do with being a stateless component that you're testing?`

Yes, it is the stateless component.

Update your React to 16.8. ReactCurrentDispatcher is missing from ReactSharedInternals in earlier releases when react-test-renderer in 16.8 is expecting it (probably because newer version of enzyme-react-adapter in 1.9.1 is downloading react-test-renderer in this version, due to not locked dependencies)

I updated both react & react Dom 16.8.0 along with enzyme-react-adapter version 1.9.1, and I get document is not defined error

the error:

var actContainerElement = document.createElement('div');
                          ^

ReferenceError: document is not defined
    at /var/code/node_modules/react-dom/cjs/react-dom-test-utils.development.js:944:27
    at Object.<anonymous> (/var/code/node_modules/react-dom/cjs/react-dom-test-utils.development.js:1283:5)
    at Module._compile (internal/modules/cjs/loader.js:688:30)
    at Module._compile (/var/code/node_modules/pirates/lib/index.js:83:24)
    at Module._extensions..js (internal/modules/cjs/loader.js:699:10)
    at Object.newLoader [as .js] (/var/code/node_modules/pirates/lib/index.js:88:7)
    at Module.load (internal/modules/cjs/loader.js:598:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:537:12)
    at Function.Module._load (internal/modules/cjs/loader.js:529:3)
    at Module.require (internal/modules/cjs/loader.js:636:17)
    at require (internal/modules/cjs/helpers.js:20:18)
    at Object.<anonymous> (/var/code/node_modules/react-dom/test-utils.js:6:20)
    at Module._compile (internal/modules/cjs/loader.js:688:30)
    at Module._compile (/var/code/node_modules/pirates/lib/index.js:83:24)
    at Module._extensions..js (internal/modules/cjs/loader.js:699:10)

@MahaZaid what about react-test-renderer version?

My versions:

  • react: 16.8
  • react-dom: 16.8
  • react-test-renderer: 16.8.0
  • enzyme-adapter-react-16: 1.9.1

I added react-test-renderer but I am still getting the same error

"react": "^16.8.0",
"react-dom": "16.8.0",
"react-test-renderer": "16.8.0",
"enzyme-adapter-react-16": "^1.9.1"

@MahaZaid how you are running tests? It seems like Jest don't know that test should be run in JSDOM environment. Please try to add --env=jsdom to your test command


https://jestjs.io/docs/en/cli.html#env-environment

I am using mocha, enzyme, and @babel/register for running structural tests

I'm having a similar issue when using jest. All of my test are now failing. I'm not sure what was updated that caused this, but it started happening this morning. I'm getting a mix of errors, document is not defined and TypeError: Cannot read property 'current' of undefined.

"enzyme": "^3.8.0",
"react": "16.5.0",
"react-dom": "^16.8.0",
"react-test-renderer": "^16.8.0",
"jsdom": "^13.2.0",
"enzyme-adapter-react-16": "^1.9.1",
"babel-jest": "^23.6.0",

I don't have enzyme-adapter-utils in my pakcage.json file.

@c316 updating React to 16.8 should be IMO enough.

@benedyktdryl Updating React isn't always an option.

@benedyktdryl thanks, that update, plus adding the --env=jsdom to the test command fixed half of my test, now I get a different error. Cannot find module 'schedule/tracking' from 'ReactNativeRenderer-dev.js'. I'm looking to see if I can find what this means.

To resolve that error I had to install the npm i [email protected] --save-dev package. See more info here https://github.com/facebook/react-native/issues/21150

@benedyktdryl Updating React isn't always an option.

I understand, but in most cases - this particular issue can be solved by syncing React version as in earlier I simply can't spot ReactCurrentDispatcher inside ReactSharedInternals

I updated both react & react Dom 16.8.0 along with enzyme-react-adapter version 1.9.1, and I get document is not defined error

the error:

var actContainerElement = document.createElement('div');
                          ^

ReferenceError: document is not defined
    at /var/code/node_modules/react-dom/cjs/react-dom-test-utils.development.js:944:27
    at Object.<anonymous> (/var/code/node_modules/react-dom/cjs/react-dom-test-utils.development.js:1283:5)
    at Module._compile (internal/modules/cjs/loader.js:688:30)
    at Module._compile (/var/code/node_modules/pirates/lib/index.js:83:24)
    at Module._extensions..js (internal/modules/cjs/loader.js:699:10)
    at Object.newLoader [as .js] (/var/code/node_modules/pirates/lib/index.js:88:7)
    at Module.load (internal/modules/cjs/loader.js:598:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:537:12)
    at Function.Module._load (internal/modules/cjs/loader.js:529:3)
    at Module.require (internal/modules/cjs/loader.js:636:17)
    at require (internal/modules/cjs/helpers.js:20:18)
    at Object.<anonymous> (/var/code/node_modules/react-dom/test-utils.js:6:20)
    at Module._compile (internal/modules/cjs/loader.js:688:30)
    at Module._compile (/var/code/node_modules/pirates/lib/index.js:83:24)
    at Module._extensions..js (internal/modules/cjs/loader.js:699:10)

I have the exactly same error as @MahaZaid

"react": "^16.8.0", "react-dom": "^16.8.0", "enzyme-adapter-react-16": "1.9.1"

Of course downgrading to react 16.7.0 works fine.

For those that can not upgrade react, we solved the issue changing the react adapter form enzyme-adapter-react-16 to enzyme-adapter-react-16.3

I've been fighting with the document is not defined error for most of the morning. I got it working by rearranging things in my helper file. _Note: I'm using AVA for my test runner_

Before (broken)

import browserEnv from 'browser-env';

import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

Enzyme.configure({ adapter: new Adapter() });
browserEnv();

After (working)

const browserEnv = require('browser-env');
browserEnv();

const { configure } = require('enzyme');
const Adapter = require('enzyme-adapter-react-16');

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

My guess is the adapter is trying to access document during import.

Hey We found a solution, which was:

  1. update "enzyme-adapter-react-16": "1.1.0" to "enzyme-adapter-react-16.3": "1.6.1",
  2. within your enzymeSetup change import Adapter from 'enzyme-adapter-react-16 to Adapter from enzyme-adapter-react-16.3

@Zveroboev every react package must always have an identical minor; so the fact that you're using react-test-render 16.8 will break, since you're using react 16.6. You'll need to peg that as a dev dep at ~16.6.

If you've done that, and you're still having an issue, I'll reopen - if anyone else is having an issue, please file a separate one - and make sure all react packages have identical minor versions.

This just reoccurred now after updating react-dom, I had to update all other react dependencies to 16.9 (in my case)

@tolumide-ng all react packages (including react-dom and react-test-renderer) must always have an identical minor version.

Keeping the react-test-renderer version the same as react and react-dom.

https://github.com/facebook/react/issues/14763#issuecomment-461016379

  1. enzyme-adapter-react-16.3

not working for me:

System:
      OS: Linux 4.15 Ubuntu 18.04.3 LTS (Bionic Beaver)
      CPU: (8) x64 Intel(R) Core(TM) i7-6700HQ CPU @ 2.60GHz
      Memory: 2.83 GB / 11.63 GB
      Shell: 5.4.2 - /bin/zsh
    Binaries:
      Node: 10.16.3 - ~/.nvm/versions/node/v10.16.3/bin/node
      Yarn: 1.19.0 - /usr/bin/yarn
      npm: 6.9.0 - ~/.nvm/versions/node/v10.16.3/bin/npm
    npmPackages:
      react: 16.8.3 => 16.8.3 
      react-native: 0.59.8 => 0.59.8 

API

  • [X] mount

Version

| library | version
| ------------------- | -------
| enzyme | 3.10.0
| react | 16.8.3
| react-dom | 16.10.1
| react-test-renderer | 16.8.3
| adapter (below) | 1.14.0

@ghasemikasra39 your react, react-dom, and react-test-renderer must be on the same minor version - your react-dom is on 16.10.

See solution at https://github.com/testing-library/react-hooks-testing-library/issues/151#issuecomment-523865511; this is likely due to version mismatch as mentioned above.

Instead of trying to upgrade react, you could also simply downgrade react-test-renderer so that they're all on the same version (in this case 16.6.3).

Is there a workaround for those of us who cannot simply up/downgrade npm modules? I'm using them in a react native app, so the react-dom isn't an issue.

@mjstelly react-dom is still an issue there, unless there's a react-native enzyme adapter i'm unaware of.

You are correct @ljharb. I just overlooked it in the enormously long list of packages. ;-)

I have the following
"react-dom": "^16.3.2"
"react-test-renderer": "^16.8.6",
"react": "16.6.3",
So, we're all over the map. I've informed the powers-that-be of this issue.

All three need to match the same minor version, so presumably the easiest is to upgrade react-dom to 16.6, and downgrade rect-test-renderer to 16.6.

I updated those packages in my local branch and the original find error went away. Of course, it created a different error and invalidated over 60 snapshots. Yikes! It broke other tests, as well. Like I mentioned earlier, though, it's not as simple as making a command decision to update npm packages.

So, since this issue is closed, should I create a different issue to address my original problem?

If your original problem still occurs when the deps are fixed, yes please :-)

I solved this by

  1. creating a test setup file called setup-tests.js ( directions here: https://airbnb.io/enzyme/docs/guides/react-native.html )
    i coped and pasted it into my root project folder with no modifications
  2. Added this to jest.config
    setupFilesAfterEnv: [
    "./setup-tests.js"
    ]
  3. I have these packages and versions:
    DEV dep:
    "enzyme": "^3.11.0",
    "enzyme-adapter-react-16": "^1.15.2",
    "jest": "^24.1.0",
    "jest-enzyme": "^7.1.2",
    "jsdom": "^16.0.0",
    DEP:
    "react-native": "0.60.5",
    "react-native-localize": "^1.3.3",

Note like WTF, i was using jsdom 6.0.1 and it had the above error: i changed it to 6.0.0
and it worked .

worked mean the error was gone and i my brake point after Mount got hit!

Was this page helpful?
0 / 5 - 0 ratings