Enzyme: "TypeError: Right-hand side of 'instanceof' is not an object" when updating from React 16.4.2 to 16.5.x

[wojtekmaj]

Describe the bug
When updating from React 16.4.2 to 16.5.x, my tests are breaking. The only thing that's changed between these two rests runs is updating react, react-dom and react-test-renderer from 16.4.2 to 16.5.0.

To Reproduce
Steps to reproduce the behavior:

  it('should call onConfirm function', () => {
    const onConfirmSpy = sinon.spy();
    const wrapper = mount(
      <MyComponent
        size={0}
        onConfirm={onConfirmSpy}
      />
    );

    wrapper.setProps({
      size: 1,
    });
    wrapper.update();
    wrapper.find('.some-classname .some-other-classname').simulate('click');

    expect(onConfirmSpy).to.be.calledOnce;
  });

Desktop (please complete the following information):

• OS: [e.g. iOS] Windows 10
• Browser [e.g. chrome, safari] n/a
• Version [e.g. 22] n/a

Additional context
Add any other context about the problem here.

Here's a full stacktrace:

  1) <BookSlotPrompt /> component
       should call onConfirm function:
     TypeError: Right-hand side of 'instanceof' is not an object
      at getActiveElementDeep (node_modules\react-dom\cjs\react-dom.development.js:5183:18)
      at getSelectionInformation (node_modules\react-dom\cjs\react-dom.development.js:5214:21)
      at prepareForCommit (node_modules\react-dom\cjs\react-dom.development.js:8411:26)
      at commitRoot (node_modules\react-dom\cjs\react-dom.development.js:15832:3)
      at completeRoot (node_modules\react-dom\cjs\react-dom.development.js:17296:3)
      at performWorkOnRoot (node_modules\react-dom\cjs\react-dom.development.js:17224:9)
      at performWork (node_modules\react-dom\cjs\react-dom.development.js:17128:7)
      at performSyncWork (node_modules\react-dom\cjs\react-dom.development.js:17100:3)
      at requestWork (node_modules\react-dom\cjs\react-dom.development.js:16988:5)
      at scheduleWork (node_modules\react-dom\cjs\react-dom.development.js:16782:5)
      at scheduleRootUpdate (node_modules\react-dom\cjs\react-dom.development.js:17470:3)
      at updateContainerAtExpirationTime (node_modules\react-dom\cjs\react-dom.development.js:17497:10)
      at updateContainer (node_modules\react-dom\cjs\react-dom.development.js:17524:10)
      at ReactRoot.render (node_modules\react-dom\cjs\react-dom.development.js:17786:3)
      at C:\Users\wojciech.maj\Projekty\Raven\node_modules\react-dom\cjs\react-dom.development.js:17926:14
      at unbatchedUpdates (node_modules\react-dom\cjs\react-dom.development.js:17351:10)
      at legacyRenderSubtreeIntoContainer (node_modules\react-dom\cjs\react-dom.development.js:17922:5)
      at Object.render (node_modules\react-dom\cjs\react-dom.development.js:17981:12)
      at getFiber (node_modules\enzyme-adapter-react-16\build\detectFiberTags.js:49:25)
      at detectFiberTags (node_modules\enzyme-adapter-react-16\build\detectFiberTags.js:101:17)
      at ReactSixteenAdapter.createMountRenderer (node_modules\enzyme-adapter-react-16\build\ReactSixteenAdapter.js:291:56)
      at ReactSixteenAdapter.createRenderer (node_modules\enzyme-adapter-react-16\build\ReactSixteenAdapter.js:518:25)
      at new ReactWrapper (node_modules\enzyme\build\ReactWrapper.js:117:30)
      at mount (node_modules\enzyme\build\mount.js:21:10)
      at Context.<anonymous> (dist\server\server-bundle.js:13713:37)

[ljharb]

You'll note that the error is coming from inside React itself - does your component render properly in the browser?

(react-test-renderer shouldn't be needed at all, fwiw)

[wojtekmaj]

Yes, it renders flawlessly in the browser, and it always had. I'm really confused by this.

[ljharb]

Can you share the component code?

[wojtekmaj]

I have re-run the tests and it's getting pretty crazy. I've ran my tests with **/[Mm]*.spec.js pattern and once again, the tests have failed.

1) <MyComponent/> component
       should call onConfirm function:
     TypeError: Right-hand side of 'instanceof' is not an object

Yet, when I ran my tests with **/MyComponent.spec.js pattern, the test passed flawlessly!

So this gave me a hint that the test is fine, but another one somehow affects it and crashes it. I have managed to narrow that down to one test suite which contained:

  const windowLocationCopy = global.window.location;

  beforeEach(() => {
    global.window = Object.assign({}, global.window, { location: { href: 'testUrl' } });
  });

  afterEach(() => {
    global.window.location = windowLocationCopy;
  });

Still, I'm not sure how this used not to cause any issues in React <16.5.

[ljharb]

hmm - global.window shouldn't be reassignable if it's properly shimmed (or if it's in a browser) - you may want to look into https://npmjs.com/jest-wrap, but it definitely seems like you're getting some kind of test pollution :-/

[wojtekmaj]

Thanks for this! Will certainly be helpful for us. I guess we could close this ticket because there's nothing you could have done to prevent this from happening.