1459646 - [RTL] Resizer icons mirrored

Status: RESOLVED FIXED

(Core :: Layout: Form Controls, defect)

Description

[Itiel]

Attachment: Screenshot

See attached.
Same as bug 1457722 but for forms, such as in Pontoon.
The resizers should face to the left-bottom.

Regression is as in bug 1457722:
2018-05-07T18:43:12: DEBUG : Starting merge handling...
2018-05-07T18:43:12: DEBUG : Using url: https://hg.mozilla.org/integration/autoland/json-pushes?changeset=3a10be9bb6bd3b90594b4afe2896f9279f339e9a&full=1
2018-05-07T18:43:13: DEBUG : Found commit message:
Backed out 2 changesets (bug 1446923) for bustages in /python/mozbuild/mozbuild/test/frontend/test_emitter.py on a CLOSED TREE

Backed out changeset b9a5aab21d71 (bug 1446923)
Backed out changeset bc5ab6e2db10 (bug 1446923)

2018-05-07T18:43:13: INFO : The bisection is done.

The range is 2018-04-26 to 2018-04-27.

Comment 1

[Itiel]

Tim, is there anything you can do here as well?

Comment 2

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Ouch. I thought we've got this covered in reftest already?

Comment 3

[Tim Guan-tin Chien [:timdream] (please needinfo)]

This can be reproduced with, simply, this URL, on a non-Mac platform: 

data:text/html,<textarea dir=rtl></textarea>

This cannot be reproduced on macOS because, in scroll frame, we don't replace the SVG resizer with RTL-aware native themed resizer.

==

Sadly, bug 1457722 was a complete screwed up. The native theming aware the direction of the frame, while I tried to (re-)flip them with -moz-locale-dir(). This is not a problem for XUL window where the frame direction is always the UI locale. It's a problem for web content, even when scroll frame in web content are using resizer[dir="bottomleft"] and resizer[dir="bottomright"] instead of "bottomstart" and "bottomend" because we had to (re-)flip bottomleft/right based on UI locale too, as described in bug 1457722 comment 8.

I am now convinced that we should just remove the directionality awareness from the widget code and let scroll frame and CSS to handle them completely.

Comment 4

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Attachment: Bug 1459646 - Always flip the resizer with CSS transform

Having the native theme widget to flip its own direction turned out to be
something not needed anymore, and it interfere with the CSS rule we set to
flip non-native SVG background.

This patch turned that off and always flips the resizer with CSS transform.

Review commit: https://reviewboard.mozilla.org/r/242228/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/242228/

Comment 5

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Comment on attachment 8973856 [details]
Bug 1459646 - Always flip the resizer with CSS transform

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/242228/diff/1-2/

Comment 6

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Comment on attachment 8973856 [details]
Bug 1459646 - Always flip the resizer with CSS transform

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/242228/diff/2-3/

Comment 7

[Dão Gottwald [:dao]]

Comment on attachment 8973856 [details]
Bug 1459646 - Always flip the resizer with CSS transform

https://reviewboard.mozilla.org/r/242228/#review248160

::: toolkit/content/minimal-xul.css:110
(Diff revision 3)
>    cursor: ns-resize;
>  }
>  
>  resizer[dir="left"],
>  resizer[dir="right"] {
> +  transform: scaleX(-1);

I'm confused, why are you doing this for both dir=right and dir=left?

Comment 8

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Comment on attachment 8973856 [details]
Bug 1459646 - Always flip the resizer with CSS transform

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/242228/diff/3-4/

Comment 9

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Comment on attachment 8973856 [details]
Bug 1459646 - Always flip the resizer with CSS transform

https://reviewboard.mozilla.org/r/242228/#review248294

::: toolkit/content/minimal-xul.css:110
(Diff revision 3)
>    cursor: ns-resize;
>  }
>  
>  resizer[dir="left"],
>  resizer[dir="right"] {
> +  transform: scaleX(-1);

That was wrong.

Comment 10

[Dão Gottwald [:dao]]

Comment on attachment 8973856 [details]
Bug 1459646 - Always flip the resizer with CSS transform

https://reviewboard.mozilla.org/r/242228/#review248316

Comment 11

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/3b84be9ee9e6
Always flip the resizer with CSS transform r=dao

Comment 12

[Eliza Balazs [:ebalazs_]]

https://hg.mozilla.org/mozilla-central/rev/3b84be9ee9e6

Comment 13

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Comment on attachment 8973856 [details]
Bug 1459646 - Always flip the resizer with CSS transform

Approval Request Comment
[Feature/Bug causing the regression]: Bug 1450017
[User impact if declined]: See STR. Resizer will be renedered incorrectly on RTL textareas
[Is this code covered by automated tests?]: Yes, new reftest added.
[Has the fix been verified in Nightly?]: Not by QA; I checked it works as expected.
[Needs manual test from QE? If yes, steps to reproduce]: No.
[List of other uplifts needed for the feature/fix]: No.
[Is the change risky?]: Shouldn't be.
[Why is the change risky/not risky?]: The behavior is much more simpler and easier to understand.
[String changes made/needed]: No.

Comment 14

[Itiel]

I can confirm this is fully fixed on latest Nightly.

Comment 15

[Ryan VanderMeulen [:RyanVM]]

Comment on attachment 8973856 [details]
Bug 1459646 - Always flip the resizer with CSS transform

Approved for 61.0b4. Thanks for including a test.

Comment 16

[Ryan VanderMeulen [:RyanVM]]

https://hg.mozilla.org/releases/mozilla-beta/rev/02b90b5a6335