Closed Bug 877351 Opened 7 years ago Closed 6 years ago

Network Panel is broken on RTL UI

Categories

(DevTools :: Netmonitor, defect, P2)

defect

Tracking

(firefox23- verified, firefox24- verified)

VERIFIED FIXED
Firefox 24
Tracking Status
firefox23 - verified
firefox24 - verified

People

(Reporter: tomer, Assigned: vporof)

References

Details

(Keywords: rtl)

Attachments

(2 files)

Attached image screenshot
When using the new network panel in Firefox Aurora, I can see that it is completely broken, making it unusable. 


Steps to reproduce: 

1. Use an RTL build.
2. Open the network panel and load a page.


Mozilla/5.0 (X11; Linux i686; rv:23.0) Gecko/20130523 Firefox/23.0
It's look like CSS transforms are biting our butt.
OS: Linux → All
Priority: -- → P2
Hardware: x86 → All
Is there reason to believe this is a new regression in FF23? If not, we'd take a low risk fix but wouldn't track.
(In reply to Alex Keybl [:akeybl] from comment #2)
> Is there reason to believe this is a new regression in FF23? If not, we'd
> take a low risk fix but wouldn't track.

It's been like this since the beginning.
(In reply to Victor Porof [:vp] from comment #3)
> It's been like this since the beginning.
Yes, but the network panel is pretty new, and doesn't exists in the release channel yet (web console was replaced by the network console?).

A quick workaround could be to add direction:ltr to the network panel until we'd have a better solution. Doing so will make sure we won't ship with broken features.
(In reply to Tomer Cohen :tomer from comment #4)
> (In reply to Victor Porof [:vp] from comment #3)
> > It's been like this since the beginning.
> 
> A quick workaround could be to add direction:ltr to the network panel until
> we'd have a better solution. Doing so will make sure we won't ship with
> broken features.

Is there a way to query the current text direction in js? Everything is caused by a "translateX" matrix applied to individual network waterfall nodes. Although elegant, as far as I know, there's nothing like a mozTranslateStart that can be used instead of transformX.
(In reply to comment #5)
> (In reply to Tomer Cohen :tomer from comment #4)
> > (In reply to Victor Porof [:vp] from comment #3)
> > > It's been like this since the beginning.
> > 
> > A quick workaround could be to add direction:ltr to the network panel until
> > we'd have a better solution. Doing so will make sure we won't ship with
> > broken features.
> 
> Is there a way to query the current text direction in js? Everything is caused
> by a "translateX" matrix applied to individual network waterfall nodes.
> Although elegant, as far as I know, there's nothing like a mozTranslateStart
> that can be used instead of transformX.

if |e| is a DOM element, you could do:

var isRTL = window.getComputedStyle(document.body, null).direction == "rtl";
(In reply to :Ehsan Akhgari (needinfo? me!) from comment #6)
> 
> var isRTL = window.getComputedStyle(document.body, null).direction == "rtl";

Thanks, that'll have to do.
Attached patch v1Splinter Review
Assignee: nobody → vporof
Status: NEW → ASSIGNED
Attachment #757144 - Flags: review?(rcampbell)
not tracking based on comment 3 - please nominate for uplift if low risk.
(In reply to lsblakk@mozilla.com [:lsblakk] from comment #9)
> not tracking based on comment 3 - please nominate for uplift if low risk.

Is it possible in the meantime to workaround this issue with dir=ltr, so we won't ship this feature broken for every user with browser locale set to {ar,fa,he}?
(In reply to Tomer Cohen :tomer from comment #10)
> (In reply to lsblakk@mozilla.com [:lsblakk] from comment #9)
> > not tracking based on comment 3 - please nominate for uplift if low risk.
> 
> Is it possible in the meantime to workaround this issue with dir=ltr, so we
> won't ship this feature broken for every user with browser locale set to
> {ar,fa,he}?

No need for that, I submitted a patch with a straightforward fix (comment #8). Just waiting for review and then I'll ask for aurora approval.
Comment on attachment 757144 [details] [diff] [review]
v1

Review of attachment 757144 [details] [diff] [review]:
-----------------------------------------------------------------

OK! Thanks.
Attachment #757144 - Flags: review?(rcampbell) → review+
Comment on attachment 757144 [details] [diff] [review]
v1

[Approval Request Comment]
Bug caused by (feature/regressing bug #): Network Monitor is hideous on RTL builds
User impact if declined: Diverse groups of people would be greatly saddened to experience such ugliness and utter lack of usability
Testing completed (on m-c, etc.): Locally, fx-team
Risk to taking this patch (and alternatives if risky): None, really straightforward fix, small patch
String or IDL/UUID changes made by this patch: None
Attachment #757144 - Flags: approval-mozilla-aurora?
https://hg.mozilla.org/mozilla-central/rev/24ed4a030670
Status: ASSIGNED → RESOLVED
Closed: 6 years ago
Resolution: --- → FIXED
Whiteboard: [fixed-in-fx-team]
Target Milestone: --- → Firefox 24
Attachment #757144 - Flags: approval-mozilla-aurora? → approval-mozilla-aurora+
This appears to be fixed on the build from https://ftp.mozilla.org/pub/mozilla.org/firefox/nightly/23.0b4-candidates/build1/mac/en-US/
Status: RESOLVED → VERIFIED
See Also: → 1008157
Product: Firefox → DevTools
You need to log in before you can comment on or make changes to this bug.