eslint-plugin-react: react/prop-types does not validate missing propTypes for functions in version 7.11.1

The following patterns are considered warnings:

var Hello = createReactClass({
  render: function() {
    return <div>Hello {this.props.name}</div>;
  }
});

var Hello = createReactClass({
  propTypes: {
    firstname: PropTypes.string.isRequired
  },
  render: function() {
    return <div>Hello {this.props.firstname} {this.props.lastname}</div>; // lastname type is not defined in propTypes
  }
});

function Hello({ name }) {
  return <div>Hello {name}</div>;
}

This rule is not working in the latest version (7.11.1). Missing propTypes for functions are not marked anymore. This was working fine on 7.10.0

About this issue

Original URL
State: closed
Created 6 years ago
Reactions: 2
Comments: 30 (14 by maintainers)

Most upvoted comments

createReactClass is covered with 30+ test cases. Hard to imagine what could have gone wrong without a repro.

alexzherdev on Aug 28, 2018

I can’t provide blocks of code, the small example I’ve posted before is very similar with the one I encounter in my project. I just wanted to show the difference between the 2 versions with these screen captures

blackbird91 on Aug 29, 2018

Also having the same issue. It seems to be related to components which spread props. A minimal example, for me, is the following:

Working (has a linting error):

class Component extends React.PureComponent {
    render() {
        this.props.doesNotExist(); // `react/no-props` linting error
        return <div />;
    }
}

Not working (has no linting error):

class Component extends React.PureComponent {
    render() {
        this.props.doesNotExist(); // No linting error
        return <div {...this.props} />;
    }
}

bbthorntz on Sep 4, 2018

Ah, sorry for the confusion. All these issues were fixed in #1939, but that PR landed after 7.11.1. So you should expect them to get fixed in the next release. Except for the original one posted by @blackbird91, that one I still can’t figure out. I’d need to see the full code, including the render method.

alexzherdev on Sep 13, 2018

got it. sorry to bother. just saw it had been a long time. Thanks for all of the work you put in.

bdwain on Nov 19, 2018

I’m seeing the same (or same-ish) issue with 7.11.1. The following components have no linting messages:

const Component = ({ prop }) => <div {...prop} />;

class Component extends React.Component {
  render() {
    return <div {...this.props.prop} />;
  }
}

These ones, however, do generate warnings about missing propTypes validation:

const Component = ({ prop }) => <div prop={prop} />;

class Component extends React.Component {
  render() {
    return <div prop={this.props.prop} />;
  }
}

Might be related to destructuring and/or spreading?

asbjornh on Sep 11, 2018

v7.12.1 is released; closing. Please file a new issue if there’s still problems 😃

ljharb on Jan 2, 2019

A simple case that was caught in 7.10.0 & not caught by 7.11.1

import React from 'react';

export default class TestComponent extends React.Component {
  render() {
    const { prop, ...rest } = this.props;
    return <p {...rest}>{prop}</p>;
  }
}

7.10.0 output:

  5:13  error  'prop' is missing in props validation  react/prop-types

7.11.1 output shows no errors.

swrobel on Sep 9, 2018

@bdwain see #2046.

ljharb on Nov 19, 2018

any plans to do a release soon @ljharb ? It’s been a while and it would be great to not hard code the version anymore.

bdwain on Nov 19, 2018

I dropped back to 7.10.0 and that works correctly

benwill on Nov 1, 2018

Very excited for this fix, impatiently waiting for 7.11.2 for this fix to be released. In the meantime, do we know what the last working version for this was?

patrickvienneau on Oct 21, 2018