Bug: Class component with defaultProps not merging props correctly in componentDidMount

[amitdahan]

React version: 18.2.0

Steps To Reproduce

1. Have a lazy-wrapped, class-component with defaultProps, componentDidMount and componentWillUnmount.
2. Using StrictMode, on initial call to componentDidMount, this.props contains defaultProps correctly.
3. On 2nd mount - this.props isn't merged with defaultProps correctly.

const LazyComponent = lazy(
  async () =>
    class SomeComponent extends Component {
      static defaultProps = { someProp: true };
      componentDidMount() {
        // 1st mount - `true`
        // 2nd mount - `undefined`
        console.log(this.props.someProp);
      }
      componentWillUnmount() {}
      render() { /* ... */ }
    },
);

<StrictMode>
  <LazyComponent />
</StrictMode>

Link to code example:
https://stackblitz.com/edit/vitejs-vite-1ptuah?file=src%2Fmain.jsx

The current behavior

The StrictMode-triggered 2nd mount doesn't correctly merge defaultProps into this.props.

The expected behavior

this.props contains the specified defaultProps.

More context

I noticed each of the following works-around the issue:

• Wrapping the class-component in a function-component (before wrapping with lazy)
• Not using lazy
• Not defining a componentWillUnmount

Since this is happening in a 3rd-party which we wrap with lazy, the 1st option is a solid workaround for now.

Possibly related issues

• React.lazy: defaultProps not merged into props in commit phase lifecycles #13960

[eps1lon]

Thank you for the bug report and detailed repro! It also reproduces in Canary and Experimental release channels.

Keep in mind that this would only affect development since StrictMode has no effect in production.

[HermanBide]

has this been resolved?

[ayroblu]

Strange, I notice this on non StrictMode too