Eslint-plugin-react: v7.12.0 update throw is missing in props validation (react/prop-types)

[Unsfer]

After updating to v7.12.0 appeared strange validation errors.

I have this propTypes:

propTypes = {
    actions: PropTypes.object.isRequired,
};

and this code:

componentWillReceiveProps (nextProps) {
    this.props.actions.doSomething();
}

componentWillUnmount () {
    this.props.actions.doSomething();
}

And then I have eslint error: 'doSomething' is missing in props validation react/prop-type
on the line in componentWillReceiveProps. But the line in componentWillUnmount is ok.
Strange that it says "'doSomething' is missing" and not "'actions.doSomething' is missing"

I tried to change "PropTypes.object" to "PropTypes.shape", still the same.

Error disappears if I change name "componentWillReceiveProps" to something else.
If I add propType "doSomething: PropTypes.func.isRequired" error disappears too but it doesn't make sense.

[ljharb]

In this case, your actions propType should not be object, it should be shape, and specify that doSomething is a function.

[igorroch]

Similar issue when we have Ref element like this:

componentDidUpdate() { this.inputRef.focus(); }

error 'focus' is missing in props validation react/prop-types

Update: Also other standard methods like Array.findIndex, Array.length throw this error.

[ljharb]

Now that is a bug - accessing things chained off of this.props should error, but not things off of this.

cc @alexzherdev

[Unsfer]

As I said, I tried to change to PropTypes.shape

propTypes = {
    actions: PropTypes.shape({
        doSomething: PropTypes.func.isRequired,
    }).isRequired,
};

Error still the same

[Studio384]

I'm having a similar issue:

shouldComponentUpdate(nextProps) {
  if (this.props.search !== nextProps.search) {
    let query = nextProps.query;
    let result = nextProps.list.filter(item => {
      return (item.name.toLowerCase().includes(query.trim().toLowerCase()));
    });

    this.setState({ result });

    return true;
  }
}

And am getting the following errors since 7.12

  ⚠  91:51  'filter' is missing in props validation       react/prop-types
  ⚠  92:37  'toLowerCase' is missing in props validation  react/prop-types
  ⚠  93:34  'toLowerCase' is missing in props validation  react/prop-types

[dlarin]

after update 7.12
``` componentDidUpdate (prevProps, prevState, snapshot) {
if (!prevProps.show && this.props.show) {
document.body.style.overflow = 'hidden'
} else if (prevProps.show && !this.props.show) {
document.body.style.overflow = 'auto'
}
}

43:27 error 'style' is missing in props validation react/prop-types
43:33 error 'overflow' is missing in props validation react/prop-types
43:33 error 'style.overflow' is missing in props validation react/prop-types
45:27 error 'style' is missing in props validation react/prop-types
45:33 error 'overflow' is missing in props validation react/prop-types
45:33 error 'style.overflow' is missing in props validation react/prop-types

✖ 6 problems (6 errors, 0 warnings)```

[devitito]

Same problem

[G100g]

Hi,
also this code throw a error after upgrading to 7.12

componentDidUpdate() {
...
        const {
            first_organization,
            second_organization,
        } = this.state;
...

155:13  error  'state.first_organization' is missing in props validation   react/prop-types
156:13  error  'state.second_organization' is missing in props validation  react/prop-types

Thank you for your work.

[gargroh]

Facing same issue.

[brettjthom]

Is prop validation cascading down an object new behavior?

For code like this just started failing as well. The "obj" is in props validation. ('a' is missing in props validation react/prop-types). From what I have noticed it seems to only throw on the lifecycle functions. I use children of the object in the render and it doesn't error.

componentWillReceiveProps(nextProps) {
    if (nextProps.obj.a!== this.props.obj.a) {
        ...
    }
}`

`

It's also checking state it seems now. Again only noticed it on lifecycle functions
'working' is missing in props validation react/prop-types

shouldComponentUpdate(nextProps, nextState) {
    if (nextState.working === this.state.working) {
        return false;
    }
    return true;
}

`

[ljharb]

Thanks everybody; if you have different code that's erroring, please post it. If you're just experiencing the same issue, please add an emoji reaction to the original post.

This is an accepted bug; we just need someone to work on it.

[jomasti]

Looks like one of the problems is from #1946 via the change in the logic for isPropTypesUsage to use inLifeCycleMethod.

[HarikaSabbella]

@ljharb When will this fix be released to NPM?

[ljharb]

v7.12.1 is released.

[ajfarkas]

Stupid question: if the prop is not required, why does this rule require us to define it?
Wouldn't that make it… required?

Just really annoyed that this minor change broke my build and made me go through all of my files by hand.

[ljharb]

@ajfarkas "required" means that element creators can omit it at runtime; it doesn't mean that when provided it doesn't have a contract to adhere to.