Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(16)

Unified Diff: LayoutTests/fast/multicol/composited-layer-will-change.html

Issue 801053005: [New Multicolumn] Render transformed layers into multiple fragments. (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: rebase master Created 5 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
Index: LayoutTests/fast/multicol/composited-layer-will-change.html
diff --git a/LayoutTests/fast/multicol/composited-layer-will-change.html b/LayoutTests/fast/multicol/composited-layer-will-change.html
new file mode 100644
index 0000000000000000000000000000000000000000..d86f020b99ef2d248b5aad2750776861796635e3
--- /dev/null
+++ b/LayoutTests/fast/multicol/composited-layer-will-change.html
@@ -0,0 +1,74 @@
+<!DOCTYPE html>
+<style>
+.multicol {
+ margin: 3em 0;
+ width: 60px;
+ -webkit-column-width: 20px;
+ -webkit-column-gap: 0;
+ column-fill: auto;
+ height: 60px;
+}
+.square {
+ width: 20px;
+ height: 20px;
+ background: green;
+}
+#test1 .layer { will-change: transform; }
+#test2 .layer { will-change: opacity; }
+#test3 .layer { will-change: top; position: relative; }
+</style>
+
+<p>There should be three green squares below.</p>
+<div id="test1" class="multicol">
+ <div class="layer"> <!-- first column -->
+ <div class="square"></div>
+ </div>
+ <div class="square"></div>
+ <div class="layer"> <!-- from first to second column -->
+ <div class="square"></div>
+ <div class="square"></div>
+ </div>
+ <div class="square"></div>
+ <div class="layer"> <!-- from second to third column -->
+ <div class="square"></div>
+ <div class="square"></div>
+ <div class="square"></div>
+ </div>
+ <div class="square"></div>
+</div>
+
+<div id="test2" class="multicol">
+ <div class="layer"> <!-- first column -->
+ <div class="square"></div>
+ </div>
+ <div class="square"></div>
+ <div class="layer"> <!-- from first to second column -->
+ <div class="square"></div>
+ <div class="square"></div>
+ </div>
+ <div class="square"></div>
+ <div class="layer"> <!-- from second to third column -->
+ <div class="square"></div>
+ <div class="square"></div>
+ <div class="square"></div>
+ </div>
+ <div class="square"></div>
+</div>
+
+<div id="test3" class="multicol">
+ <div class="layer"> <!-- first column -->
+ <div class="square"></div>
+ </div>
+ <div class="square"></div>
+ <div class="layer"> <!-- from first to second column -->
+ <div class="square"></div>
+ <div class="square"></div>
+ </div>
+ <div class="square"></div>
+ <div class="layer"> <!-- from second to third column -->
+ <div class="square"></div>
+ <div class="square"></div>
+ <div class="square"></div>
+ </div>
+ <div class="square"></div>
+</div>

Powered by Google App Engine
This is Rietveld 408576698