Thanks to visit codestin.com
Credit goes to github.com

Skip to content
This repository was archived by the owner on Jan 19, 2019. It is now read-only.
This repository was archived by the owner on Jan 19, 2019. It is now read-only.

Object spread in JSX causes lint errors to not show #512

Closed
@rhyek

Description

@rhyek

What version of TypeScript are you using?
3.0.3

What version of typescript-eslint-parser are you using?
18.0.0

What code were you trying to parse?

import React from 'react';
import styled from 'styled-components';
import CardContent from '@material-ui/core/CardContent';
import TextField from '../../../components/TextField';
import Title from '../../../components/Title';
import Button from '../../../components/Button';

const SendTransaction = props => (
  <Content>
    <Title>Send Payment</Title>
    <Section>
      <TextField
        name="receiveraddress"
        label="Receiver´s Address"
        value={props.receiveraddress}
        type="text"
        onChange={props.onChange}
      />
    </Section>
    <Section>
      <TextField
        name="receivername"
        label="Receiver´s Name (Optional)"
        value={props.receivername}
        type="text"
        onChange={props.onChange}
      />
    </Section>
    <Section>
      <TextField name="amount" label="Amount to Send" value={props.amount} type="text" {...props} />
    </Section>
    <Section>
      <Button onClick={props.makeTransaction} text="Make Payment" />
    </Section>
  </Content>
);

const Content = styled(CardContent)``;

const Section = styled.div`
  padding: 10px;
`;

export default SendTransaction;

What did you expect to happen?
I should get errors for react/prop-types.

What happened?
No errors.

.eslintrc.json
Tried 2:

{
  "parser": "typescript-eslint-parser",
  "parserOptions": {
    "ecmaVersion": 2018,
    "sourceType": "module",
    "ecmaFeatures": {
      "jsx": true
    }
  },
  "plugins": ["react"],
  "rules": {
    "react/prop-types": [1, { "ignore": ["children"] }]
  }
}

and:

{
  "env": {
    "es6": true
  },
  "parser": "typescript-eslint-parser",
  "parserOptions": {
    "ecmaVersion": 2018,
    "sourceType": "module",
    "ecmaFeatures": {
      "jsx": true,
      "spread": true,
      "experimentalObjectRestSpread": true
    }
  },
  "ecmaFeatures": {
    "spread": true,
    "experimentalObjectRestSpread": true
  },
  "plugins": ["react"],
  "rules": {
    "react/prop-types": [1, { "ignore": ["children"] }]
  }
}

Reason
It is due to the {...props}. As soon as I remove that, I get the react/prop-types errors.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions