--- a/testing/web-platform/meta/MANIFEST.json
+++ b/testing/web-platform/meta/MANIFEST.json
@@ -127820,16 +127820,28 @@
[
"/css/css-shapes/shape-outside/shape-image/reference/shape-image-006-ref.html",
"=="
]
],
{}
]
],
+ "css/css-shapes/shape-outside/shape-image/shape-image-027.html": [
+ [
+ "/css/css-shapes/shape-outside/shape-image/shape-image-027.html",
+ [
+ [
+ "/css/css-shapes/shape-outside/shape-image/reference/shape-image-006-ref.html",
+ "=="
+ ]
+ ],
+ {}
+ ]
+ ],
"css/css-shapes/shape-outside/supported-shapes/circle/shape-outside-circle-013.html": [
[
"/css/css-shapes/shape-outside/supported-shapes/circle/shape-outside-circle-013.html",
[
[
"/css/css-shapes/shape-outside/supported-shapes/circle/reference/shape-outside-circle-013-ref.html",
"=="
]
@@ -518483,16 +518495,20 @@
"css/css-shapes/shape-outside/shape-image/shape-image-025.html": [
"c20645a47561cfa655b759d20f52d22536776893",
"reftest"
],
"css/css-shapes/shape-outside/shape-image/shape-image-026.html": [
"a7cbad00762e590050f118a84ef5d6a6fbbb3db3",
"reftest"
],
+ "css/css-shapes/shape-outside/shape-image/shape-image-027.html": [
+ "14d6e34ac39967dcf29b3140c5745458f26ed59d",
+ "reftest"
+ ],
"css/css-shapes/shape-outside/shape-image/support/animated.gif": [
"c5252926d8dbf82c06cdb615fda708ca7728f0bb",
"support"
],
"css/css-shapes/shape-outside/shape-image/support/left-half-rectangle-20.png": [
"d366673197353a2b32aee7befa9bab425d4a7be1",
"support"
],
@@ -580444,17 +580460,17 @@
"1b36ec082f41a6a7836ac75996a8e9db2069105e",
"support"
],
"html/semantics/scripting-1/the-script-element/module/import-meta/import-meta-root.js": [
"bc8e6d649615d09b970e328873bc138093f1c14d",
"support"
],
"html/semantics/scripting-1/the-script-element/module/import-meta/import-meta-url.html": [
- "3328350068373e6ad5cfd06f1180468ea4dccfb8",
+ "be7fd0cc365f59413abfd57287675596c8124f80",
"testharness"
],
"html/semantics/scripting-1/the-script-element/module/import-something-namespace.js": [
"3488bcae45d3094858fad47be6c3b21bfc3ac402",
"support"
],
"html/semantics/scripting-1/the-script-element/module/import-subgraph-404.html": [
"ecd62e08242206bfe40c5729e2dc0042e2172e50",
@@ -606724,17 +606740,17 @@
"ff5aba043424942d51020456af0f388bc46dc9f2",
"support"
],
"shadow-dom/Document-prototype-adoptNode.html": [
"073a718d72ebc7cc4c0564a4526e4ef9c3f604d7",
"testharness"
],
"shadow-dom/Document-prototype-currentScript.html": [
- "eadcbb987e528dee0bd773ce48026f64513a299e",
+ "c19ae5aa7d8ee63a50514fedd66231e48c31297e",
"testharness"
],
"shadow-dom/Document-prototype-importNode.html": [
"857cfd26d985a763ac16dac4b86b1223e6792388",
"testharness"
],
"shadow-dom/DocumentOrShadowRoot-prototype-elementFromPoint.html": [
"e33e48a3eb754e961f07b7850caff67eee38fe69",
@@ -606820,17 +606836,17 @@
"7726f8fe9056d3d5c9fb7b963c4bc6e777a8256a",
"testharness"
],
"shadow-dom/historical.html": [
"1469992db34a25397dc3d5a5e1eb600e8afcf71b",
"testharness"
],
"shadow-dom/input-element-list.html": [
- "79b4a278f0e35646cfdffeebf8f0523e2772bc9b",
+ "fcfa6fee4ecc1391a457880bad3564778a76127a",
"testharness"
],
"shadow-dom/layout-slot-no-longer-assigned.html": [
"224a688177941774e0bd3be74cb4aef20160d903",
"reftest"
],
"shadow-dom/layout-slot-no-longer-fallback.html": [
"a9be2ec9174a8944a237462b51519a8f88b4987a",
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-shapes/shape-outside/shape-image/shape-image-027.html
@@ -0,0 +1,69 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Test: left float, url(png), real negative offset image + shape-margin (px)</title>
+ <link rel="author" title="Brad Werth" href="mailto:bwerth@mozilla.com"/>
+ <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shapes-from-image"/>
+ <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property"/>
+ <link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shape-margin-property"/>
+ <link rel="match" href="reference/shape-image-006-ref.html"/>
+ <meta name="flags" content="ahem"/>
+ <meta name="assert" content="This test verifies that content wraps around all the image pixels
+ + the shape-margin when shape-outside is given a png file.
+ Additionally, the shape-outside: image element is given a negative
+ left offset relative to its containing block."/>
+ <style type="text/css">
+ body {
+ margin: 0;
+ }
+ .container {
+ left: 10px;
+ font: 50px/1 Ahem;
+ }
+ #test {
+ width: 200px;
+ color: rgb(0,100,0);
+ }
+ #image {
+ float: left;
+ shape-outside: url("support/left-half-rectangle.png");
+ shape-margin: 20px;
+ margin-left: -10px;
+ width: 100px;
+ height: 100px;
+ }
+ .blue {
+ width: 2px;
+ height: 100px;
+ background-color: blue;
+ }
+ .left-line { left: 65px; }
+ .right-line { left: 125px; }
+
+ .failure {
+ left: 70px;
+ width: 50px;
+ height: 100px;
+ background-color: red;
+ z-index: -1;
+ }
+ .container, .blue, .failure {
+ position: absolute;
+ top: 70px;
+ }
+ </style>
+</head>
+<body>
+ <p>
+ The test passes if the green rectangle on the right is completely between the two blue lines.
+ There should be no red.
+ </p>
+ <div id="test" class="container">
+ <div id="image"><img src="support/left-half-rectangle.png" style="margin-left: 10px"/></div>
+ X<br/>X
+ </div>
+ <div class="blue left-line"></div>
+ <div class="blue right-line"></div>
+ <div class="failure"></div>
+</body>
+</html>