no-raw-text throws a TypeError on any template literal with no interpolations, which aborts the
whole lint run rather than reporting a lint error.
Reproduction
TypeError: Cannot read properties of undefined (reading 'name')
Occurred while linting <input>:1
Rule: "react-native/no-raw-text"
Standalone script:
import { Linter } from 'eslint';
import plugin from 'eslint-plugin-react-native';
const linter = new Linter();
const config = {
plugins: { 'react-native': plugin },
languageOptions: { parserOptions: { ecmaFeatures: { jsx: true } } },
rules: { 'react-native/no-raw-text': 'error' },
};
linter.verify('<View>{`hello`}</View>', config); // throws
Cause
lib/rules/no-raw-text.js:50-52:
const errorValue = node.type === 'TemplateLiteral'
? `TemplateLiteral: ${node.expressions[0].name}`
: node.value.trim();
The TemplateLiteral visitor runs for every template literal in a JSX expression container, but
node.expressions is [] when there are no interpolations, so node.expressions[0] is undefined.
There is a second, milder case: when expressions[0] is not an Identifier, .name is undefined
and the message degrades. <View>{hi ${a.b}}</View> currently reports:
Raw text (TemplateLiteral: undefined) cannot be used outside of a <Text> tag
Suggested fix
Both cases come from assuming expressions[0] exists and is an Identifier. Something like:
const templateLabel = (node) => {
const [first] = node.expressions;
if (!first) return node.quasis.map((q) => q.value.cooked).join('').trim();
return first.type === 'Identifier' ? first.name : context.sourceCode.getText(first);
};
That reports the literal text when there are no interpolations, and falls back to the expression's
source text otherwise, so the message stays useful in both cases.
Happy to open a PR if that's welcome — it's a small change and I have tests for both cases.
Environment
|
|
eslint-plugin-react-native |
5.0.0 |
eslint |
9.39.5 |
| Node |
24.16.0 |
no-raw-textthrows aTypeErroron any template literal with no interpolations, which aborts thewhole lint run rather than reporting a lint error.
Reproduction
Standalone script:
Cause
lib/rules/no-raw-text.js:50-52:The
TemplateLiteralvisitor runs for every template literal in a JSX expression container, butnode.expressionsis[]when there are no interpolations, sonode.expressions[0]isundefined.There is a second, milder case: when
expressions[0]is not anIdentifier,.nameisundefinedand the message degrades.
<View>{hi ${a.b}}</View>currently reports:Suggested fix
Both cases come from assuming
expressions[0]exists and is anIdentifier. Something like:That reports the literal text when there are no interpolations, and falls back to the expression's
source text otherwise, so the message stays useful in both cases.
Happy to open a PR if that's welcome — it's a small change and I have tests for both cases.
Environment
eslint-plugin-react-nativeeslint