Closed Bug 1035430 Opened 8 years ago Closed 8 years ago

[B2G][l10n][2.0][Notification Bar] Tamil: The string "{{appName}}: {{name}}" appears truncated

Categories

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

ARM
Gonk (Firefox OS)
defect
Not set
normal

Tracking

(blocking-b2g:2.0+, b2g-v2.0 verified, b2g-v2.1 verified)

VERIFIED FIXED
2.0 S6 (18july)
blocking-b2g 2.0+
Tracking Status
b2g-v2.0 --- verified
b2g-v2.1 --- verified

People

(Reporter: rkunkel, Assigned: gmarty)

References

Details

(Whiteboard: LocRun2.0, [systemsfe])

Attachments

(5 files, 1 obsolete file)

Attached image screenshot
Description:
When the user swipes from the top of the screen to the bottom to bring up the notifications pull-down, while in another language it is expected the string "{{appName}}: {{name}}" appears without truncation.

Setup Steps:
1) Settings > Language > ta-Tamil

Repro Steps:
1) Update a Flame device to BuildID: 20140707000200
2) Settings > Keyboard
3) Selected keyboards > Add more keyboards
4) Messaging App > create a new message
5) Swipe from the top of the screen to the bottom to bring up the notifications pull-down

Actual:
Observe the string "{{appName}}: {{name}}" appears truncated

Expected:
Translated strings do not appear truncated

Environmental Variables:
Device: Flame 2.0
BuildID: 20140707000200
Gaia: ef67af27dff3130d41a9139d6ae7ed640c34d922
Gecko: f53099796238
Version: 32.0a2
Firmware Version: v122
2.0 - Mozilla/5.0 (Mobile; rv:32.0) Gecko/32.0 Firefox/32.0

Repro frequency: 100%
Link to failed test case https://moztrap.mozilla.org/manage/case/12568/
See attached: screenshot
This issue does not occur in the latest 1.4 branch

Environmental Variables:
Device: Flame 1.4
BuildID: 20140707000200
Gaia: 5c9e1e4131d3ac8915ed88b72bb66dc7d97be6a0
Gecko: 2d0c15450488
Version: 30.0 (1.4) 
Firmware Version: v122
User Agent: Mozilla/5.0 (Mobile; rv:30.0) Gecko/30.0 Firefox/30.0

Tamil was introduced in 2.0.
QA Whiteboard: [QAnalyst-Triage?]
Flags: needinfo?(ktucker)
The user shouldn't be able to scroll horizontally like on the screenshot, the text in the notification should be truncated instead.

Also "xx minutes ago" in blue shouldn't overlap with the notification, Firefox OS is supposed to truncate. It may be related to the Tamil font.

Asking blocking-b2g2.0
blocking-b2g: --- → 2.0?
Whiteboard: LocRun2.0 → LocRun2.0, [systemsfe]
blocking-b2g: 2.0? → 2.0+
I will work on it tomorrow
Assignee: nobody → gmarty
QA Whiteboard: [QAnalyst-Triage?] → [QAnalyst-Triage+]
Flags: needinfo?(ktucker)
Target Milestone: --- → 2.0 S6 (18july)
Also, the 'Clear all' message wraps. Not sure how to fix it though as expanding its container may have an impact on other locales. Can we request a shorter translation?
Attached file Github PR
This bug fixes the following things:
* Keyboard IME notification: text is now truncated and ellipsed
* 'Clear all': button doesn't wrap anymore (fits in 1 line in Tamil)
* 'xx minutes ago': 
  * Time indicator: set max-width + increased of 1 rem
  * Message: Fixed width
  -> There is an overlap in many languages. This solution is a quick fix but is not ideal.

Alive, can you have a look?

With that, we still need shorter strings in Tamil for:
* Clear all
* xx minutes ago
Attachment #8453077 - Flags: review?(alive)
Unfortunately I don't have tamil language.
Could you append some screenshot of your fix
for english and for tamil?
Attached image screenshot in Tamil
Attached image Screenshot in English (obsolete) —
Alive: there you go. See screenshot above.
Flags: needinfo?(alive)
Comment on attachment 8453077 [details] [review]
Github PR

