Closed Bug 1295575 Opened 6 years ago Closed 6 years ago

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

Categories

(DevTools :: Inspector, defect, P1)

48 Branch
defect

Tracking

(firefox52 fixed)

RESOLVED FIXED
Firefox 52
Tracking Status
firefox52 --- fixed

People

(Reporter: itiel_yn8, Assigned: gl)

References

Details

Attachments

(2 files)

Attached image 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.
Component: Untriaged → Developer Tools: Inspector
Assignee: nobody → gl
Inspector bug triage (filter on CLIMBING SHOES).
Status: UNCONFIRMED → ASSIGNED
Ever confirmed: true
Priority: -- → P1
Duplicate of this bug: 1228803
gl: there's a WIP patch I never got to finish in the dupe bug. Feel free to start from there.
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.
Attachment #8794057 - Flags: review?(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?
Attachment #8794057 - Flags: review?(jdescottes) → review+
Depends on: 1305007
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
https://hg.mozilla.org/mozilla-central/rev/557411859236
Status: ASSIGNED → RESOLVED
Closed: 6 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 52
Product: Firefox → DevTools
You need to log in before you can comment on or make changes to this bug.