[FTE] in RTL language, Geolcation checkbox is half off the screen

RESOLVED DUPLICATE of bug 1010615

Status

defect
P1
normal
RESOLVED DUPLICATE of bug 1010615
5 years ago
5 years ago

People

(Reporter: mikehenrty, Unassigned)

Tracking

unspecified
ARM
Gonk (Firefox OS)
Dependency tree / graph
Bug Flags:
in-moztrap +

Firefox Tracking Flags

(feature-b2g:2.2+)

Details

(Whiteboard: [fxos-bug-bash-1.4])

Attachments

(2 attachments)

Posted image fte_gelocation.png
Build Information
Device: Buri
Build ID: 20140306134106
Platform Version: 30.0a1
Gaia: 98cf46d6623b164845fe1fdc99a2a7bf64aa667d
Gecko: 8095b7dd8f58

Description
In rtl language, geolocation checkbox is half off the screen. See screenshot.
Blocks: FTE-rtl
Priority: -- → P2
Decided during this morning's RTL triage that we should block on this for 2.2
blocking-b2g: --- → 2.2?
Blocking per RTL triage for 2.2
blocking-b2g: 2.2? → 2.2+
Putting as P1 since this is in fact a blocker for 2.2. thanks
Priority: P2 → P1
Using mirrored-english pseudo-locale, I get a different - but also broken result. There are RTL rules in both the switches.css and gaia_switch/style.css stylesheets that should be fixing this and similar issues, but they don't seem to be getting applied (as far as I can tell from the WebIDE): 

https://github.com/mozilla-b2g/gaia/blob/master/shared/elements/gaia_switch/style.css#L78
https://github.com/mozilla-b2g/gaia/blob/master/shared/style/switches.css#L111

I tried some variations of using :-moz-dir(rtl) selectors instead, but couldnt see any impact with my changes. I also tried editing the (ltr/default) rules directly in the WebIDE with no result so I'm obviously doing something wrong, or web-components and the inspector are not yet friends. 

Have you any idea what's going on here Wilson?
Flags: needinfo?(wilsonpage)
RTL update: marking required bugs as feature-b2g:2.2+ (and removing blocking flags)
blocking-b2g: 2.2+ → ---
feature-b2g: --- → 2.2+
(In reply to Sam Foster [:sfoster] from comment #4)
> Created attachment 8554816 [details]
> ftu-geolocation-mirrored-eng.png
> 
> Using mirrored-english pseudo-locale, I get a different - but also broken
> result. There are RTL rules in both the switches.css and
> gaia_switch/style.css stylesheets that should be fixing this and similar
> issues, but they don't seem to be getting applied (as far as I can tell from
> the WebIDE): 
> 
> https://github.com/mozilla-b2g/gaia/blob/master/shared/elements/gaia_switch/
> style.css#L78
> https://github.com/mozilla-b2g/gaia/blob/master/shared/style/switches.
> css#L111
> 
> I tried some variations of using :-moz-dir(rtl) selectors instead, but
> couldnt see any impact with my changes. I also tried editing the
> (ltr/default) rules directly in the WebIDE with no result so I'm obviously
> doing something wrong, or web-components and the inspector are not yet
> friends. 
> 
> Have you any idea what's going on here Wilson?

RTL and <style> inside shadow-dom is a tricky one at the moment. We're missing the `:host-context()` selector (bug 1082060) and `-moz-dir()` doesn't reflect the parent document's direction (bug 1100912).

If your styling the outside of the shadow-dom, you can use normal rules like [dir=rtl] gaia-switch { ... }. But styling inside the shadow-dom requires something more complex, like keeping a class/attr inside shadow-root in sync with document.

Yesterday I improved the RTL situation for components that are based on the gaia-component base class by emitting a 'dirchanged' event on the `document` that can be listened to. Unfortunately the gaia-switch you are referring to is an old component that isn't based on gaia-component. All new web-components are.

Hope that gives some insight. NI me again if you need more info :)
Flags: needinfo?(wilsonpage)
We'll cover this in bug 1010615.
Status: NEW → RESOLVED
Closed: 5 years ago
Resolution: --- → DUPLICATE
Duplicate of bug: 1010615
Test case has been added in moztrap:
https://moztrap.mozilla.org/manage/case/15469/
Flags: in-moztrap+
You need to log in before you can comment on or make changes to this bug.