Skip to content

no-raw-text: TypeError on template literals with no interpolations aborts the lint run #341

Description

@theRizwan

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

<View>{`hello`}</View>
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

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions