Failed prop types in FakeSuspense (enzyme-adapter-react-16@1.15.4)

s100 commented 4 years ago

Current behavior

We have our unit tests rigged to fail if there are prop type errors. After upgrading to enzyme-adapter-react-16@1.15.4 (from 1.15.3), we find the following minimal test case causes a prop type error:

import { shallow } from 'enzyme'
import PropTypes from 'prop-types'
import React, { Component, Suspense } from 'react'

class MyComponent extends Component {
  render () {
    return (
      <Suspense fallback='loading...'>
        hello world
      </Suspense>
    )
  }
}

MyComponent.propTypes = {
  requiredString: PropTypes.string.isRequired
}

describe('<MyComponent />', () => {
  it('renders with no errors', () => {
    console.error = message => {
      throw Error(message)
    }
    shallow(<MyComponent requiredString='abc' />)
  })
})

The error we get is:

Error: Warning: Failed prop type: The prop `requiredString` is marked as required in `FakeSuspense`, but its value is `undefined`.
    in FakeSuspense

    at CustomConsole.console.error (C:\Users\...\MyComponent.spec.jsx:31:13)
    at printWarning (C:\Users\...\node_modules\prop-types\checkPropTypes.js:20:15)
    at checkPropTypes (C:\Users\...\node_modules\prop-types\checkPropTypes.js:82:11)
    at validatePropTypes (C:\Users\...\node_modules\react\cjs\react.development.js:1714:7)
    at Object.createElement (C:\Users\...\node_modules\react\cjs\react.development.js:1813:5)
    at transformSuspense (C:\Users\...\node_modules\enzyme-adapter-react-16\src\ReactSixteenAdapter.js:146:18)
    at renderElement (C:\Users\...\node_modules\enzyme-adapter-react-16\src\ReactSixteenAdapter.js:636:26)
    at fn (C:\Users\...\node_modules\enzyme-adapter-react-16\src\ReactSixteenAdapter.js:724:44)
    at withSetStateAllowed (C:\Users\...\node_modules\enzyme-adapter-utils\src\Utils.js:99:18)
    at Object.render (C:\Users\...\node_modules\enzyme-adapter-react-16\src\ReactSixteenAdapter.js:724:18)
    at new ShallowWrapper (C:\Users\...\node_modules\enzyme\src\ShallowWrapper.js:411:22)
    at shallow (C:\Users\...\node_modules\enzyme\src\shallow.js:10:10)
    at ...

I guess <FakeSuspense> is an Enzyme internal?

This worked in 1.15.3. We think the change in behaviour comes from #2443.

Expected behavior

Unless there's something about <Suspense> which I'm misunderstanding, I don't believe there should be any prop type error here. This unit test should pass.

Your environment

API

[x] shallow
[ ] mount
[ ] render

Version

library	version
enzyme	3.11.0
react	16.13.1
react-dom	16.13.1
react-test-renderer	16.13.1
adapter (below)

Adapter

[x] enzyme-adapter-react-16
[ ] enzyme-adapter-react-16.3
[ ] enzyme-adapter-react-16.2
[ ] enzyme-adapter-react-16.1
[ ] enzyme-adapter-react-15
[ ] enzyme-adapter-react-15.4
[ ] enzyme-adapter-react-14
[ ] enzyme-adapter-react-13
[ ] enzyme-adapter-react-helper
[ ] others ( )

ljharb commented 4 years ago

You're correct, this should not issue a warning.

s100 commented 4 years ago

Thank you for the prompt fix! Looking forward to the new release...

s100 commented 4 years ago

@ljharb Do you know when there is likely to be a new version of enzyme-adapter-react-16 released with this fix in?

ljharb commented 4 years ago

@s100 v1.15.5 has been released.

enzymejs / enzyme