Automattic / Automattic/jetpack

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

Open
#41,808 0 comments 0 reactions 1 assignee Claimed by @rudberga View on GitHub
[Feature] Search [Focus] i18n [Focus] Performance [Plugin] Jetpack [Plugin] Search [Pri] Low [Status] Auto-allocated [Status] Escalated to Product Ambassadors [Status] Priority Review Triggered Bug Instant Search Triaged
Dominant language
PHP
Stars
1.8k
Forks
898
Avg merge
1d 18h
Merged PRs (30d)
774

Description

### 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](https://github.com/Automattic/jetpack/blob/trunk/projects/packages/assets/src/js/i18n-loader.js), 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](https://wp-cli.org/).

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)
![Image](https://github.com/user-attachments/assets/3e2124d1-4285-4680-8b33-53aa9ea43e0b)
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

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.