[CSS contain] Fix handling of layout/paint containment with internal …

…ruby boxes

https://bugs.webkit.org/show_bug.cgi?id=243534

Reviewed by Alan Bujtas.

Layout and paint containment do not apply to ruby internal boxes [1, 2, 3].

There was a bug in StyleAdjuster where just testing whether contain: layout
was specified meant a stacking context is created. However the correct place
to determine this is shouldBeCSSStackingContext since there we know if the
element qualifies for this (for example internal ruby boxes do not).

The WPT tests are adjusted to use <rt> instead of the unsupported ruby-text
display value. This approach is similar to tests like contain-size-005.html.

[1] https://drafts.csswg.org/css-display-3/#internal-ruby-box
[2] https://drafts.csswg.org/css-contain/#containment-layout
[3] https://drafts.csswg.org/css-contain/#containment-paint

* LayoutTests/TestExpectations:
* LayoutTests/imported/w3c/web-platform-tests/css/css-backgrounds/background-gradient-subpixel-fills-area.html:
* LayoutTests/imported/w3c/web-platform-tests/css/css-contain/contain-layout-017.html:
* LayoutTests/imported/w3c/web-platform-tests/css/css-contain/contain-paint-021.html:
* Source/WebCore/rendering/RenderLayer.cpp:
(WebCore::RenderLayer::shouldBeCSSStackingContext const):
* Source/WebCore/style/StyleAdjuster.cpp:
(WebCore::Style::Adjuster::adjust const):

Canonical link: https://commits.webkit.org/253354@main

LayoutTests/TestExpectations

@@ -4856,9 +4856,6 @@ webanimations/translate-property-and-translate-animation-with-delay-on-forced-la
 imported/w3c/web-platform-tests/css/css-contain/contain-inline-size-bfc-floats-001.html [ ImageOnlyFailure ]
 imported/w3c/web-platform-tests/css/css-contain/contain-inline-size-intrinsic.html [ ImageOnlyFailure ]
 imported/w3c/web-platform-tests/css/css-contain/contain-layout-breaks-002.html [ ImageOnlyFailure ]
-# webkit-ruby-text
-imported/w3c/web-platform-tests/css/css-contain/contain-layout-017.html [ ImageOnlyFailure ]
-imported/w3c/web-platform-tests/css/css-contain/contain-paint-021.html [ ImageOnlyFailure ]
 imported/w3c/web-platform-tests/css/css-contain/content-visibility/content-visibility-001.html [ ImageOnlyFailure ]
 imported/w3c/web-platform-tests/css/css-contain/content-visibility/content-visibility-003.html [ ImageOnlyFailure ]
 imported/w3c/web-platform-tests/css/css-contain/content-visibility/content-visibility-004.html [ ImageOnlyFailure ]
@@ -4907,8 +4904,6 @@ imported/w3c/web-platform-tests/css/css-contain/quote-scoping-001.html [ ImageOn
 imported/w3c/web-platform-tests/css/css-contain/quote-scoping-002.html [ ImageOnlyFailure ]
 imported/w3c/web-platform-tests/css/css-contain/quote-scoping-003.html [ ImageOnlyFailure ]
 imported/w3c/web-platform-tests/css/css-contain/quote-scoping-004.html [ ImageOnlyFailure ]
-# innerText bug
-webkit.org/b/238555 imported/w3c/web-platform-tests/css/css-contain/contain-flexbox-outline.html [ Failure ]
 
 # Container queries
 webkit.org/b/229659 imported/w3c/web-platform-tests/css/css-contain/container-queries/custom-layout-container-001.https.html [ ImageOnlyFailure ]

LayoutTests/imported/w3c/web-platform-tests/css/css-contain/contain-layout-017.html

@@ -6,10 +6,10 @@
 <link rel="match" href="../reference/nothing.html">
 <meta name=assert content="Elements in which layout containment doesn't apply, do not create a stacking context.">
 <style>
-div {
-  display: -webkit-ruby-text;
+rt {
   contain: layout;
   background: white;
+  overflow: hidden;
 }
 span {
   position: relative;
@@ -18,4 +18,4 @@
 </style>
 
 <p>There should be nothing below.</p>
-<div><span>FAIL</span></div>
+<div><ruby><rt><span>FAIL</span></rt></ruby></div>

LayoutTests/imported/w3c/web-platform-tests/css/css-contain/contain-paint-021.html

@@ -6,10 +6,10 @@
 <link rel="match" href="../reference/nothing.html">
 <meta name=assert content="Elements in which paint containment doesn't apply, do not create a stacking context.">
 <style>
-div {
-  display: -webkit-ruby-text;
+rt {
   contain: paint;
   background: white;
+  overflow: hidden;
 }
 span {
   position: relative;
@@ -18,4 +18,4 @@
 </style>
 
 <p>There should be nothing below.</p>
-<div><span>FAIL</span></div>
+<ruby><rt><span>FAIL</span></rt></ruby>

Source/WebCore/rendering/RenderLayer.cpp

@@ -581,7 +581,7 @@ bool RenderLayer::shouldBeNormalFlowOnly() const
 
 bool RenderLayer::shouldBeCSSStackingContext() const
 {
-    return !renderer().style().hasAutoUsedZIndex() || renderer().shouldApplyPaintContainment() || isRenderViewLayer();
+    return !renderer().style().hasAutoUsedZIndex() || renderer().shouldApplyLayoutOrPaintContainment() || isRenderViewLayer();
 }
 
 bool RenderLayer::setIsNormalFlowOnly(bool isNormalFlowOnly)

Source/WebCore/style/StyleAdjuster.cpp

@@ -511,10 +511,6 @@ void Adjuster::adjust(RenderStyle& style, const RenderStyle* userAgentAppearance
         style.setUsedZIndex(0);
 #endif
 
-    // contain: layout creates a stacking context.
-    if (style.hasAutoUsedZIndex() && style.containsLayout())
-        style.setUsedZIndex(0);
-
     // Cull out any useless layers and also repeat patterns into additional layers.
     style.adjustBackgroundLayers();
     style.adjustMaskLayers();