LayoutTests/fast/regions/region-styling/region-style-block-background-color2.html - Issue 159863002: Remove CSS regions support, keeping a bare minimum to support "region-based" multicol.

Unified Diff: LayoutTests/fast/regions/region-styling/region-style-block-background-color2.html

Issue 159863002: Remove CSS regions support, keeping a bare minimum to support "region-based" multicol. (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master

Patch Set: Created 6 years, 10 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View side-by-side diff with in-line comments

Download patch

« no previous file with comments | « LayoutTests/fast/regions/region-styling/region-style-block-background-color-expected.html ('k') | LayoutTests/fast/regions/region-styling/region-style-block-background-color2-expected.html » ('j') | Source/devtools/front_end/protocol_externs.js » ('J')
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

Index: LayoutTests/fast/regions/region-styling/region-style-block-background-color2.html

diff --git a/LayoutTests/fast/regions/region-styling/region-style-block-background-color2.html b/LayoutTests/fast/regions/region-styling/region-style-block-background-color2.html

deleted file mode 100644

index bd0c441930e9746d2b67585e6d7f9b1afb3f7658..0000000000000000000000000000000000000000

--- a/LayoutTests/fast/regions/region-styling/region-style-block-background-color2.html

+++ /dev/null

@@ -1,200 +0,0 @@

-<!doctype html>

-<html>

- <!--

- Test for https://bugs.webkit.org/show_bug.cgi?id=71488 (Add support for background-color in region styling).

- Test setting the background-color property using region styling for boxes.

- You should not see any red background below.

- -->

- <head>

- <style>

- html { font: 16px/1.25 monospace; }

- .regionTextBlock { background-color: red; }

- .regionBox { width: 420px; height: 50px; }

- .regionBox1 { width: 420px; height: 30px; }

- .regionBox2 { width: 420px; height: 100px; }

- #article1 { -webkit-flow-into: flow1; }

- .region1 { -webkit-flow-from: flow1; }

- @-webkit-region #region1 { #regionTextBlock1 { background-color: green; } }

- .article2 { -webkit-flow-into: flow2; }

- .region2 { -webkit-flow-from: flow2; }

- #regionTextBlock2 { background-color: lime; width: 420px; }

- @-webkit-region .region2 { #regionTextBlock2 { background-color: green; } }

- #article3 { -webkit-flow-into: flow3; }

- #region31, #region32 { -webkit-flow-from: flow3; }

- @-webkit-region #region31 { #regionTextBlock4 { background-color: green; } }

- @-webkit-region #region32 { #regionTextBlock3 { background-color: lime; } }

- #article4 { -webkit-flow-into: flow4; }

- #region41, #region42 { -webkit-flow-from: flow4; }

- @-webkit-region #region41 { #regionTextBlock6 { background-color: green; } }

- @-webkit-region #region42 { #regionTextBlock5 { background-color: lime; } }

- #article5 { -webkit-flow-into: flow5; }

- #region51, #region52 { -webkit-flow-from: flow5; }

- @-webkit-region #region51 {

- #regionTextBlock7 { background-color: green; }

- #regionTextBlock8 { background-color: green; }

- }

- @-webkit-region #region52 { #regionTextBlock8 { background-color: lime; } }

- #article6 { -webkit-flow-into: flow6; }

- #region61, #region62 { -webkit-flow-from: flow6; }

- @-webkit-region #region61 { #regionTextBlock9 { background-color: green; } }

- @-webkit-region #region62 { #regionTextBlock10 { background-color: lime; } }

- #article7 { -webkit-flow-into: flow7; }

- #region71, #region72 { -webkit-flow-from: flow7; }

- @-webkit-region #region71 {

- #regionTextBlock11 { background-color: green; }

- #regionTextBlock12 { background-color: green; }

- }

- @-webkit-region #region72 { #regionTextBlock12 { background-color: lime; } }

- </style>

- </head>

- <body onload="runTests()">

-

- <div id="article1">

- <div class="regionTextBlock" id="regionTextBlock1">Green background text styled in region1.</div>

- </div>

- <div id="region1" class="regionBox1"></div>

-

- <div class="article2">

- <div class="regionTextBlock" id="regionTextBlock2">Lime background text styled out region2.</div>