css change only, r=me, thank you!
Attachment #8453077 - Flags: review?(alive) → review+
Flags: needinfo?(alive)
Comment on attachment 8453077 [details] [review]
Github PR

I know this is tricky to get the layout right in this area, but now even English is truncated, see https://bug1035430.bugzilla.mozilla.org/attachment.cgi?id=8453755
We can't change the allowed space at this point.

Also, why is Tamil truncated on this screenshot ahead of English? (There is space left that is unused)
Attachment #8453077 - Flags: feedback-
I'm not familiar with Tamil, but truncation only happens between 2 characters and character width in Tamil are much larger than in English. This issue is very likely to happen in Chinese or Japanese where characters are square shaped (i.e. width === height).
Comment on attachment 8453077 [details] [review]
Github PR

I reworked the notification message to use flexbox. It doesn't change much in Tamil, but in English, the text message adapts to get longer when the timestamp text is shorter than the max-width.

There is a JavaScript change in this update, so Alive can you please review it?
Attachment #8453077 - Flags: review?(alive)
Attachment #8453077 - Flags: review+
Attachment #8453077 - Flags: feedback?(tchevalier)
Attachment #8453077 - Flags: feedback-
Attached image Screenshot in English
Here's a screenshot that demonstrates the new layout in flexbox. The English text is not truncated anymore.
Attachment #8453755 - Attachment is obsolete: true
QA Whiteboard: [QAnalyst-Triage+] → [QAnalyst-Triage+][lead-review+]
Comment on attachment 8453077 [details] [review]
Github PR

Hi Guillaume,

Thanks for taking care of it! I flashed my Flame with your patch and played with it a bit with different locales, and so far it looks great. No more overlaps, and most locales have even more room for the notification text, which is really, really helpful here. Thanks! f+

About Tamil truncation, yeah you're right, that explains the subtle difference with English.
Attachment #8453077 - Flags: feedback?(tchevalier) → feedback+
Comment on attachment 8453077 [details] [review]
Github PR

thank you for your patience.
Attachment #8453077 - Flags: review?(alive) → review+
Whiteboard: LocRun2.0, [systemsfe] → LocRun2.0, [systemsfe][ETA=7/16]
Landed as of https://github.com/mozilla-b2g/gaia/commit/0754b52c7d279203c031b3ec61c778b2bdc61283
Status: NEW → RESOLVED
Closed: 8 years ago
Resolution: --- → FIXED
Guillaume - it appears that this is causing integration tests to fail, see:  https://tbpl.mozilla.org/?rev=2ce2565091f0f3d00719e71407c46ae5e8ea4400&tree=Gaia-Try

Can we either quickly fix this or back it out? Thanks!
Flags: needinfo?(gmarty)
Depends on: 1038722
Flags: needinfo?(gmarty)
Whiteboard: LocRun2.0, [systemsfe][ETA=7/16] → LocRun2.0, [systemsfe]
Verified fixed on Flame 2.0 with Tamil

Gaia      5ba22d458fdb63bd72c59de53c701d0efe35c1e2
Gecko     https://hg.mozilla.org/releases/mozilla-b2g32_v2_0/rev/6fbc60a80c6d
BuildID   20140806000200
Version   32.0
ro.build.version.incremental=110
ro.build.date=Fri Jun 27 15:57:58 CST 2014
B1TC00011230
Status: RESOLVED → VERIFIED
Keywords: verifyme
Attached image Screenshot
This issue has been verified successfully on Flame 2.1.
See attachment: Verify_Screenshot.png
Reproducing rate: 0/3

Flame2.1 build:
Gaia-Rev        38e17b0219cbc50a4ad6f51101898f89e513a552
Gecko-Rev       https://hg.mozilla.org/releases/mozilla-b2g34_v2_1/rev/8b92c4b8f59a
Build-ID        20141205001201
Version         34.0
You need to log in before you can comment on or make changes to this bug.