Issue with mount method

[Dave Bergschneider]

I have several tests that use mount() and currently using it.skip since I've updated to React 17 and this adapter for enzyme. I'm at a loss because I am having to skip a lot of tests that worked with React 16 and enzyme-adapter-react-16. Anything you recommend that I try?

The error I am seeing: (file paths omitted)

The Tests. First one passes and second one fails.

import React from 'react';
import { mount } from 'enzyme';
import RedirectLink from '../index';

jest.mock('react-router-dom');

describe('<RedirectLink />', () => {
  let defaultProps: any;

  beforeEach(() => {
    defaultProps = {
      key: 'key',
      value: 'value',
    };
  });

  it('should be defined', () => {
    expect(<RedirectLink {...defaultProps} />).toBeDefined();
  });

  it('should render', () => { //TODO: Fix tests for React 17
    const wrapper = mount(<RedirectLink {...defaultProps} />);
    expect(wrapper).toBeDefined();
  });
});

Here's the component code

import React from 'react';
import { Link } from 'react-router-dom';

export interface RedirectLinkProps {
  key: string;
  value: string;
}

export const RedirectLink: React.FC<RedirectLinkProps> = (key, value) => {
  const link = `/some-slug?${key}=${value}`;
  return <Link to={link}>{value}</Link>;
};

export default RedirectLink;

[Wojciech Maj]

You sure that works for React 16? Because I'm pretty sure

jest.mock('react-router-dom');

will replace react-router-dom with an empty module, which would cause attempt to render <Link> to cause a crash.

[Dave Bergschneider]

You sure that works for React 16? Because I'm pretty sure

jest.mock('react-router-dom');

will replace react-router-dom with an empty module, which would cause attempt to render <Link> to cause a crash.

Yes, I am 100% sure it worked. Nothing here has changed other than the TODO comment I had added. Without jest.mock('react-router-dom') an invariant failed error. This is just the most basic component in my stack I could use as an example.

[Amar Mohamud]

I am having a similar issue now, how did you work around it. I upgraded my app from react 16 to react 17 and enzyme-adapter-react-17

[Angel Lam]

I had a similar issue when using mount. where this error message appeared:
mockConstructor(...): Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null.

I re-did some tests, and noticed that some of my components where mocked incorrectly.

jest.mock('../../somecomponent', jest.fn(<div>children</div>))

changed to

jest.mock('../../somecomponent', () => <div>children</div>)

So always check your mocks before testing.

I haven't really found the main issue yet, but I hope this helps