From 26a029d407be480d791972afb5975cf62c9360a6 Mon Sep 17 00:00:00 2001
From: Daniel Baumann <daniel.baumann@progress-linux.org>
Date: Fri, 19 Apr 2024 02:47:55 +0200
Subject: Adding upstream version 124.0.1.

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
---
 .../css-shapes/dynamic-shape-outside-1-ref.html    | 28 +++++++++++++++
 .../css-shapes/dynamic-shape-outside-1.html        | 36 +++++++++++++++++++
 .../css-shapes/dynamic-shape-outside-2.html        | 37 +++++++++++++++++++
 layout/reftests/css-shapes/reftest.list            | 34 ++++++++++++++++++
 .../css-shapes/shape-outside-empty-circle-1.html   | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-circle-2.html   | 42 ++++++++++++++++++++++
 .../css-shapes/shape-outside-empty-circle-3.html   | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-circle-ref.html | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-ellipse-1.html  | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-ellipse-2.html  | 42 ++++++++++++++++++++++
 .../css-shapes/shape-outside-empty-ellipse-3.html  | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-ellipse-4.html  | 42 ++++++++++++++++++++++
 .../css-shapes/shape-outside-empty-ellipse-5.html  | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-ellipse-6.html  | 42 ++++++++++++++++++++++
 .../css-shapes/shape-outside-empty-ellipse-7.html  | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-ellipse-8.html  | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-inset-1.html    | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-inset-2.html    | 42 ++++++++++++++++++++++
 .../css-shapes/shape-outside-empty-inset-3.html    | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-inset-4.html    | 42 ++++++++++++++++++++++
 .../css-shapes/shape-outside-empty-inset-5.html    | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-inset-6.html    | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-inset-7.html    | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-inset-8.html    | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-line-ref.html   | 35 ++++++++++++++++++
 .../shape-outside-empty-nothing-ref.html           | 34 ++++++++++++++++++
 .../css-shapes/shape-outside-empty-point-ref.html  | 34 ++++++++++++++++++
 .../css-shapes/shape-outside-empty-polygon-1.html  | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-polygon-2.html  | 42 ++++++++++++++++++++++
 .../css-shapes/shape-outside-empty-polygon-3.html  | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-polygon-4.html  | 42 ++++++++++++++++++++++
 .../css-shapes/shape-outside-empty-polygon-5.html  | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-polygon-6.html  | 41 +++++++++++++++++++++
 .../css-shapes/shape-outside-empty-polygon-7.html  | 41 +++++++++++++++++++++
 34 files changed, 1353 insertions(+)
 create mode 100644 layout/reftests/css-shapes/dynamic-shape-outside-1-ref.html
 create mode 100644 layout/reftests/css-shapes/dynamic-shape-outside-1.html
 create mode 100644 layout/reftests/css-shapes/dynamic-shape-outside-2.html
 create mode 100644 layout/reftests/css-shapes/reftest.list
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-circle-1.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-circle-2.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-circle-3.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-circle-ref.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-ellipse-1.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-ellipse-2.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-ellipse-3.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-ellipse-4.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-ellipse-5.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-ellipse-6.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-ellipse-7.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-ellipse-8.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-inset-1.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-inset-2.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-inset-3.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-inset-4.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-inset-5.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-inset-6.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-inset-7.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-inset-8.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-line-ref.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-nothing-ref.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-point-ref.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-polygon-1.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-polygon-2.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-polygon-3.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-polygon-4.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-polygon-5.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-polygon-6.html
 create mode 100644 layout/reftests/css-shapes/shape-outside-empty-polygon-7.html

(limited to 'layout/reftests/css-shapes')

