Closed Bug 1135972 Opened 5 years ago Closed 5 years ago

[RTL][Privacy Control] Direction of 'Next' and 'Back' buttons contradict with page indicator on Guided Tour page

Categories

(Firefox OS Graveyard :: Gaia::Settings, defect, P1)

ARM
Gonk (Firefox OS)
defect

Tracking

(blocking-b2g:2.2+, b2g-v2.2 verified, b2g-master verified)

VERIFIED FIXED
2.2 S9 (3apr)
blocking-b2g 2.2+
Tracking Status
b2g-v2.2 --- verified
b2g-master --- verified

People

(Reporter: pcheng, Assigned: marta)

References

Details

(Whiteboard: [3.0-Daily-Testing])

Attachments

(2 files)

Description:
On Guided Tour page, the buttons and even the page flipping animation are mirrored, but the page indicator is not. It makes navigating the Tour counterintuitive.

Prerequisite:
In RTL language

STR:
1) Go to Settings > Privacy Controls and start the Guided Tour
2) Observe the position of Next / Back buttons and the page indicator dots above them.

Expected: If Next is on the left side of the screen, the page indicator highlighted dot should start on the right (so when you hit Next, the highlighted dot goes one left).

Actual: The Next button is on the left, page indicator highlighted dot starts on the left.

See video:
https://www.youtube.com/watch?v=K0nEpjppEO0

Tested on:
Device: Flame 3.0 Master (full flash, 319MB)
BuildID: 20150223103044
Gaia: 288bf1c58ef9ccecd68508978a0141ee71974681
Gecko: 9b077c6f3d02
Gonk: e7c90613521145db090dd24147afd5ceb5703190
Version: 39.0a1 (3.0 Master) 
Firmware Version: v18D-1
User Agent: Mozilla/5.0 (Mobile; rv:39.0) Gecko/39.0 Firefox/39.0
This issue also occurs on Flame 2.2. Button direction and page indicator contradict each other.

Device: Flame 2.2
BuildID: 20150220002501
Gaia: ce79d35b92261e7cbfeaefebf87859ebeb0979b4
Gecko: b864abe1c6b3
Gonk: e7c90613521145db090dd24147afd5ceb5703190
Version: 37.0a2 (2.2) 
Firmware Version: v18D-1
User Agent: Mozilla/5.0 (Mobile; rv:37.0) Gecko/37.0 Firefox/37.0
Blocks: settings-rtl
QA Whiteboard: [rtl-impact][QAnalyst-Triage?]
Flags: needinfo?(ktucker)
Whiteboard: [3.0-Daily-Testing]
blocking-b2g: --- → 2.2+
We may already have a DUP for this, please DUP if you find the bug #
Priority: -- → P1
QA Whiteboard: [rtl-impact][QAnalyst-Triage?] → [rtl-impact][QAnalyst-Triage+]
Flags: needinfo?(ktucker)
Keywords: qawanted
Requesting qa to help check if this issue occurs or we can mark it resolved WFM.
QA Contact: pcheng
This issue is still occurring on latest master. Next button is on the left, and page indicator starts on the left.

Device: Flame 3.0 Master (shallow flash 319MB)
BuildID: 20150304133643
Gaia: eff3321ab4e65da3f906688ebb55ddf1e93d9452
Gecko: 56492f7244a9
Version: 39.0a1 (3.0 Master) 
Firmware Version: v18D-1
User Agent: Mozilla/5.0 (Mobile; rv:39.0) Gecko/39.0 Firefox/39.0
QA Whiteboard: [rtl-impact][QAnalyst-Triage+] → [rtl-impact][QAnalyst-Triage?]
Flags: needinfo?(ktucker)
Keywords: qawanted
QA Whiteboard: [rtl-impact][QAnalyst-Triage?] → [rtl-impact][QAnalyst-Triage+]
Flags: needinfo?(ktucker)
Hi Marta, can you help with this bug? Thank you.
Flags: needinfo?(marta)
Hi Marta,

You can check RTL spec here for general RTL guideline for 2.2 link http://bit.ly/1KKxkzD

