1295575 - [RTL] Collapse/Expand toggles are being overlapped in 'Computed' section under Inspector

Status: RESOLVED FIXED

(DevTools :: Inspector, defect, P1)

Description

[Itiel]

Attachment: Toggles overlapped

User Agent: Mozilla/5.0 (Windows NT 10.0; rv:48.0) Gecko/20100101 Firefox/48.0
Build ID: 20160726073904

Steps to reproduce:

1. Install RTL build of Firefox
2. Open Developer Tools > Inspector
3. Expand pane
4. Click the Computed tab
5. Observe the mini toggles


Actual results:

The toggles are being overlapped by the text.


Expected results:

The toggles shouldn't be overlapped by the text.

See attached screenshot.

Comment 1

[Patrick Brosset <:pbro>]

Inspector bug triage (filter on CLIMBING SHOES).

Comment 3

[Tim Nguyen :ntim]

gl: there's a WIP patch I never got to finish in the dupe bug. Feel free to start from there.

Comment 4

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: 1295575.patch [1.0]

There's no easy way to test this since it seems RTL in the inspector is broken. Best to apply the changes to DevEdition. I changed the padding for the property-value to better align with the matched selectors when we have the top-down view of the computed values.

Comment 5

[Julian Descottes [:jdescottes]]

Comment on attachment 8794057 [details] [diff] [review]
1295575.patch [1.0]

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

Indeed, RTL was broken by the inspector XUL->HTML migration (Bug 1262443). I just logged Bug 1305007 to track this.

When trying to validate your patch on a prior version, I realized that the root bug was already fixed by Bug 1288341.

Looking at the changeset, it looks like you are fixing various other RTL issues + the position of the stylesheet ".link" element.
That's fine but let's update the summary and the changeset summary accordingly :)

::: devtools/client/themes/computed.css
@@ +186,5 @@
>    float: right;
>  }
>  
> +/* Workaround until float: inline-end; is enabled by default */
> +.link:dir(rtl) {

Since this can only be tested without the XUL -> HTML inspector migration at the moment, shouldn't we add the .link:-moz-locale-dir(rtl) selector here?

Comment 6

[Gabriel Luong [:gl] (ΦωΦ)]

https://hg.mozilla.org/integration/fx-team/rev/55741185923649a1628de065bb1ec04dc37ccbd5
Bug 1295575 - Fix the stylesheet link position and use inline-start/end to fix RTL issues with the computed view r=jdescottes

Comment 7

[Phil Ringnalda (:philor)]

https://hg.mozilla.org/mozilla-central/rev/557411859236