Javascript translations are loaded in the wrong order due to missing dependencies

Created on 4 February 2015, over 10 years ago
Updated 21 May 2025, 12 days ago

Problem/Motivation

The javascript translations file that enables translation of javascript strings is not loading, which may result in mixed languages on a page, as translation of server-side strings is working.

Previously, JS libraries can be loaded in core in 3 ways: by file weight, by scope (header, footer, etc.) and by the library dependency system. Currently, the file-weight method is planned to be removed (see 📌 Replace custom weights with dependencies in library declarations; introduce "before" and "after" for conditional ordering Needs work ) and many JS libraries have had their scope changed, being loaded in the footer (see #784626: Default all JS to the footer, allow asset libraries to force their JS to the header ).

Previously, the library loaded OK because a library it depends on, drupal/drupal, loaded in the same scope (header) and had a weight of -18, which meant it loaded first. Currently, the translation JS library is included first and tries to use the Drupal Javascript object, which causes an error. Plus, it's possible for drupal.js (and hence the Drupal JS object) to be loaded in either the header or the footer, depending on where it's needed. Which means that even regardless of the weight, the translations currently are easily loaded in the wrong scope too.

Steps to reproduce:

  1. Install Drupal 8.0.x, standard profile.
  2. Enable Language and Interface translations modules.
  3. Add a language with translations, e.g. Spanish.
  4. Go to http://yoursite/es
  5. See JS error "Uncaught reference error: Drupal is not defined" in the console in a file named es_very-long-hash.js

Beta phase evaluation

<!--Uncomment the relevant rows for the issue. -->

Proposed resolution


  1. This solution cannot work, see #7.
  2. Proper solution: Add a new library locale/translation with proper dependencies and replace the path to the generated JS file at runtime in hook_js_alter(). (Bonus: this allows us to remove drupal_js_defaults() from core, which serves no purpose anymore, and locale.module is the last caller).

    The translation library is a conditional dependency of core/drupal, i.e. core/drupal must depend on locale/translations, locale/translations must not depend on core/drupal! After all, it's drupal.js that uses the translations, the translations don't use drupal.js. We can use hook_js_alter() to ensure that is the case.

Remaining tasks

Feedback on #49

User interface changes

None.

API changes

No change record is needed, as there does not appear to be any backwards-compatibility-breaking API changes, based on looking at https://www.drupal.org/files/issues/js_translations-2419897-48.patch and not seeing any changes to function signatures.

🐛 Bug report
Status

Fixed

Version

8.0 ⚰️

Component

locale.module

Created by

🇩🇪Germany webflo

Live updates comments and jobs are added and updated live.
  • D8MI

    (Drupal 8 Multilingual Initiative) is the tag used by the multilingual initiative to mark core issues (and some contributed module issues). For versions other than Drupal 8, use the i18n (Internationalization) tag on issues which involve or affect multilingual / multinational support. That is preferred over Translation.

Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

Production build 0.71.5 2024