CODEWITHSUNDEEP
reactjsjestjsreact-testing-library
Joe
Joe

Reputation: 546

Render method not working by using react-testing-library

I have trying to test the basic example provided in react-testing-library documentation. I exactly copied and pasted this code here

It's failing no matter what.

Here the failing test result:

shows the children when the checkbox is checked

    TypeError: Cannot read property 'current' of undefined

      34 | test('shows the children when the checkbox is checked', () => {
      35 |   const testMessage = 'Test Message'
    > 36 |   const {queryByText, getByLabelText, getByText} = render(
         |                                                    ^
      37 |     <HiddenMessage>{testMessage}</HiddenMessage>,
      38 |   )
      39 | 

      at act (node_modules/react-dom/cjs/react-dom-test-utils.development.js:983:55)
      at act (node_modules/react-dom/cjs/react-dom-test-utils.development.js:1418:12)
      at render (node_modules/@testing-library/react/dist/pure.js:82:26)
      at Object.<anonymous> (src/components/Authentication/SignUp/index.test.js:36:52)

  ● shows the children when the checkbox is checked

    TypeError: Cannot read property 'current' of undefined

      at act (node_modules/react-dom/cjs/react-dom-test-utils.development.js:983:55)
      at act (node_modules/react-dom/cjs/react-dom-test-utils.development.js:1418:12)
      at node_modules/@testing-library/react/dist/act-compat.js:57:20
      at asyncAct (node_modules/@testing-library/react/dist/act-compat.js:38:14)
      at Object.<anonymous> (node_modules/@testing-library/react/dist/index.js:28:35)

Test Suites: 1 failed, 1 total
Tests:       1 failed, 1 total
Snapshots:   0 total
Time:        2.318s, estimated 3s
Ran all test suites related to changed files.

Any ideas?

Upvotes: 2

Views: 7860

Answers (2)

aaronmgdr
aaronmgdr

Reputation: 83

I ran into this as well from my research it looks like the undefined which current is being called on is IsSomeRendererActing inside of https://github.com/facebook/react/blob/master/packages/react-dom/src/test-utils/ReactTestUtilsAct.js#L79

It looks like a global var shared between react packages. The best advise I can give is to check that react dom react and react test utils and any other react packages all are at the same version

Upvotes: 4

helloitsjoe
helloitsjoe

Reputation: 6529

This error is probably coming from inside the HiddenMessage component, rather than anything wrong in your test code. It looks like you’re trying to access current On something that doesn’t exist (maybe a ref?)

The test code looks right, you should track down where you’re trying to access current in HiddenMessage.

Upvotes: -1

Related Questions