Skip to content

GitLab

T
tangled
Commit b20c89c7 authored by Rune Lillesveen's avatar Rune Lillesveen Committed by Commit Bot
Browse files
Options

Tests and implementation of display:contents in SVG. 

Adjusted how display:contents affect various SVG elements as specified
in https://drafts.csswg.org/css-display/#unbox-svg

By using IsOutermostSVGSVGElement() for svg root testing , this change
also fixes 795685.

Bug: 794498, 795685
Cq-Include-Trybots: master.tryserver.blink:linux_trusty_blink_rel;master.tryserver.chromium.linux:linux_layout_tests_slimming_paint_v2
Change-Id: I6b45f1ad65cfe9b29378d9ea9f2c4f9d855da231
Reviewed-on: https://chromium-review.googlesource.com/829633
Commit-Queue: Rune Lillesveen <futhark@chromium.org>
Reviewed-by: default avatarFredrik Söderquist <fs@opera.com>
Cr-Commit-Position: refs/heads/master@{#524687}
parent c7e93d23
Hide whitespace changes
Inline Side-by-side
Showing with 85 additions and 27 deletions
third_party/WebKit/LayoutTests/external/wpt/css/css-display/display-contents-svg-elements-ref.html 0 → 100644
View file @ b20c89c7
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Reftest Reference</title>
<link rel="author" title="Rune Lillesveen" href="mailto:futhark@chromium.org">
<p>You should see the word PASS below.</p>
<div style="font: 16px monospace">
<svg>
<text x="0" y="20">P</text>
<text x="10" y="20">A</text>
<text x="20" y="20">S</text>
<text x="30" y="20">S</text>
</svg>
</div>
third_party/WebKit/LayoutTests/external/wpt/css/css-display/display-contents-svg-elements.html 0 → 100644
View file @ b20c89c7
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Display: display:contents and SVG elements</title>
<link rel="author" title="Rune Lillesveen" href="mailto:futhark@chromium.org">
<link rel="help" href="https://drafts.csswg.org/css-display/#unbox-svg">
<link rel="match" href="display-contents-svg-elements-ref.html">
<p>You should see the word PASS below.</p>
<div style="font: 16px monospace">
<svg>
<defs><text x="20" y="20" id="S">S</text></defs>
<text y="40" style="display:contents">FAIL</text>
<svg style="display:contents;opacity:0">
<text x="0" y="20">P</text>
</svg>
<g style="display:contents;opacity:0">
<text x="10" y="20"><tspan dx="2000" style="display:contents;opacity:0">A</tspan></text>
</g>
<use xlink:href="#S" style="display:contents;opacity:0"></use>
<text x="30" y="20">S</text>
</svg>
<svg style="display:contents"><text y="40">FAIL</text></svg>
</div>
third_party/WebKit/LayoutTests/external/wpt/svg/foreignobject/position-svg-root-in-foreign-object-ref.html 0 → 100644
View file @ b20c89c7
<!DOCTYPE html>
<meta charset="utf-8">
<title>SVG Reftest Reference</title>
<link rel="author" title="Rune Lillesveen" href="mailto:futhark@chromium.org">
<p>You should see the word PASS and no red below.</p>
PASS
third_party/WebKit/LayoutTests/external/wpt/svg/foreignobject/position-svg-root-in-foreign-object.html 0 → 100644
View file @ b20c89c7
<!DOCTYPE html>
<meta charset="utf-8">
<title>SVG: svg root child of foreignObject should be positionable</title>
<link rel="author" title="Rune Lillesveen" href="mailto:futhark@chromium.org">
<link rel="help" href="https://svgwg.org/svg2-draft/embedded.html#ForeignObjectElement">
<link rel="match" href="position-svg-root-in-foreign-object-ref.html">
<p>You should see the word PASS and no red below.</p>
<svg>
<foreignObject>
PASS
<svg style="position:absolute; left: -1000px; width:100px; height: 100px; background: red"></svg>
</foreignObject>
</svg>
third_party/WebKit/LayoutTests/svg/css/display-computed.html
View file @ b20c89c7
......@@ -31,6 +31,6 @@ test(function(){ assert_equals(getComputedStyle(document.querySelector("#t5")).d
test(function(){ assert_equals(getComputedStyle(document.querySelector("#t5 g")).display, "table"); }, "svg:g display table");
test(function(){ assert_equals(getComputedStyle(document.querySelector("#t6")).display, "table-cell"); }, "svg:svg display table-cell");
test(function(){ assert_equals(getComputedStyle(document.querySelector("#t6 g")).display, "table-cell"); }, "svg:g display table-cell");
test(function(){ assert_equals(getComputedStyle(document.querySelector("#t7")).display, "inline"); }, "svg:svg display contents computes to inline");
test(function(){ assert_equals(getComputedStyle(document.querySelector("#t7 g")).display, "inline"); }, "svg:g display contents computes to inline");
test(function(){ assert_equals(getComputedStyle(document.querySelector("#t7")).display, "none"); }, "svg:svg display contents computes to none");
test(function(){ assert_equals(getComputedStyle(document.querySelector("#t7 g")).display, "contents"); }, "svg:g display contents computes to contents");
</script>
third_party/WebKit/LayoutTests/svg/css/display-expected.html
View file @ b20c89c7
......@@ -14,7 +14,7 @@ img {
#t4 { display: inline-table; }
#t5 { display: table; }
#t6 { display: table-cell; }
#t7, #t8 { display: inline; }
#t7, #t8 { display: none; }
</style>
<img id="t1" src="../../css2.1/support/1x1-transparent.png">
<img id="t2" src="../../css2.1/support/1x1-transparent.png">
......
third_party/WebKit/Source/core/css/resolver/StyleAdjuster.cpp
View file @ b20c89c7
......@@ -400,12 +400,10 @@ static void AdjustStyleForDisplay(ComputedStyle& style,
static void AdjustEffectiveTouchAction(ComputedStyle& style,
const ComputedStyle& parent_style,
Element* element) {
Element* element,
bool is_svg_root) {
TouchAction inherited_action = parent_style.GetEffectiveTouchAction();
bool is_svg_root = element && element->IsSVGElement() &&
IsSVGSVGElement(*element) && element->parentNode() &&
!element->parentNode()->IsSVGElement();
bool is_replaced_canvas =
element && IsHTMLCanvasElement(element) &&
element->GetDocument().GetFrame() &&
......@@ -568,25 +566,28 @@ void StyleAdjuster::AdjustComputedStyle(StyleResolverState& state,
AdjustStyleForEditing(style);
bool is_svg_root = false;
bool is_svg_element = element && element->IsSVGElement();
if (is_svg_element) {
// display: contents computes to inline for replaced elements and form
// controls, and isn't specified for other kinds of SVG content[1], so let's
// just do the same here for all other SVG elements.
//
// If we wouldn't do this, then we'd need to ensure that display: contents
// doesn't prevent SVG elements from generating a LayoutObject in
// SVGElement::LayoutObjectIsNeeded.
//
// [1]: https://www.w3.org/TR/SVG/painting.html#DisplayProperty
if (style.Display() == EDisplay::kContents)
style.SetDisplay(EDisplay::kInline);
// Only the root <svg> element in an SVG document fragment tree honors css
// position.
if (!(IsSVGSVGElement(*element) && element->parentNode() &&
!element->parentNode()->IsSVGElement()))
if (is_svg_element) {
is_svg_root = ToSVGElement(element)->IsOutermostSVGSVGElement();
if (!is_svg_root) {
// Only the root <svg> element in an SVG document fragment tree honors css
// position.
style.SetPosition(ComputedStyleInitialValues::InitialPosition());
}
if (style.Display() == EDisplay::kContents &&
(is_svg_root ||
(!IsSVGSVGElement(element) && !IsSVGGElement(element) &&
!IsSVGUseElement(element) && !IsSVGTSpanElement(element)))) {
// According to the CSS Display spec[1], nested <svg> elements, <g>,
// <use>, and <tspan> elements are not rendered and their children are
// "hoisted". For other elements display:contents behaves as display:none.
//
// [1] https://drafts.csswg.org/css-display/#unbox-svg
style.SetDisplay(EDisplay::kNone);
}
// SVG text layout code expects us to be a block-level style element.
if ((IsSVGForeignObjectElement(*element) || IsSVGTextElement(*element)) &&
......@@ -615,7 +616,7 @@ void StyleAdjuster::AdjustComputedStyle(StyleResolverState& state,
style.SetJustifyItems(parent_style.JustifyItems());
}
AdjustEffectiveTouchAction(style, parent_style, element);
AdjustEffectiveTouchAction(style, parent_style, element, is_svg_root);
bool is_media_control =
element && element->ShadowPseudoId().StartsWith("-webkit-media-controls");
......
third_party/WebKit/Source/core/svg/SVGGElement.cpp
View file @ b20c89c7
......@@ -33,14 +33,15 @@ inline SVGGElement::SVGGElement(Document& document,
DEFINE_NODE_FACTORY(SVGGElement)
LayoutObject* SVGGElement::CreateLayoutObject(const ComputedStyle& style) {
// SVG 1.1 testsuite explicitely uses constructs like
// SVG 1.1 testsuite explicitly uses constructs like
// <g display="none"><linearGradient>
// We still have to create layoutObjects for the <g> & <linearGradient>
// element, though the subtree may be hidden - we only want the resource
// layoutObjects to exist so they can be referenced from somewhere else.
if (style.Display() == EDisplay::kNone)
return new LayoutSVGHiddenContainer(this);
if (style.Display() == EDisplay::kContents)
return nullptr;
return new LayoutSVGTransformableContainer(this);
}
......
third_party/WebKit/Source/core/svg/SVGUseElement.cpp
View file @ b20c89c7
......@@ -482,7 +482,9 @@ void SVGUseElement::BuildShadowAndInstanceTree(SVGElement& target) {
UpdateRelativeLengthsInformation();
}
LayoutObject* SVGUseElement::CreateLayoutObject(const ComputedStyle&) {
LayoutObject* SVGUseElement::CreateLayoutObject(const ComputedStyle& style) {
if (style.Display() == EDisplay::kContents)
return nullptr;
return new LayoutSVGTransformableContainer(this);
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment