Search: if language pack isn't available to load, it create a errors (404 showing in the console)

[formosattic]

Impacted plugin

Search

Quick summary

With Search, if there's no language pack available to install, the site will throw 404 error in the console, which is normal when there's no translation to download.

Failed to fetch i18n data: Error: HTTP request failed: 404

The 404 error can affect SEO ranking.

The issue is caused by a webpack plugin called i18n-loader, which handles i18n for frontend Jetpack projects.

@anomiex looked into it, the basic summary is that the issue happens where there's no language pack for the language the site has set. For PHP code, WP Core looks for the translations on the server side and finds none. Something similar happens for directly loaded JS: when it puts the reference to script into the page, WP Core looks for translations on the server side and finds none.

Search, however, has some lazily-loaded JS code: the JS that's directly loaded on the page waits until the user actually interacts with the search UI before downloading the code for the Instant Search popup, to save time and bandwidth for everyone who doesn't do a search. Since that load happens client-side, we also have to try to load the translations client-side, and the "finds none" is an HTTP 404. And yes, that logic for trying to load the translations isn't WP Core, they don't have any handling for lazily-loaded bundles.

References:

• Internal: p1739480350788039/1738683024.939459-slack-C02ME06LF
• Issue reported in 9326-gh-Automattic/jpop-issues and 9513-gh-Automattic/jpop-issues.

Steps to reproduce

I wasn't able to test it myself, but it happens on non-English site where Search doesn't have a language pack available for download.

We can see which languages are not 90% translated for Search at https://translate.wordpress.org/projects/wp-plugins/jetpack-search/

Site owner impact

Fewer than 20% of the total website/platform users

Severity

Minor

What other impact(s) does this issue have?

Platform revenue, Agency or developer revenue, Individual site owner revenue

If a workaround is available, please outline it here.

Option 1 -- Translate the language pack to 90%

In order for the language pack to be generated, it needs to reach 90% of completed translations, anyone can help with that.

You'd have to start from the Locales page https://translate.wordpress.org/ , then look for the Jetpack Search plugin, then translate the Stable (latest release) version.

For example, with German, you'd land on https://translate.wordpress.org/locale/de/default/wp-plugins/jetpack-search/

Option 2 -- Tweak to load partially translated language pack

It's also possible to download the incomplete an incomplete translation set to use on the site.
The option proposed here will require shell access and the WP CLI.

Steps, using German as an example:

1. Go to https://translate.wordpress.org/projects/wp-plugins/jetpack-search/stable/de/formal/
2. At the bottom, select "Portable Object Message Catalog (.po/.pot)" from the format dropdown, then use the Export link to download a file (which will probably be named wp-plugins-jetpack-search-stable-de.po)
   
3. Upload that file to their server, in the wp-content/languages/plugins/ directory. Rename it to jetpack-search-de_DE.po.
4. In that directory, run wp i18n make-json jetpack-search-de_DE.po and wp i18n make-mo jetpack-search-de_DE.po to generate the necessary .json and .mo files.

Note that if there's a need to update the translations later, then you'll want to delete all the files with names starting with jetpack-search-de_DE in that directory before repeating the above process to regenerate new files. This process will need to be done each time a new version of Jetpack Search is released.

Platform (Simple and/or Atomic)

Self-hosted, Atomic