1820534 - Move front-end to modern flexbox.

Status: RESOLVED FIXED

(Core :: XUL, task)

Comment 1

[Emilio Cobos Álvarez (:emilio)]

Attachment: Bug 1820534 - Move front-end to modern flexbox. r=Gijs,dao

Done mostly automatically via find/replace following the conversions
specified here:

https://groups.google.com/a/mozilla.org/g/firefox-dev/c/9sGpF1TNbLk/m/QpU3oTUuAgAJ

For the most part I think the "flex: N N" usage could be simplified to
just "flex: N", but I wanted to preserve behavior (-moz-box-flex sets
both flex-grow and flex-shrink).

I opted for explicitly setting flex-grow/shrink on the flex="" attribute
rules since you might want to override flex-basis regardless.

I changed legacy layout to also look at the order property rather than
-moz-box-ordinal-group because it made splitters and treecols easier (we
don't need to deal with both orders).

Comment 2

[Emilio Cobos Álvarez (:emilio)]

FYI, this is post-soft-freeze material, but TB would need to change a few styles. Most of it should be search and replace, see commit message. -moz-box-ordinal-group: 0 needs to become order: -1 because order and -moz-box-ordinal-group have different initial values (0 vs. 1 respectively).

Comment 3

[Magnus Melin [:mkmelin]]

Thanks!

Comment 4

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/c25af897c9bc
Move front-end to modern flexbox. r=Gijs,dao,settings-reviewers,credential-management-reviewers,sgalich,devtools-reviewers,nchevobbe

Comment 5

[Serban Stanca [:SerbanS]]

Backed out for causing causing reftests and mochitests failures.

• Backout link
• Push with failures
• Failure Log mochitests
• Failure Log reftests
• Failure line mochitests: TEST-UNEXPECTED-FAIL | toolkit/content/tests/chrome/test_tooltip.xhtml | hover tooltip with long unbreakable text tooltip is wrapped
• Failure line reftests: REFTEST TEST-UNEXPECTED-FAIL | layout/reftests/box/flex-emulation-3.xhtml != layout/reftests/box/flex-emulation-3-notref.xhtml | image comparison, max difference: 0, number of differing pixels: 0

Comment 6

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/99aa47505e15
Move front-end to modern flexbox. r=Gijs,dao,settings-reviewers,credential-management-reviewers,sgalich,devtools-reviewers,nchevobbe

Comment 7

[Serban Stanca [:SerbanS]]

https://hg.mozilla.org/mozilla-central/rev/99aa47505e15

Comment 8

[Daniel Holbert [:dholbert]]

emilio, maybe worth backing out, given the various regressions?

Comment 9

[Emilio Cobos Álvarez (:emilio)]

The fixes are all one-liners, but still seems this should get a bit more bake time, so I'll prepare a patch to get it backed out of beta if that seems fine?

Comment 10

[Emilio Cobos Álvarez (:emilio)]

(Backing out also makes TB have to back out and re-land their fixes so that's also slightly annoying... In retrospect I didn't expect this amount of regressions and should've waited to after the merge probably...)

Comment 11

[Emilio Cobos Álvarez (:emilio)]

Dianna, fyi, I chatted with Ryan and he told me he'd be fine with backout-right-after-the-merge. Just fyi, I can prepare the patch right after the merge happens.

Comment 12

[Dianna Smith [:diannaS]]

thats fine with me, ill keep an eye out for backout patch next week.

Comment 13

[Emilio Cobos Álvarez (:emilio)]

Attachment: Backout of patch and follow-ups for beta.

(As promised)

Comment 14

[Dianna Smith [:diannaS]]

Thank you!

Backout from Beta v112: https://hg.mozilla.org/releases/mozilla-beta/rev/644d6d325eb6b7b8be313fc8d5cabbb0ee3cf623

push: https://treeherder.mozilla.org/jobs?repo=mozilla-beta&group_state=expanded&revision=644d6d325eb6b7b8be313fc8d5cabbb0ee3cf623

Comment 15

[Dianna Smith [:diannaS]]

Comment on attachment 9322680 [details]
Backout of patch and follow-ups for beta.

Approved for 112.0b1

Comment 16

[Alexandre Poirot [:ochameau]]

I don't know if you are aware of the possible very significant performance impact of your ongoing work?
We are seeing around 20% improvement in loading the style editor in the Browser Toolbox!
I imagine stylesheets are being displayed faster in the devtools UI thanks to modern flexbox being faster, or some change in styleeditor CSS which made it somehow faster.

== Change summary for alert #37603 (as of Thu, 09 Mar 2023 14:01:33 GMT) ==

Improvements:

Ratio	Test	Platform	Options	Absolute values (old vs new)
26%	damp browser-toolbox.styleeditor-ready.DAMP	linux1804-64-shippable-qr	e10s fission stylo webrender-sw	772.08 -> 569.33
20%	damp browser-toolbox.styleeditor-ready.DAMP	windows10-64-shippable-qr	e10s fission stylo webrender	627.05 -> 499.86
20%	damp browser-toolbox.styleeditor-ready.DAMP	windows10-64-shippable-qr	e10s fission stylo webrender-sw	626.85 -> 502.53
16%	damp browser-toolbox.styleeditor-ready.DAMP	macosx1015-64-shippable-qr	e10s fission stylo webrender-sw	551.74 -> 461.53
8%	damp custom.inspector.expandall.balanced	windows10-64-shippable-qr	e10s fission stylo webrender-sw	608.32 -> 557.39
6%	damp custom.inspector.expandall.balanced	windows10-64-shippable-qr	e10s fission stylo webrender	601.38 -> 562.33

For up to date results, see: https://treeherder.mozilla.org/perfherder/alerts?id=37603