Auto merge of #17456 - asajeffrey:script-paint-worklets-size, r=emilio

Paint worklet size should agree with Chrome.  Getting our implementation to agree with Chrome about the definition of the size parameter to a paint worklet. ---  - [X] `./mach build -d` does not report any errors - [X] `./mach test-tidy` does not report any errors - [X] These changes fix #17376 - [X] There are tests for these changes    --- This change is [<img src="https://reviewable.io/review_button.svg" height="34" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/17456)
servo · Jun 22, 2017 · 813eed2 · 813eed2
2 parents dfc44a0 + dded87e
commit 813eed2
Show file tree

Hide file tree

Showing 6 changed files with 75 additions and 2 deletions.
diff --git a/components/layout/display_list_builder.rs b/components/layout/display_list_builder.rs
@@ -1154,10 +1154,14 @@ impl FragmentDisplayListBuilding for Fragment {
                                                        paint_worklet: &PaintWorklet,
                                                        index: usize)
     {
-        // TODO: check that this is the servo equivalent of "concrete object size".
+        // This should be the "concrete object size" of the fragment.
         // https://drafts.css-houdini.org/css-paint-api/#draw-a-paint-image
         // https://drafts.csswg.org/css-images-3/#concrete-object-size
-        let size = self.content_box().size.to_physical(style.writing_mode);
+        // Experimentally, chrome is using the size in px of the box,
+        // including padding, but not border or margin, so we follow suit.
+        // https://github.com/w3c/css-houdini-drafts/issues/417
+        let unbordered_box = self.border_box - style.logical_border_width();
+        let size = unbordered_box.size.to_physical(style.writing_mode);
         let name = paint_worklet.name.clone();
 
         // If the script thread has not added any paint worklet modules, there is nothing to do!

diff --git a/tests/wpt/mozilla/meta/MANIFEST.json b/tests/wpt/mozilla/meta/MANIFEST.json
@@ -6772,6 +6772,18 @@
      ],
      {}
     ]
+   ],
+   "mozilla/worklets/test_paint_worklet_size.html": [
+    [
+     "/_mozilla/mozilla/worklets/test_paint_worklet_size.html",
+     [
+      [
+       "/_mozilla/mozilla/worklets/test_paint_worklet_ref.html",
+       "=="
+      ]
+     ],
+     {}
+    ]
    ]
   },
   "reftest_node": {
@@ -11264,6 +11276,16 @@
      {}
     ]
    ],
+   "mozilla/worklets/test_paint_worklet_size.js": [
+    [
+     {}
+    ]
+   ],
+   "mozilla/worklets/test_paint_worklet_size_ref.html": [
+    [
+     {}
+    ]
+   ],
    "mozilla/worklets/test_worklet.js": [
     [
      {}
@@ -31889,6 +31911,18 @@
    "e9cfa945824a8ecf07c41a269f82a2c2ca002406",
    "support"
   ],
+  "mozilla/worklets/test_paint_worklet_size.html": [
+   "6ddcf8ad81eaf4a5112de39a87cbd3d290fd9ab4",
+   "reftest"
+  ],
+  "mozilla/worklets/test_paint_worklet_size.js": [
+   "07bbe5099c4e721da1ca9cc8cbf5196e7e6e9510",
+   "support"
+  ],
+  "mozilla/worklets/test_paint_worklet_size_ref.html": [
+   "7c92e508e08d7d146354a5be7fa256ccbd465dde",
+   "support"
+  ],
   "mozilla/worklets/test_worklet.html": [
    "fe9c93a5307c616f878b6623155e1b04c86dd994",
    "testharness"

diff --git a/tests/wpt/mozilla/meta/mozilla/worklets/test_paint_worklet_size.html.ini b/tests/wpt/mozilla/meta/mozilla/worklets/test_paint_worklet_size.html.ini
@@ -0,0 +1,3 @@
+[test_paint_worklet_size.html]
+  type: reftest
+  expected: FAIL
diff --git a/tests/wpt/mozilla/tests/mozilla/worklets/test_paint_worklet_size.html b/tests/wpt/mozilla/tests/mozilla/worklets/test_paint_worklet_size.html
@@ -0,0 +1,17 @@
+<!doctype html>
+<html class="reftest-wait">
+    <head>
+        <meta charset=utf-8>
+        <title>Test the size parameter of paint worklets</title>
+        <link rel=match href=/_mozilla/mozilla/worklets/test_paint_worklet_ref.html>
+    </head>
+    <body>
+        <div style="height: 100px; width: 200px; background: paint(test);
+                    margin: 10px; border: 3px solid blue; padding: 5px;"></div>
+    </body>
+    <script>
+        window.paintWorklet
+            .addModule("test_paint_worklet_size.js")
+            .then(function() { document.documentElement.classList.remove("reftest-wait"); });
+    </script>
+</html>
diff --git a/tests/wpt/mozilla/tests/mozilla/worklets/test_paint_worklet_size.js b/tests/wpt/mozilla/tests/mozilla/worklets/test_paint_worklet_size.js
@@ -0,0 +1,8 @@
+registerPaint("test", class {
+    paint(ctx, size) {
+        if ((size.width === 210) && (size.height === 110)) {
+            ctx.fillStyle = "green";
+            ctx.fillRect(0, 0, size.width, size.height);
+        }
+    }
+});
diff --git a/tests/wpt/mozilla/tests/mozilla/worklets/test_paint_worklet_size_ref.html b/tests/wpt/mozilla/tests/mozilla/worklets/test_paint_worklet_size_ref.html
@@ -0,0 +1,7 @@
+<!doctype html>
+<html>
+    <body>
+        <div style="height: 100px; width: 200px; background: green;
+                    margin: 10px; border: 3px solid blue; padding: 5px;"></div>
+    </body>
+</html>