1153445 - [RTL] Arabic icon labels are LTR and ellipsize on left

Status: VERIFIED FIXED

(Firefox OS Graveyard :: Gaia::Homescreen, defect, P2)

Description

[Sam Foster [:sfoster] (he/him)]

STR: 
1. Visit an arabic language page in browser
2. Use ... menu to 'Add to home screen' (أضِف إلى الشاشة الرئيسية )
3. Confirm the title in the prompt
4. Tap 'home' button to return to the homescreen

Expected: 
The icon label is in arabic script and truncated from the left. 

Actual:
The icon label is in arabic script and truncated from the right. 

I've confirmed in the IDE that this .title element has direction:ltr, not rtl as expected.

Comment 1

[Gregor Wagner [:gwagner]]

Adding Delphine for triage.

Comment 2

[Delphine Lebédel [:delphine - Use needinfo]]

Please remember to attach your bugs to an rtl meta bug so this gets caught by triage :) thanks.
Triage P2 -- nominating 

Lancy: can you please make sure you have a test case for this?

Comment 3

[Lancy(Leave from Mozilla)]

(In reply to Delphine Lebédel [:delphine - use need info] from comment #2) 
> Lancy: can you please make sure you have a test case for this?

Hi Delphine,
Test case has been added in moztrap:
https://moztrap.mozilla.org/manage/case/15480/

Comment 4

[GitHub Autolander Bot]

Attachment: [gaia] sfoster:homescreen-rtl-labels-bug-1153445 > mozilla-b2g:master

Comment 5

[Sam Foster [:sfoster] (he/him)]

Attachment: homescreen-mixed-labels.png

Screenshot with LRT homescreen and mixed-language icons on left, RTL on the right

Comment 6

[Sam Foster [:sfoster] (he/him)]

> Screenshot with LRT homescreen and mixed-language icons on left, RTL on the
> right

Er. vice-versa. Arabic/RTL on the left, En-us on right.

Comment 7

[Sam Foster [:sfoster] (he/him)]

Comment on attachment 8592475 [details] [review]
[gaia] sfoster:homescreen-rtl-labels-bug-1153445 > mozilla-b2g:master

Just adding dir="auto" to the title/label of the grid icons. Didnt see the value in a test for this markup change, but can whip up one (I guess marionette and getComputedStyle(..).direction check?) if you prefer. Also, this seems like the only spot where the change is needed, is that right?

Comment 8

[Kevin Grandon :kgrandon]

Comment on attachment 8592475 [details] [review]
[gaia] sfoster:homescreen-rtl-labels-bug-1153445 > mozilla-b2g:master

The code looks good to me. I can't really think of a solid test for this, and it seems fairly easy to regress/bypass a getComputedStyle check. Feel free to add one if you want, though I wouldn't consider it a blocker to landing.

Comment 9

[Sam Foster [:sfoster] (he/him)]

Comment on attachment 8592475 [details] [review]
[gaia] sfoster:homescreen-rtl-labels-bug-1153445 > mozilla-b2g:master

[Approval Request Comment]
[Bug caused by] (feature/regressing bug #): RTL/Homescreen
[User impact] if declined: In any locale, apps/icons on the homescreen in a RTL language get truncated and ellipsized from the right instead of left
[Testing completed]: Tested on device in en-US and ar as default locale, with a mix of english language and arabic icon labels
[Risk to taking this patch] (and alternatives if risky): V. Low, patch adds a single attribute to icon markup, don't anticipate any fallout. 
[String changes made]: None

Comment 10

[GitHub Autolander Bot]

Pull request has landed in master: https://github.com/mozilla-b2g/gaia/commit/777d01f4a2c7b41c4b02e3cf87715714ccc0590b

Comment 11

[Sam Foster [:sfoster] (he/him)]

v2.2: https://github.com/mozilla-b2g/gaia/commit/3f6a69270bb7cb33380d5d9965c3ace86e0d4afa

Comment 12

[Yeojin Chung [:YeojinC]]

This issue is verified fixed on Flame Master and 2.2.

Result: The Arabic title of a webpage added to the homescreen is truncated on the left side correctly.

Environmental Variables:
Device: Flame 3.0 (KK, 319mb, full flash)
Build ID: 20150416010206
Gaia: 629097847567e51095a454e7e63186a6e2ac0307
Gecko: a35163f83d22
Gonk: b83fc73de7b64594cd74b33e498bf08332b5d87b
Version: 40.0a1 (Master)
Firmware Version: v18D-1
User Agent: Mozilla/5.0 (Mobile; rv:40.0) Gecko/40.0 Firefox/40.0

Environmental Variables:
Device: Flame 2.2 (KK, 319mb, full flash)
Build ID: 20150416002504
Gaia: 8e24d8b7f5e7c74c3004b22710dda0dac3e04ead
Gecko: 41388836b5c6
Gonk: ebad7da532429a6f5efadc00bf6ad8a41288a429
Version: 37.0 (2.2)
Firmware Version: v18D-1
User Agent: Mozilla/5.0 (Mobile; rv:37.0) Gecko/37.0 Firefox/37.0