wojtekmaj / enzyme-adapter-react-17

Unofficial adapter for React 17 for Enzyme.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Incorrect node name for nested components

paulclijsters opened this issue · comments

The node names changed after upgrading from react 16 with official enzyme-adapter-react-16.

Dependencies:

        "react": "^17.0.1",
        "@wojtekmaj/enzyme-adapter-react-17": "^0.4.1",
        "enzyme": "^3.11.0",
        "enzyme-to-json": "^3.6.1",

The following test can reproduce the problem (using jest):

    test.only('Nested component snapshot', () => {
        // Arrange
        const DummyComponent = (_, ref) => <div ref={ref} />;
        const MemoForwardComponent = React.memo(React.forwardRef<HTMLDivElement>(DummyComponent));
        const Component: React.FC = () => <MemoForwardComponent />;

        // Act
        const wrapper = shallow(<Component />);

        // Assert
        expect(wrapper).toMatchInlineSnapshot(`<Memo(ForwardRef(DummyComponent)) />`);
    });

This React 16 is succeeding, but with React 17 with @wojtekmaj/enzyme-adapter-react-17 v0.4.1 is failing with the following message:

  ● Nested component snapshot

    expect(received).toMatchInlineSnapshot(snapshot)

    Snapshot name: `Nested component snapshot 1`

    - Snapshot  - 1
    + Received  + 1

    - <Memo(ForwardRef(DummyComponent)) />
    + <Memo([object Object]) />

      19 |
      20 |     // Assert
    > 21 |     expect(wrapper).toMatchInlineSnapshot(`<Memo(ForwardRef(DummyComponent)) />`);
         |                     ^
      22 | });
      23 |
      24 |

Seems the

This is related to the following issue in the official enzyme react 16 adapter: enzymejs/enzyme#2481

Gotta love "self-fixing" bugs :D I appreciate your input mate!

Released in v0.5.0.