- </div>

- <div class="region2 regionBox"></div>

- <!-- Paragraphs styled in different regions.

- The first para is removed and appended to the flow.

- Both paragraphs will be styled again in the opposite regions.-->

- <div id="article3">

- <div class="regionTextBlock" id="regionTextBlock3">Lime background text styled in region32.</div>

- <br>

- <div class="regionTextBlock" id="regionTextBlock4">Green background text styled in region31.</div>

- </div>

- <div id="region31" class="regionBox"></div>

- <div id="region32" class="regionBox1"></div>

- <!-- Paragraph styled in first region. A new paragrash is inserted before in the flow,

- pushing the first paragrash in the second region.-->

- <div id="article4">

- <div class="regionTextBlock" id="regionTextBlock5">Lime background text styled in region42.</div>

- </div>

- <div id="region41" class="regionBox"></div>

- <div id="region42" class="regionBox1"></div>

- <!-- Two paragraphs styled in different regions. After the first region height increases,

- both paragraphs are placed and styled in the first region.-->

- <div id="article5">

- <div class="regionTextBlock" id="regionTextBlock7">Green background text styled in region51.</div>

- <br>

- <div class="regionTextBlock" id="regionTextBlock8">Green background text styled in region51.</div>

- </div>

- <div id="region51" class="regionBox"></div>

- <div id="region52" class="regionBox1"></div>

- <!-- Two paragraphs styled in the first region. After the first region height decreases,

- the first paragraph is styled in the first region while the second paragraph is styled

- in the second region.

- -->

- <div id="article6">

- <div class="regionTextBlock" id="regionTextBlock9">Green background text styled in region61.</div>

- <br>

- <div class="regionTextBlock" id="regionTextBlock10">Lime background text styled in region62.</div>

- </div>

- <div id="region61" class="regionBox2"></div>

- <div id="region62" class="regionBox1"></div>

- <!-- Two paragraphs styled in the first region. The height of first region is

- decreased/increased and in the end, the second paragraph ends up in the second region.-->

- <div id="article7">

- <div class="regionTextBlock" id="regionTextBlock11">Green background text styled in region71.</div>

- <br>

- <div class="regionTextBlock" id="regionTextBlock12">Lime background text styled in region72.</div>

- </div>

- <div id="region71" class="regionBox2"></div>

- <div id="region72" class="regionBox1"></div>

- <script>

- if (window.testRunner)

- window.testRunner.waitUntilDone();

- function testFlow1()

- {

- var region1 = document.getElementById("region1");

- region1.className = "region1 regionBox";

- }

- function testFlow2()

- {

- var article2 = document.getElementsByClassName("article2")[0];

- article2.className = "";

- var region2 = document.getElementsByClassName("region2 regionBox")[0];

- region2.className = "";

- }

- function testFlow3()

- {

- var d = document.getElementById("regionTextBlock3");

- var parent = d.parentNode;

- parent.removeChild(d);

- parent.appendChild(d);

- }

- function testFlow4()

- {

- var d = document.getElementById("regionTextBlock5");

- var d1 = document.createElement("div");

- d1.innerHTML = "Green background text styled in region41.";

- d1.className = "regionTextBlock";

- d1.id = "regionTextBlock6";

- d.parentNode.insertBefore(d1, d);

- var lineBreak = document.createElement("br");

- d.parentNode.insertBefore(lineBreak, d);

- }

- function testFlow5()

- {

- document.getElementById("region51").style.height = "100px";

- document.getElementById("region52").style.height = "10px";

- }

- function testFlow6()

- {

- document.getElementById("region61").style.height = "50px";

- }

- function testFlow71()

- {

- document.getElementById("region71").style.height = "50px";

- }

- function testFlow72()

- {

- document.getElementById("region71").style.height = "100px";

- }

- function testFlow73()

- {

- document.getElementById("region71").style.height = "50px";

- if (window.testRunner)

- window.testRunner.notifyDone();

- }

- function runTests() {

- testFlow1();

- testFlow2();

- testFlow3();

- testFlow4();

- testFlow5();

- testFlow6();

- testFlow71();

- setTimeout(testFlow72, 100);

- setTimeout(testFlow73, 200);

- }

- </script>

- </body>

-</html>