1225497 - [Music][l10n] Flash of unlocalized text on first load and first render of each panel

Status: RESOLVED FIXED

(Firefox OS Graveyard :: Gaia::Music, defect)

Description

[Wilson Page [:wilsonpage]]

We're seeing a delay in localization of main document and of child iframe documents.

Comment 1

[Staś Małolepszy :stas]

I've been investigating this in bug 1222207 and it seems like this was broken by bug 1210720 even though I'm pretty sure I didn't see it back when I tested and landed it.

Backing out https://github.com/mozilla-b2g/gaia/commit/62a6dd4f3ab03b3e90152c35e6270519b600a1dd helps with the FOUC and also with the symptom of bug 1222207.  However, and this is completely puzzling to me, I also had to back out https://github.com/mozilla-b2g/gaia/commit/1c9a6ed5f334fa05a6c282b3c08b9f46aff21371 locally for everything to work as intended.

I'm not sure why but bug 1215293 appears to have broken the "Music" header, which always gets re-translated to English after the app loads.  Even more curiously, bug 1210720 seems to then fix it, but it introduces the FOUC and breaks the headers in subviews :/

Comment 2

[Staś Małolepszy :stas]

OK, I know what's going on.

When the Music app loads, index.html creates its own localization context and starts downloading music.properties.  At the same time, home.html is loaded into music-view-stack.  The code in js/app.js listens to the view's titlechange event and, once fired, calls setHeaderTitle to set the textContent of the header's h1.  Because of bug 1222207, this title is in English and it's what we're seeing right now for a brief moment.

What happens next is:  index.html's localization context finishes loading and finds the header h1 element which has data-l10n-id on it.  So it localizes it again, using data-l10n-id="music" and overwriting whatever was there already and what came from the titlechange event.

A simple solution is to remove data-l10n-id from the h1.  It appears that music-view-stack wants to manage its contents manually anyways.  We'll need to make sure we send the titlechange event when the language changes, too, which I think should happen in bug 1222207

Comment 3

[GitHub Autolander Bot]

Attachment: [gaia] stasm:1225497-music-fouc > mozilla-b2g:master

Comment 4

[Staś Małolepszy :stas]

Comment on attachment 8689556 [details] [review]
[gaia] stasm:1225497-music-fouc > mozilla-b2g:master

Zibi, what do you think?

Comment 5

[Staś Małolepszy :stas]

(In reply to Staś Małolepszy :stas from comment #2)

> We'll need
> to make sure we send the titlechange event when the language changes, too,
> which I think should happen in bug 1222207

This is actually already handled by js/view.js.

Comment 6

[Staś Małolepszy :stas]

Comment on attachment 8689556 [details] [review]
[gaia] stasm:1225497-music-fouc > mozilla-b2g:master

Zibi, let's fix this for now so that bug 1222207 can also be fixed.

I filed bug 1228021 to discuss other ways of applying translations programmatically in a secure manner.

Comment 7

[Staś Małolepszy :stas]

Comment on attachment 8689556 [details] [review]
[gaia] stasm:1225497-music-fouc > mozilla-b2g:master

Justin, can you take a look at this as well?  Together with bug 1222207, this fixes the FOUC in the header.

Comment 8

[Justin D'Arcangelo [:justindarc]]

Comment on attachment 8689556 [details] [review]
[gaia] stasm:1225497-music-fouc > mozilla-b2g:master

LGTM! Can you make the same change to open.html and pick.html too? Just making sure that this issue doesn't still occur with activities. Thanks!

Comment 9

[Staś Małolepszy :stas]

Thanks, Justin!

https://github.com/mozilla-b2g/gaia/commit/24ed003a53a81f63367e265fa7117cbe7d23d4c8

I also removed one string (picker-title) which didn't appear to be used anywhere anymore.