Thanks!
Summary: [RTL][Privacy Controls] Direction of 'Next' and 'Back' buttons contradict with page indicator on Guided Tour page → [RTL][Privacy Panel] Direction of 'Next' and 'Back' buttons contradict with page indicator on Guided Tour page
Test case has been added in moztrap:
https://moztrap.mozilla.org/manage/case/15989/
Flags: in-moztrap+
Assign to Marta for this, thanks.
Assignee: nobody → marta
QA Whiteboard: [rtl-impact][QAnalyst-Triage+] → [rtl-impact][QAnalyst-Triage+][COM=Privacy Panel]
Summary: [RTL][Privacy Panel] Direction of 'Next' and 'Back' buttons contradict with page indicator on Guided Tour page → [RTL][Privacy Control] Direction of 'Next' and 'Back' buttons contradict with page indicator on Guided Tour page
So the problem I'm experiencing here is that the indicator is an image that is displayed in the window. So I need to change that image depending on the orientation of the text. Can you help?
Flags: needinfo?(marta) → needinfo?(gandalf)
(In reply to marta from comment #9)
> So the problem I'm experiencing here is that the indicator is an image that
> is displayed in the window. So I need to change that image depending on the
> orientation of the text. Can you help?

Sure. It seems to me that you need to flip the image either by using transform: scaleX(-1) or image-orientation: 180deg for dir=rtl - not sure which one is the proper one, but transform is more adopted, so try this.

Hope that helps.
Flags: needinfo?(gandalf)
Attachment #8579947 - Flags: review?(gandalf)
It was a surprisingly quick fix, thanks! Gandalf, can you review please?
Gandalf, I corrected the fix
Flags: needinfo?(gandalf)
Flags: needinfo?(gandalf)
Attachment #8579947 - Flags: review?(gandalf) → review+
Keywords: checkin-needed
Autolander could not locate a review from a user within the suggested reviewer list. Either the patch author or the reviewer should be in the suggested reviewer list.
Hi Kai-Zhen, 
The patch is review+ however autolander failed. Can we override this?
Thanks!
Status: NEW → ASSIGNED
Flags: needinfo?(kli)
Master: https://github.com/mozilla-b2g/gaia/commit/9b6f3024e4d0e62dd057231f4b14abe1782932ab

Please request for approval‑gaia‑v2.2 if necessary.
Status: ASSIGNED → RESOLVED
Closed: 5 years ago
Flags: needinfo?(kli)
Resolution: --- → FIXED
This issue is verified fixed in the latest Nightly Flame 3.0 build.

Actual Results: The progress circles move in the correct direction as the tour is completed.

Environmental Variables:
Device: Flame 3.0
BuildID: 20150324010202
Gaia: efebbafd12fc42ddcd378948b683a51106517660
Gecko: 840cfd5bc971
Gonk: b83fc73de7b64594cd74b33e498bf08332b5d87b
Version: 39.0a1 (3.0) 
Firmware Version: v18D-1
User Agent: Mozilla/5.0 (Mobile; rv:39.0) Gecko/39.0 Firefox/39.0
Status: RESOLVED → VERIFIED
QA Whiteboard: [rtl-impact][QAnalyst-Triage+][COM=Privacy Panel] → [rtl-impact][QAnalyst-Triage?][COM=Privacy Panel]
Flags: needinfo?(ktucker)
Adding verifyme for 2.2 verification once the fix has been uplifted.
QA Whiteboard: [rtl-impact][QAnalyst-Triage?][COM=Privacy Panel] → [rtl-impact][QAnalyst-Triage+][COM=Privacy Panel]
Flags: needinfo?(ktucker)
Keywords: verifyme
Please request Gaia v2.2 approval on this patch when you get a chance.
Flags: needinfo?(marta)
Target Milestone: --- → 2.2 S9 (3apr)
Comment on attachment 8579947 [details] [review]
[gaia] martasect:Bug_1135972 > mozilla-b2g:master

[Approval Request Comment]
[Bug caused by] (feature/regressing bug #):1135972
[User impact] if declined: In RTL languages the buttons will not be compatible with the page indicator in the GT. This is counter intuitive and breaks UX
[Testing completed]: yes
[Risk to taking this patch] (and alternatives if risky): low
[String changes made]: non
Flags: needinfo?(marta)
Attachment #8579947 - Flags: approval-gaia-v2.2?(dietrich)
Attachment #8579947 - Flags: approval-gaia-v2.2?(dietrich) → approval-gaia-v2.2+
Attached video video.MP4
This issue has been verified successfully on latest build of Flame 2.2 with the same steps in comment 0. The Next button is on the left side of the screen, the page indicator highlighted dot starts on the right (so when user hit Next, the highlighted dot goes one left).
There is a new bug on Guided Tour page, I have opened a new bug about it, see Bug 1150817
See attachment:video.MP4
Rate:0/5

Device: Flame 2.2 (pass)
Build ID               20150402002500
Gaia Revision          1ceca464053dee4a8bf10ea5abeef724d68c2ff2
Gaia Date              2015-04-01 09:49:30
Gecko Revision         https://hg.mozilla.org/releases/mozilla-b2g37_v2_2/rev/427b4da96714
Gecko Version          37.0
Device Name            flame
Firmware(Release)      4.4.2
Firmware(Incremental)  eng.cltbld.20150402.035057
Firmware Date          Thu Apr  2 03:51:09 EDT 2015
Bootloader             L1TC000118D0
QA Whiteboard: [rtl-impact][QAnalyst-Triage+][COM=Privacy Panel] → [rtl-impact][QAnalyst-Triage+][COM=Privacy Panel][MGSEI-Triage+]
Keywords: verifyme
You need to log in before you can comment on or make changes to this bug.