Method “type” is meant to be run on 1 node. 3 found instead

[totszwai]

React 17, using all the latest packages.

    "@emotion/css": "^11.5.0",
    "@emotion/react": "^11.6.0",
    "@emotion/styled": "^11.6.0",
    "@types/enzyme": "^3.10.10",
    "@types/enzyme-adapter-react-16": "^1.0.6",
    "@wojtekmaj/enzyme-adapter-react-17": "^0.6.5",
    "@mui/material": "^5.2.2",
    "@mui/styles": "^5.2.2",
    "enzyme": "^3.11.0",
    "enzyme-adapter-react-16": "^1.15.6",
    "enzyme-to-json": "^3.6.2",

I follow one of the enzyme unit test workaround to include Mui's ThemeProvider + styled-components's ThemeProvider

function UnitTestThemeWrapper (props: any) {
  // console.log(props.theme);
  return (
    <StyledEngineProvider injectFirst>
      <MuiThemeProvider theme={props.theme || LightTheme}>
        <ThemeProvider theme={props.theme || LightTheme}>
          <GlobalStyle />
          <CssBaseline />
          {props.children}
        </ThemeProvider>
      </MuiThemeProvider>
    </StyledEngineProvider>
  );
}

const shallowWithTheme = (node: ReactElement, options?: ShallowRendererProps): ShallowWrapper => {
  // The only way to get it to work, is to manually wraps the node ourselves.
  // return shallow(UnitTestThemeWrapper(node), options);

  // Note: For some reason the wrappingComponent from Enzyme is broken.
  // It would not properly calls the wrappingComponent when using shallow.
  // It throws a cryptic error message which has nothing to do with the issues:
  //    "Method “type” is meant to be run on 1 node. 3 found instead."
 
  options = options || {
    wrappingComponent: UnitTestThemeWrapper
  };
  return shallow(node, options); // <= this throw "Method type is meant to be run on 1 node. 3 found instead.
  // */
};

My UT only has the following:

describe('Blah', () => {
  let wrapper: ShallowWrapper | ReactWrapper;
  it('should render', () => {
    wrapper = shallow(<Menu open={false} anchorEl={dummy} />);
  });
});

How can I get this to work?

[wojtekmaj]

Does this work on React 16 with enzyme-adapter-react-16?

[totszwai]

@wojtekmaj Found the root cause, I posted it here on the official Enzyme's GitHub.
enzymejs/enzyme#2549

I dunno if you could tweak the adapter to make it smarter.

[wojtekmaj]

The purpose of this adapter is to provide best possible React 17 support based on WIP official Adapter that's in the works. So no, it's not going to be tweaked in any way, especially not changing its mechanics significantly.