no-raw-text fails on line breaks

[jasonschock]

I don't expect no-raw-text to fail in this case according to the tests, but it does for me.

import React from "react";
import { View, Text } from "react-native";

export default class Test extends React.Component {
  constructor() {
    super();
    this.state = {};
  }

  render() {
    return (
      <View>
        <Text>Some text.</Text>
      </View>
    );
  }
}

Run eslint:

/myproject/src/components/Test.js
  12:13  error  Whitespace(s) cannot be used outside of a <Text> tag  react-native/no-raw-text
  13:40  error  Whitespace(s) cannot be used outside of a <Text> tag  react-native/no-raw-text

It's specifically complaining at the line endings. 🤔

Ideas? Editor line endings are \n. Here's the relevant config:

.eslintrc

{
  "parserOptions": {
    "ecmaVersion": 2018,
    "ecmaFeatures": {
      "jsx": true
    }
  },
  "plugins": [
    "react",
    "react-native",
    "prettier"
  ],
  "env": {
    "react-native/react-native": true
  },
  "extends": [
    "airbnb",
    "plugin:react-native/all",
    "plugin:prettier/recommended"
  ],
  "rules": {
    "prettier/prettier": "error",
    "react/jsx-filename-extension": ["error", { "extensions": [".js", ".jsx"] }]
  }
}

package.json:

{
  "name": "empty-project-template",
  "main": "./index.js",
  "private": true,
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "eject": "expo eject",
    "prettier": "prettier src/{,**/}*.js --write",
    "eslint": "eslint src/"
  },
  "dependencies": {
    "expo": "^30.0.1",
    "prop-types": "^15.6.2",
    "react": "16.3.1",
  },
  "devDependencies": {
    "eslint": "^5.9.0",
    "eslint-config-airbnb": "^17.1.0",
    "eslint-config-prettier": "^3.3.0",
    "eslint-plugin-import": "^2.14.0",
    "eslint-plugin-jsx-a11y": "^6.1.2",
    "eslint-plugin-prettier": "^3.0.0",
    "eslint-plugin-react": "^7.11.1",
    "eslint-plugin-react-native": "^3.5.0",
    "prettier": "^1.15.3"
  }
}

Thanks!

[AleksandrZhukov]

will check it

[donovanhiland]

I'm getting the same thing. Something I can do to help look at this?

[gxsshallot]

+1

[donovanhiland]

#208 dupe?

[AleksandrZhukov]

@jasonschock @donovanhiland
can't reproduce the issue 😞
can you create a gist with your code?

[jdrorrer]

I'm seeing this same issue. It looks like it's related to: #208

[AleksandrZhukov]

@jdrorrer pls describe your environment

[donovanhiland]

I’ll see if I can get a repo up today with the issue

[donovanhiland]

@AleksandrZhukov https://github.com/donovanhiland/eslint-plugin-react-native-210

yarn install
yarn test

should give you the errors

  25:38  error  Raw text (this is bad) cannot be used outside of a <Text> tag  react-native/no-raw-text
  27:69  error  Whitespace(s) cannot be used outside of a <Text> tag           react-native/no-raw-text
  28:78  error  Whitespace(s) cannot be used outside of a <Text> tag           react-native/no-raw-text
  29:64  error  Whitespace(s) cannot be used outside of a <Text> tag           react-native/no-raw-text

The first is expected, the other 3 is the issue

[AleksandrZhukov]

@donovanhiland thanks a lot, your repo was very useful
PR with fix is here #220

[AleksandrZhukov]

@Intellicode can you create a new release? 🙏

[Intellicode]

@AleksandrZhukov done, sorry for the wait, but had to fix npm audit issues :)