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

Unified Diff: third_party/WebKit/LayoutTests/compositing/overflow/tiled-mask.html

Issue 2689253002: cc: Add layout test cases for mask tiling. (Closed)
Patch Set: Rebaseline virtual/prefer_compositing_to_lcd_text tests. Created 3 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: third_party/WebKit/LayoutTests/compositing/overflow/tiled-mask.html
diff --git a/third_party/WebKit/LayoutTests/compositing/overflow/tiled-mask.html b/third_party/WebKit/LayoutTests/compositing/overflow/tiled-mask.html
new file mode 100644
index 0000000000000000000000000000000000000000..4ecea2237188c6a2923cd262f38a89bf393d0f4f
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/compositing/overflow/tiled-mask.html
@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<style>
+#mask {
+ width: 800px;
+ height: 800px;
+ overflow: hidden;
+ border-radius: 90px;
+ will-change: transform;
+ border: 4px solid red;
+ background-color: grey;
+}
+
+.clipped {
+ width: 100px;
+ height: 100px;
+ will-change: transform;
+ position: absolute;
+}
+
+.small {
+ width: 50px;
+ height: 50px;
+ will-change: transform;
+ position: absolute;
+}
+
+#spacer {
+ width: 2000px;
+ height: 2000px;
+ position: absolute;
+ will-change: transform;
+ background: papayawhip;
+}
+</style>
+<script src="../../resources/run-after-layout-and-paint.js"></script>
+<script>
+runAfterLayoutAndPaint(function() {
+ window.scrollTo(300, 300);
+}, true);
+</script>
+<div id="mask">
+ <div id="spacer">There's stuff in here</div>
+ <div class="small" style="left:0px; top:0px; background: maroon"></div>
+ <div class="clipped" style="left: 0px; top: 700px; background: orange"></div>
+ <div class="clipped" style="left: -60px; top: 70px; background: green"></div>
+ <div class="clipped" style="left: 120px; top: 700px; background: blue"></div>
+ <div class="clipped" style="left: 750px; top: 0px; background: yellow"></div>
+ <div class="clipped" style="left: 80px; top: 300px; background: grey"></div>
+ <div class="clipped" style="left: 20px; top: 400px; background: red"></div>
+ <div class="small" style="left: 750px; top: 750px; background: purple"></div>
+</div>

Powered by Google App Engine
This is Rietveld 408576698