diff --git a/layout/reftests/css-shapes/dynamic-shape-outside-1-ref.html b/layout/reftests/css-shapes/dynamic-shape-outside-1-ref.html
new file mode 100644
index 0000000000..751755d392
--- /dev/null
+++ b/layout/reftests/css-shapes/dynamic-shape-outside-1-ref.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Reference: Dynamic change to shape-outside</title>
+<style>
+.circle {
+  float: left;
+  width: 25vmin;
+  height: 25vmin;
+  background: #f06;
+  shape-outside: circle();
+}
+</style>
+</head>
+<body>
+<div class="circle"></div>
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent
+scelerisque pretium interdum. Nam rhoncus auctor consequat. Duis porta
+tortor eu nibh efficitur, eget tempor tortor semper. Integer eu sem
+placerat, sodales tortor at, ornare orci. Fusce id malesuada est. Aenean
+ mattis augue sapien. Fusce efficitur ante sed porttitor blandit. Nam
+facilisis aliquam elit, ut consequat quam interdum sit amet. Integer
+bibendum turpis at mi dapibus dictum. Donec id lorem arcu. Pellentesque
+tortor nunc, semper a dui vel, maximus varius orci. Maecenas posuere
+enim in tempor imperdiet.
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/dynamic-shape-outside-1.html b/layout/reftests/css-shapes/dynamic-shape-outside-1.html
new file mode 100644
index 0000000000..eece5aff42
--- /dev/null
+++ b/layout/reftests/css-shapes/dynamic-shape-outside-1.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Dynamic change to shape-outside</title>
+<style>
+.circle {
+  float: left;
+  width: 25vmin;
+  height: 25vmin;
+  background: #f06;
+}
+</style>
+<script>
+function doTest() {
+  let circle = document.querySelector(".circle");
+  circle.style.shapeOutside = "circle()";
+
+  document.documentElement.removeAttribute('class');
+}
+document.addEventListener("MozReftestInvalidate", doTest);
+</script>
+</head>
+<body>
+<div class="circle"></div>
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent
+scelerisque pretium interdum. Nam rhoncus auctor consequat. Duis porta
+tortor eu nibh efficitur, eget tempor tortor semper. Integer eu sem
+placerat, sodales tortor at, ornare orci. Fusce id malesuada est. Aenean
+ mattis augue sapien. Fusce efficitur ante sed porttitor blandit. Nam
+facilisis aliquam elit, ut consequat quam interdum sit amet. Integer
+bibendum turpis at mi dapibus dictum. Donec id lorem arcu. Pellentesque
+tortor nunc, semper a dui vel, maximus varius orci. Maecenas posuere
+enim in tempor imperdiet.
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/dynamic-shape-outside-2.html b/layout/reftests/css-shapes/dynamic-shape-outside-2.html
new file mode 100644
index 0000000000..f5be203b77
--- /dev/null
+++ b/layout/reftests/css-shapes/dynamic-shape-outside-2.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Dynamic change to shape-outside</title>
+<style>
+.circle {
+  float: left;
+  width: 25vmin;
+  height: 25vmin;
+  background: #f06;
+  shape-outside: circle(100%);
+}
+</style>
+<script>
+function doTest() {
+  let circle = document.querySelector(".circle");
+  circle.style.shapeOutside = "circle()";
+
+  document.documentElement.removeAttribute('class');
+}
+document.addEventListener("MozReftestInvalidate", doTest);
+</script>
+</head>
+<body>
+<div class="circle"></div>
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent
+scelerisque pretium interdum. Nam rhoncus auctor consequat. Duis porta
+tortor eu nibh efficitur, eget tempor tortor semper. Integer eu sem
+placerat, sodales tortor at, ornare orci. Fusce id malesuada est. Aenean
+ mattis augue sapien. Fusce efficitur ante sed porttitor blandit. Nam
+facilisis aliquam elit, ut consequat quam interdum sit amet. Integer
+bibendum turpis at mi dapibus dictum. Donec id lorem arcu. Pellentesque
+tortor nunc, semper a dui vel, maximus varius orci. Maecenas posuere
+enim in tempor imperdiet.
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/reftest.list b/layout/reftests/css-shapes/reftest.list
new file mode 100644
index 0000000000..7465f12a62
--- /dev/null
+++ b/layout/reftests/css-shapes/reftest.list
@@ -0,0 +1,34 @@
+== dynamic-shape-outside-1.html dynamic-shape-outside-1-ref.html
+== dynamic-shape-outside-2.html dynamic-shape-outside-1-ref.html
+
+== shape-outside-empty-circle-1.html shape-outside-empty-point-ref.html
+== shape-outside-empty-circle-2.html shape-outside-empty-circle-ref.html
+== shape-outside-empty-circle-3.html shape-outside-empty-nothing-ref.html
+
+== shape-outside-empty-ellipse-1.html shape-outside-empty-point-ref.html
+== shape-outside-empty-ellipse-2.html shape-outside-empty-circle-ref.html
+== shape-outside-empty-ellipse-3.html shape-outside-empty-point-ref.html
+# The next test needs fuzzy due to chamfer aberration
+fuzzy(0-255,0-520) == shape-outside-empty-ellipse-4.html shape-outside-empty-circle-ref.html
+== shape-outside-empty-ellipse-5.html shape-outside-empty-line-ref.html
+== shape-outside-empty-ellipse-6.html shape-outside-empty-line-ref.html
+== shape-outside-empty-ellipse-7.html shape-outside-empty-nothing-ref.html
+== shape-outside-empty-ellipse-8.html shape-outside-empty-nothing-ref.html
+
+== shape-outside-empty-inset-1.html shape-outside-empty-point-ref.html
+== shape-outside-empty-inset-2.html shape-outside-empty-circle-ref.html
+== shape-outside-empty-inset-3.html shape-outside-empty-point-ref.html
+== shape-outside-empty-inset-4.html shape-outside-empty-circle-ref.html
+== shape-outside-empty-inset-5.html shape-outside-empty-line-ref.html
+== shape-outside-empty-inset-6.html shape-outside-empty-line-ref.html
+== shape-outside-empty-inset-7.html shape-outside-empty-nothing-ref.html
+== shape-outside-empty-inset-8.html shape-outside-empty-nothing-ref.html
+
+== shape-outside-empty-polygon-1.html shape-outside-empty-point-ref.html
+# The next test needs fuzzy due to chamfer aberration
+fuzzy(0-255,0-520) == shape-outside-empty-polygon-2.html shape-outside-empty-circle-ref.html
+== shape-outside-empty-polygon-3.html shape-outside-empty-line-ref.html
+== shape-outside-empty-polygon-4.html shape-outside-empty-line-ref.html
+== shape-outside-empty-polygon-5.html shape-outside-empty-point-ref.html
+== shape-outside-empty-polygon-6.html shape-outside-empty-nothing-ref.html
+== shape-outside-empty-polygon-7.html shape-outside-empty-nothing-ref.html
diff --git a/layout/reftests/css-shapes/shape-outside-empty-circle-1.html b/layout/reftests/css-shapes/shape-outside-empty-circle-1.html
new file mode 100644
index 0000000000..51de60cbe3
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-circle-1.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty circle, acts like a point</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: circle(0px);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-circle-2.html b/layout/reftests/css-shapes/shape-outside-empty-circle-2.html
new file mode 100644
index 0000000000..3c35b55e4a
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-circle-2.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty circle, with shape-margin acts like a circle</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: circle(0px);
+    shape-margin: 90px;
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-circle-3.html b/layout/reftests/css-shapes/shape-outside-empty-circle-3.html
new file mode 100644
index 0000000000..e001ad0b54
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-circle-3.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty circle, positioned between elements, acts like nothing</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: circle(0px at 100px 20px);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-circle-ref.html b/layout/reftests/css-shapes/shape-outside-empty-circle-ref.html
new file mode 100644
index 0000000000..2f28650135
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-circle-ref.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Reference: Shape-outside empty area, float elements around a circle</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: circle(90px);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-ellipse-1.html b/layout/reftests/css-shapes/shape-outside-empty-ellipse-1.html
new file mode 100644
index 0000000000..f20798c41e
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-ellipse-1.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty point ellipse, acts like a point</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: ellipse(0px 0px);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-ellipse-2.html b/layout/reftests/css-shapes/shape-outside-empty-ellipse-2.html
new file mode 100644
index 0000000000..58fe473a3d
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-ellipse-2.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty point ellipse, with shape-margin acts like a circle</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: ellipse(0px 0px);
+    shape-margin: 90px;
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-ellipse-3.html b/layout/reftests/css-shapes/shape-outside-empty-ellipse-3.html
new file mode 100644
index 0000000000..8e5d50855f
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-ellipse-3.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty horizontal ellipse, acts like a point</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: ellipse(50px 0px at 50px 90px);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-ellipse-4.html b/layout/reftests/css-shapes/shape-outside-empty-ellipse-4.html
new file mode 100644
index 0000000000..2e7b6fd51c
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-ellipse-4.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty horizontal ellipse, with shape-margin acts like a circle (with some aberration)</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: ellipse(50px 0px at 50px 90px);
+    shape-margin: 90px;
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-ellipse-5.html b/layout/reftests/css-shapes/shape-outside-empty-ellipse-5.html
new file mode 100644
index 0000000000..2ffe426de4
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-ellipse-5.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty vertical ellipse, acts like a line</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: ellipse(0px 100px at 190px 100px);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-ellipse-6.html b/layout/reftests/css-shapes/shape-outside-empty-ellipse-6.html
new file mode 100644
index 0000000000..395cf5d6e0
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-ellipse-6.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty vertical ellipse, with shape-margin acts like a capsule (with rounded endpoints at top and bottom)</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: ellipse(0px 100px at 100px 100px);
+    shape-margin: 90px;
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-ellipse-7.html b/layout/reftests/css-shapes/shape-outside-empty-ellipse-7.html
new file mode 100644
index 0000000000..61933786ef
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-ellipse-7.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty point ellipse, positioned between elements, acts like nothing</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: ellipse(0px 0px at 100px 20px);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-ellipse-8.html b/layout/reftests/css-shapes/shape-outside-empty-ellipse-8.html
new file mode 100644
index 0000000000..a6530ec812
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-ellipse-8.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty horizontal ellipse, positioned between elements, acts like nothing</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: ellipse(50px 0px at 50px 20px);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-inset-1.html b/layout/reftests/css-shapes/shape-outside-empty-inset-1.html
new file mode 100644
index 0000000000..907975237c
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-inset-1.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty zero-sized inset, acts like a point</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: inset(50% 50%);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-inset-2.html b/layout/reftests/css-shapes/shape-outside-empty-inset-2.html
new file mode 100644
index 0000000000..c91f29e987
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-inset-2.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty zero-sized inset, with shape-margin acts like a circle</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: inset(50% 50%);
+    shape-margin: 90px;
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-inset-3.html b/layout/reftests/css-shapes/shape-outside-empty-inset-3.html
new file mode 100644
index 0000000000..25aa323587
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-inset-3.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty horizontal flat inset, acts like a point</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: inset(50% 50% 50% 0%);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-inset-4.html b/layout/reftests/css-shapes/shape-outside-empty-inset-4.html
new file mode 100644
index 0000000000..11ce071c35
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-inset-4.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty horizontal flat inset, with shape-margin acts like a circle</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: inset(50% 50% 50% 0%);
+    shape-margin: 90px;
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-inset-5.html b/layout/reftests/css-shapes/shape-outside-empty-inset-5.html
new file mode 100644
index 0000000000..27d562e447
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-inset-5.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty vertical flat inset, acts like a line</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: inset(0% 5% 0% 95%);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-inset-6.html b/layout/reftests/css-shapes/shape-outside-empty-inset-6.html
new file mode 100644
index 0000000000..6f408f740a
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-inset-6.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside inside-out vertical flat inset, acts like a line</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: inset(0% 100% 0% 95%);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-inset-7.html b/layout/reftests/css-shapes/shape-outside-empty-inset-7.html
new file mode 100644
index 0000000000..2b190b6057
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-inset-7.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty zero-sized inset, positioned between elements, acts like nothing</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: inset(20px 100px 160px 100px);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-inset-8.html b/layout/reftests/css-shapes/shape-outside-empty-inset-8.html
new file mode 100644
index 0000000000..8e04ac0de8
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-inset-8.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside empty horizontal inset, positioned between elements, acts like nothing</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: inset(20px 0px 160px 50px);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-line-ref.html b/layout/reftests/css-shapes/shape-outside-empty-line-ref.html
new file mode 100644
index 0000000000..1b7d12ade0
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-line-ref.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Reference: Shape-outside empty area, float text around a vertical line</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+    margin-left: 190px;
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-nothing-ref.html b/layout/reftests/css-shapes/shape-outside-empty-nothing-ref.html
new file mode 100644
index 0000000000..af98b88893
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-nothing-ref.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Reference: Shape-outside empty area, no float impact</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-point-ref.html b/layout/reftests/css-shapes/shape-outside-empty-point-ref.html
new file mode 100644
index 0000000000..8a32a8c430
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-point-ref.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Reference: Shape-outside empty area, float text around a point</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box style="margin-left: 100px"></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-polygon-1.html b/layout/reftests/css-shapes/shape-outside-empty-polygon-1.html
new file mode 100644
index 0000000000..5b52ba6ce7
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-polygon-1.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside polygon with 1 vertex, acts like a point</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: polygon(100px 90px);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-polygon-2.html b/layout/reftests/css-shapes/shape-outside-empty-polygon-2.html
new file mode 100644
index 0000000000..7df4a77ba0
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-polygon-2.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside polygon with 1 vertex, with shape-margin acts like a circle (with some aberration)</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: polygon(100px 90px);
+    shape-margin: 90px;
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-polygon-3.html b/layout/reftests/css-shapes/shape-outside-empty-polygon-3.html
new file mode 100644
index 0000000000..c1b56c884d
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-polygon-3.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside polygon with 2 vertices, acts like a line</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: polygon(190px 0px, 190px 200px);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-polygon-4.html b/layout/reftests/css-shapes/shape-outside-empty-polygon-4.html
new file mode 100644
index 0000000000..6a0f6f988b
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-polygon-4.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside polygon with 2 vertices, with shape-margin acts like a line with rounded endpoints</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: polygon(100px 0px, 100px 200px);
+    shape-margin: 90px;
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-polygon-5.html b/layout/reftests/css-shapes/shape-outside-empty-polygon-5.html
new file mode 100644
index 0000000000..3d3f064f9c
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-polygon-5.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside polygon with 3 coincident vertices, acts like a point</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: polygon(100px 90px, 100px 90px, 100px 90px);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-polygon-6.html b/layout/reftests/css-shapes/shape-outside-empty-polygon-6.html
new file mode 100644
index 0000000000..3239f72ddb
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-polygon-6.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside polygon with 1 vertex, positioned between elements, acts like nothing</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: polygon(100px 20px);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/css-shapes/shape-outside-empty-polygon-7.html b/layout/reftests/css-shapes/shape-outside-empty-polygon-7.html
new file mode 100644
index 0000000000..59cb4a97b3
--- /dev/null
+++ b/layout/reftests/css-shapes/shape-outside-empty-polygon-7.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>Shape-outside polygon with 2 vertices, positioned between elements, acts like nothing</title>
+<style>
+  body {
+    line-height: 0;
+  }
+  .container {
+    width: 600px;
+  }
+  box {
+    display: inline-block;
+    background-color: blue;
+    width: 100px;
+    height: 20px;
+  }
+  .shape {
+    float: left;
+    width: 200px;
+    height: 180px;
+    shape-outside: polygon(0px 20px, 100px 20px);
+  }
+</style>
+</head>
+<body>
+<div class="container">
+<div class="shape"></div>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+<box></box><br>
+</div>
+</body>
+</html>
-- 
cgit v1.2.3