221483 2021-02-05 09:35:16 -0800 [Interop 2021][css-flexbox] painting order issue 2026-07-24 00:42:33 -0700 1 1 1 Unclassified WebKit Layout and Rendering WebKit Nightly Build Unspecified Unspecified NEW http://wpt.live/css/css-flexbox/flexbox-paint-ordering-002.xhtml BrowserCompat, InRadar, WPTImpact P2 Normal --- 136754 1 svillar ahmad.saleem792 ahmad.saleem792 bfulgham erik.anderson simon.fraser webkit-bug-importer zalan oldest_to_newest 1726123 0 svillar 2021-02-05 09:35:16 -0800 New imported WPT tests is failing: imported/w3c/web-platform-tests/css/css-flexbox/flexbox-paint-ordering-002.xhtml 1728606 1 webkit-bug-importer 2021-02-12 09:36:17 -0800 <rdar://problem/74279579> 1971766 2 ahmad.saleem792 2023-08-17 01:07:40 -0700 https://searchfox.org/wubkat/source/LayoutTests/TestExpectations#4530 imported/w3c/web-platform-tests/css/css-flexbox/flexbox-paint-ordering-002.xhtml [ ImageOnlyFailure ] STP176 is still failing this test case. 2227791 3 480421 erik.anderson 2026-07-07 21:03:18 -0700 Created attachment 480421 repro demonstrating different properties that create a stacking context all trigger the bug I ran into this in a personal project (involving overlapping playing cards that I wanted to visually sort without modifying DOM order). I'm attaching a minimal repro that more clearly shows the bug is triggered whenever a flex item forms a stacking context (isolation: isolate, opacity < 1 , transform, will-change, position: relative; z-index: 0, filter, etc.). The order value is ignored for paint order and items stack in source order. The workaround I used is to mirror the order value into a z-index property value. 2233595 4 ahmad.saleem792 2026-07-24 00:42:33 -0700 Pull request: https://github.com/WebKit/WebKit/pull/70102 480421 2026-07-07 21:03:18 -0700 2026-07-07 21:03:18 -0700 repro demonstrating different properties that create a stacking context all trigger the bug webkit-221483-flex-order-stacking.html text/html 2395 erik.anderson PCFET0NUWVBFIGh0bWw+DQo8bWV0YSBjaGFyc2V0PSJ1dGYtOCI+DQo8dGl0bGU+V2ViS2l0IGJ1 ZyAyMjE0ODM6IGZsZXggYG9yZGVyYCBpZ25vcmVkIGZvciBwYWludCBvcmRlciBvbmNlIGFuIGl0 ZW0gZm9ybXMgYSBzdGFja2luZyBjb250ZXh0PC90aXRsZT4NCjxzdHlsZT4NCiAgYm9keSB7IGZv bnQ6IDE0cHggc3lzdGVtLXVpLCBzYW5zLXNlcmlmOyBtYXJnaW46IDIwcHg7IH0NCiAgcCB7IG1h eC13aWR0aDogNjBjaDsgfQ0KICAucm93IHsgZGlzcGxheTogZmxleDsgd2lkdGg6IDYwcHg7IG1h cmdpbjogOHB4IDA7IH0NCiAgLnJvdyA+IGRpdiB7IGhlaWdodDogNDBweDsgfQ0KICAuZyB7IG9y ZGVyOiAyOyB3aWR0aDogNjBweDsgbWFyZ2luLWxlZnQ6IC0zMHB4OyBiYWNrZ3JvdW5kOiBncmVl bjsgfSAgLyogRE9NLWZpcnN0LCBwYWludHMgbGFzdCBwZXIgYG9yZGVyYCAqLw0KICAuciB7IG9y ZGVyOiAxOyB3aWR0aDogMzBweDsgYmFja2dyb3VuZDogcmVkOyB9ICAgICAgICAgICAgICAgICAg ICAgICAvKiBET00tc2Vjb25kLCBsb3dlciBgb3JkZXJgICovDQogIC8qIEVhY2ggdHJpZ2dlciBl c3RhYmxpc2hlcyBhIHN0YWNraW5nIGNvbnRleHQgb24gYm90aCBpdGVtcyAobm8gei1pbmRleCBk aWZmZXJlbmNlKS4gUGVyIENTUyBGbGV4Ym94DQogICAgIMKnNS40IHBhaW50aW5nIHN0aWxsIGZv bGxvd3Mgb3JkZXItbW9kaWZpZWQgZG9jdW1lbnQgb3JkZXIsIHNvIGdyZWVuIHN0YXlzIG9uIHRv cCAobm8gcmVkKS4gKi8NCiAgLnJlbHogID4gZGl2IHsgcG9zaXRpb246IHJlbGF0aXZlOyB6LWlu ZGV4OiAwOyB9DQogIC5pc28gICA+IGRpdiB7IGlzb2xhdGlvbjogaXNvbGF0ZTsgfQ0KICAub3Ag ICAgPiBkaXYgeyBvcGFjaXR5OiAwLjk5OyB9DQogIC50ZiAgICA+IGRpdiB7IHRyYW5zZm9ybTog dHJhbnNsYXRlWigwKTsgfQ0KICAud2MgICAgPiBkaXYgeyB3aWxsLWNoYW5nZTogdHJhbnNmb3Jt OyB9DQogIC5mbHQgICA+IGRpdiB7IGZpbHRlcjogYmx1cigwKTsgfQ0KICBsYWJlbCB7IGRpc3Bs YXk6IGlubGluZS1ibG9jazsgd2lkdGg6IDI3Y2g7IH0NCjwvc3R5bGU+DQoNCjxwPjxiPlBhc3M6 PC9iPiBubyByZWQgaXMgdmlzaWJsZSBpbiBhbnkgcm93IChncmVlbiBwYWludHMgb24gdG9wLCBh cyA8Y29kZT5vcmRlcjwvY29kZT4gcmVxdWlyZXMpLg0KICAgPGI+V2ViS2l0IGJ1Zzo8L2I+IGV2 ZXJ5IHJvdyBleGNlcHQgdGhlIGNvbnRyb2wgc2hvd3MgcmVkIOKAlCBvbmNlIGEgZmxleCBpdGVt IGZvcm1zIGEgc3RhY2tpbmcgY29udGV4dCwNCiAgIFdlYktpdCBwYWludHMgaW4gc291cmNlIG9y ZGVyIGluc3RlYWQgb2YgPGNvZGU+b3JkZXI8L2NvZGU+LW1vZGlmaWVkIG9yZGVyLg0KICAgQ2hy b21pdW0gYW5kIEZpcmVmb3ggc2hvdyBubyByZWQuIFJlZjogPGEgaHJlZj0iaHR0cHM6Ly9idWdz LndlYmtpdC5vcmcvc2hvd19idWcuY2dpP2lkPTIyMTQ4MyI+MjIxNDgzPC9hPiwNCiAgIDxhIGhy ZWY9Imh0dHBzOi8vZHJhZnRzLmNzc3dnLm9yZy9jc3MtZmxleGJveC8jcGFpbnRpbmciPkNTUyBG bGV4Ym94IMKnNS40PC9hPi48L3A+DQoNCjxkaXY+PGxhYmVsPmNvbnRyb2wgKG5vIHN0YWNraW5n IGNvbnRleHQpPC9sYWJlbD48c3BhbiBjbGFzcz0icm93Ij48ZGl2IGNsYXNzPSJnIj48L2Rpdj48 ZGl2IGNsYXNzPSJyIj48L2Rpdj48L3NwYW4+PC9kaXY+DQo8ZGl2PjxsYWJlbD5wb3NpdGlvbjpy ZWxhdGl2ZTsgei1pbmRleDowPC9sYWJlbD48c3BhbiBjbGFzcz0icm93IHJlbHoiPjxkaXYgY2xh c3M9ImciPjwvZGl2PjxkaXYgY2xhc3M9InIiPjwvZGl2Pjwvc3Bhbj48L2Rpdj4NCjxkaXY+PGxh YmVsPmlzb2xhdGlvbjppc29sYXRlPC9sYWJlbD48c3BhbiBjbGFzcz0icm93IGlzbyI+PGRpdiBj bGFzcz0iZyI+PC9kaXY+PGRpdiBjbGFzcz0iciI+PC9kaXY+PC9zcGFuPjwvZGl2Pg0KPGRpdj48 bGFiZWw+b3BhY2l0eTowLjk5PC9sYWJlbD48c3BhbiBjbGFzcz0icm93IG9wIj48ZGl2IGNsYXNz PSJnIj48L2Rpdj48ZGl2IGNsYXNzPSJyIj48L2Rpdj48L3NwYW4+PC9kaXY+DQo8ZGl2PjxsYWJl bD50cmFuc2Zvcm06dHJhbnNsYXRlWigwKTwvbGFiZWw+PHNwYW4gY2xhc3M9InJvdyB0ZiI+PGRp diBjbGFzcz0iZyI+PC9kaXY+PGRpdiBjbGFzcz0iciI+PC9kaXY+PC9zcGFuPjwvZGl2Pg0KPGRp dj48bGFiZWw+d2lsbC1jaGFuZ2U6dHJhbnNmb3JtPC9sYWJlbD48c3BhbiBjbGFzcz0icm93IHdj Ij48ZGl2IGNsYXNzPSJnIj48L2Rpdj48ZGl2IGNsYXNzPSJyIj48L2Rpdj48L3NwYW4+PC9kaXY+ DQo8ZGl2PjxsYWJlbD5maWx0ZXI6Ymx1cigwKTwvbGFiZWw+PHNwYW4gY2xhc3M9InJvdyBmbHQi PjxkaXYgY2xhc3M9ImciPjwvZGl2PjxkaXYgY2xhc3M9InIiPjwvZGl2Pjwvc3Bhbj48L2Rpdj4N Cg==