False positives for react-native/no-raw-text

sudo-suhas commented 5 years ago

What version of TypeScript are you using? v3.1.6

What version of typescript-eslint-parser are you using? v21.0.1

What code were you trying to parse?

import React from 'react';
import { TextInput, View } from 'react-native';

export const Foo = () => (
    <View>
        <TextInput />
    </View>
);

What did you expect to happen? No errors should be reported. The code if formatted by prettier.

What happened?

➜ ./node_modules/.bin/eslint ./components/t.tsx

{prj_path}/components/t.tsx
  5:11  error  Whitespace(s) cannot be used outside of a <Text> tag  react-native/no-raw-text
  6:22  error  Whitespace(s) cannot be used outside of a <Text> tag  react-native/no-raw-text

✖ 2 problems (2 errors, 0 warnings)

My eslint config:

```yml env: node: true browser: true es6: true react-native/react-native: true parser: typescript-eslint-parser parserOptions: jsx: true extends: - airbnb - prettier plugins: - prettier - typescript - react-native settings: import/parser: typescript-eslint-parser: [ .ts, .tsx ] import/resolver: typescript: {} import/extensions: - .js - .jsx - .ts - .tsx rules: no-console: off no-undef: off no-unused-vars: off no-use-before-define: [ error, { functions: true, classes: true, variables: false }] lines-between-class-members: [ error, always, { exceptAfterSingleLine: true } ] quotes: [ warn, single, { avoidEscape: true } ] prettier/prettier: error import/prefer-default-export: off react/jsx-filename-extension: - error - extensions: - .js - .jsx - .tsx react/jsx-indent: off react/jsx-indent-props: off react/jsx-closing-tag-location: off react/jsx-one-expression-per-line: off react/destructuring-assignment: off react/sort-comp: - error - order: - static-methods - type-annotations - instance-variables - lifecycle - "/^on.+$/" - getters - setters - "/^(get|set)(?!(InitialState$|DefaultProps$|ChildContext$)).+$/" - instance-methods - everything-else - rendering groups: lifecycle: - displayName - propTypes - contextTypes - childContextTypes - mixins - statics - defaultProps - constructor - getDefaultProps - getInitialState - state - getChildContext - componentWillMount - componentDidMount - componentWillReceiveProps - shouldComponentUpdate - componentWillUpdate - componentDidUpdate - componentWillUnmount rendering: - "/^render.+$/" - render # https://github.com/Intellicode/eslint-plugin-react-native#configuration react-native/no-unused-styles: error react-native/no-color-literals: error react-native/no-raw-text: [ error, { skip: [ RBText ] } ] # https://github.com/nzakas/eslint-plugin-typescript#supported-rules typescript/adjacent-overload-signatures: error typescript/class-name-casing: error typescript/member-ordering: error typescript/no-angle-bracket-type-assertion: error typescript/no-array-constructor: error typescript/no-empty-interface: error typescript/no-inferrable-types: error typescript/no-namespace: [ error, { allowDefinitionFiles: true } ] typescript/no-parameter-properties: error typescript/no-triple-slash-reference: error typescript/no-unused-vars: error typescript/no-var-requires: error typescript/prefer-namespace-keyword: error ```

I double checked and the false positives do not occur with typescript-eslint-parser@v20.1.1.

mysticatea commented 5 years ago

Thank you for this issue.

However, it doesn't look like an issue in this parser. Since v21.0.0, the parser creates ESLint v5 AST and I suspect that the rule doesn't support the new AST.

sudo-suhas commented 5 years ago

Hey @mysticatea thank you for the quick response. I was not aware of this change. Should I close this issue and follow it up with eslint-plugin-react-native? There is no possibility of handling this issue in the scope of the parser right?

mysticatea commented 5 years ago

I'm not 100% sure :)

Would you try useJSXTextNode: false option in parserOptions? If the option fixed this issue, my guessing is correct.

https://github.com/eslint/typescript-eslint-parser#configuration

sudo-suhas commented 5 years ago

Yes, on setting the parser option, there are no false positives.

mysticatea commented 5 years ago

Thank you!

So, please open an issue on eslint-plugin-react-native repo. I'm closing this issue.

sudo-suhas commented 5 years ago

I am fairly sure I am the one who should be thanking you 😄

eslint / typescript-eslint-parser

False positives for react-native/no-raw-text #572