Skip to main content

no-untranslated-string

Wrap user-facing text in a translation call such as trans.__().

Examples​

Translate a command label​

Incorrect

commands.addCommand('file-download', { label: 'Download' });

Correct

commands.addCommand('file-download', { label: trans.__('Download') });

Translate a label returned by a function​

Incorrect

commands.addCommand('file-download', { label: () => 'Download' });

Correct

commands.addCommand('file-download', { label: () => trans.__('Download') });

Translate accessibility labels​

Text read by assistive technology needs translation too. The equivalent node.ariaLabel assignment is checked as well.

Incorrect

node.setAttribute('aria-label', 'Download file');

Correct

node.setAttribute('aria-label', trans.__('Download file'));

Translate a widget title​

Incorrect

this.title.label = 'Source';

Correct

this.title.label = trans.__('Source');

Translate dialog text​

The same requirement applies to new Dialog().

Incorrect

showDialog({ title: 'Confirm', body: 'Are you sure?' });

Correct

showDialog({ title: trans.__('Confirm'), body: trans.__('Are you sure?') });

Translate a dialog button​

Incorrect

Dialog.okButton({ label: 'Build' });

Correct

Dialog.okButton({ label: trans.__('Build') });

Translate text assigned to the DOM​

Incorrect

element.textContent = 'Save';

Correct

element.textContent = trans.__('Save');

Translate labels passed in options​

Configured property names are checked even for custom widgets. This also covers a launcher entry’s category.

Incorrect

new MyField({ ...options, label: 'My field' });

Correct

new MyField({ ...options, label: trans.__('My field') });

Translate JSX text​

Wrapping raw text in braces, such as <span>{'Error message:'}</span>, does not translate it.

Incorrect

const message = <span>Error message:</span>;

Correct

const message = <span>{trans.__('Error message:')}</span>;

Translate a JSX attribute​

Incorrect

const checkbox = <MyCheckbox label="Enable feature" />;

Correct

const checkbox = <MyCheckbox label={trans.__('Enable feature')} />;

Translate both conditional branches​

Incorrect

const button = <button title={visible ? 'Hide layer' : 'Show layer'} />;

Correct

const button = (
  <button title={visible ? trans.__('Hide layer') : trans.__('Show layer')} />
);

Translate a fallback value​

Incorrect

const options = { label: name ?? 'Untitled' };

Correct

const options = { label: name ?? trans.__('Untitled') };

Why​

Untranslated labels remain in the original language even when users select a different language for JupyterLab. Translate visible text and accessibility labels so both sighted users and screen reader users receive localized text.

Options​

Defaults:

{
  "enforcePunctuation": false,
  "checkProperties": [
    "alt",
    "aria-description",
    "aria-label",
    "caption",
    "category",
    "label",
    "placeholder",
    "title",
    "tooltip",
    "textContent",
    "innerText"
  ]
}

enforcePunctuation​

Set to true to require translation of punctuation such as /, - and +. Blank strings and bare numbers are never reported.

// Reported only when enforcePunctuation is true.
item.textContent = '/';

checkProperties​

Names of object properties, DOM attributes, assignment targets and JSX attributes to check. Hyphenated and camelCase spellings are equivalent: either aria-label or ariaLabel covers both.

This list replaces the defaults. Pass [] to turn off these configurable checks. Command text, dialog text, dialog button labels and JSX text are still checked.

Which text is checked?

The rule checks string literals and template literals without interpolation in:

  • Command label, caption and usage properties, including concise arrow functions returning text.
  • showDialog() and new Dialog() titles and bodies.
  • Labels passed to Dialog.okButton(), cancelButton(), warnButton() and errorButton().
  • JSX text, including string literals inside braces.
  • The names in checkProperties, on any object or element.

Conditional branches and fallback expressions are checked separately. Because property checks apply regardless of the receiving object, a configured name can also match text that is not shown to users. Adjust checkProperties or disable the rule for an intentional exception.