diff options
6 files changed, 75 insertions, 2 deletions
diff --git a/components/layout/display_list_builder.rs b/components/layout/display_list_builder.rs index 69242321c7e..8828994c056 100644 --- 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 index 01813e5779b..f98e337b32a 100644 --- 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 new file mode 100644 index 00000000000..e14795da114 --- /dev/null +++ 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 new file mode 100644 index 00000000000..01328b073c3 --- /dev/null +++ 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 new file mode 100644 index 00000000000..fdb6dd9b5a5 --- /dev/null +++ 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 new file mode 100644 index 00000000000..af313a9006e --- /dev/null +++ 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> |