From 43a97878ce14b72f0981164f87f2e35e14151312 Mon Sep 17 00:00:00 2001
From: Daniel Baumann <daniel.baumann@progress-linux.org>
Date: Sun, 7 Apr 2024 11:22:09 +0200
Subject: Adding upstream version 110.0.1.

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
---
 .../shaping/reference/shaping-000-ref.html         | 21 ++++++++++++
 .../shaping/reference/shaping-000-sanity-ref.html  | 20 +++++++++++
 .../shaping/reference/shaping-001-ref.html         | 23 +++++++++++++
 .../shaping/reference/shaping-001-sanity-ref.html  | 22 ++++++++++++
 .../shaping/reference/shaping-002-ref.html         | 23 +++++++++++++
 .../shaping/reference/shaping-002-sanity-ref.html  | 22 ++++++++++++
 .../shaping/reference/shaping-003-ref.html         | 23 +++++++++++++
 .../shaping/reference/shaping-003-sanity-ref.html  | 22 ++++++++++++
 .../shaping/reference/shaping-008-ref.html         | 23 +++++++++++++
 .../shaping/reference/shaping-008-sanity-ref.html  | 24 +++++++++++++
 .../shaping/reference/shaping-009-ref.html         | 23 +++++++++++++
 .../shaping/reference/shaping-009-sanity-ref.html  | 22 ++++++++++++
 .../shaping/reference/shaping-010-ref.html         | 23 +++++++++++++
 .../shaping/reference/shaping-010-sanity-ref.html  | 22 ++++++++++++
 .../shaping/reference/shaping-011-ref.html         | 23 +++++++++++++
 .../shaping/reference/shaping-011-sanity-ref.html  | 22 ++++++++++++
 .../shaping/reference/shaping-012-ref.html         | 22 ++++++++++++
 .../shaping/reference/shaping-012-sanity-ref.html  | 21 ++++++++++++
 .../shaping/reference/shaping-014-ref.html         | 22 ++++++++++++
 .../shaping/reference/shaping-014-sanity-ref.html  | 21 ++++++++++++
 .../shaping/reference/shaping-016-ref.html         | 23 +++++++++++++
 .../shaping/reference/shaping-016-sanity-ref.html  | 22 ++++++++++++
 .../shaping/reference/shaping-020-ref.html         | 23 +++++++++++++
 .../shaping/reference/shaping-020-sanity-ref.html  | 22 ++++++++++++
 .../shaping/reference/shaping-021-ref.html         | 22 ++++++++++++
 .../shaping/reference/shaping-021-sanity-ref.html  | 21 ++++++++++++
 .../shaping/reference/shaping-022-ref.html         | 24 +++++++++++++
 .../shaping/reference/shaping-022-sanity-ref.html  | 23 +++++++++++++
 .../shaping/reference/shaping-023-ref.html         | 24 +++++++++++++
 .../reference/shaping-023-sanity-2-ref.html        | 22 ++++++++++++
 .../shaping/reference/shaping-023-sanity-ref.html  | 22 ++++++++++++
 .../shaping/reference/shaping-024-ref.html         | 24 +++++++++++++
 .../reference/shaping-024-sanity-2-ref.html        | 22 ++++++++++++
 .../shaping/reference/shaping-024-sanity-ref.html  | 22 ++++++++++++
 .../shaping/reference/shaping-025-ref.html         | 24 +++++++++++++
 .../reference/shaping-025-sanity-2-ref.html        | 22 ++++++++++++
 .../shaping/reference/shaping-025-sanity-ref.html  | 22 ++++++++++++
 .../shaping-arabic-diacritics-001-ref.html         | 25 ++++++++++++++
 .../shaping-arabic-diacritics-002-ref.html         | 28 +++++++++++++++
 .../shaping/reference/shaping_lig-000-ref.html     | 25 ++++++++++++++
 .../shaping/reference/shaping_lig-001-ref.html     | 40 ++++++++++++++++++++++
 .../tests/css/css-text/shaping/shaping-000.html    | 27 +++++++++++++++
 .../tests/css/css-text/shaping/shaping-001.html    | 30 ++++++++++++++++
 .../tests/css/css-text/shaping/shaping-002.html    | 31 +++++++++++++++++
 .../tests/css/css-text/shaping/shaping-003.html    | 31 +++++++++++++++++
 .../tests/css/css-text/shaping/shaping-004.html    | 29 ++++++++++++++++
 .../tests/css/css-text/shaping/shaping-005.html    | 29 ++++++++++++++++
 .../tests/css/css-text/shaping/shaping-006.html    | 31 +++++++++++++++++
 .../tests/css/css-text/shaping/shaping-007.html    | 29 ++++++++++++++++
 .../tests/css/css-text/shaping/shaping-008.html    | 30 ++++++++++++++++
 .../tests/css/css-text/shaping/shaping-009.html    | 29 ++++++++++++++++
 .../tests/css/css-text/shaping/shaping-010.html    | 29 ++++++++++++++++
 .../tests/css/css-text/shaping/shaping-011.html    | 29 ++++++++++++++++
 .../tests/css/css-text/shaping/shaping-012.html    | 29 ++++++++++++++++
 .../tests/css/css-text/shaping/shaping-013.html    | 29 ++++++++++++++++
 .../tests/css/css-text/shaping/shaping-014.html    | 29 ++++++++++++++++
 .../tests/css/css-text/shaping/shaping-016.html    | 29 ++++++++++++++++
 .../tests/css/css-text/shaping/shaping-017.html    | 32 +++++++++++++++++
 .../tests/css/css-text/shaping/shaping-018.html    | 32 +++++++++++++++++
 .../tests/css/css-text/shaping/shaping-020.html    | 31 +++++++++++++++++
 .../tests/css/css-text/shaping/shaping-021.html    | 30 ++++++++++++++++
 .../tests/css/css-text/shaping/shaping-022.html    | 28 +++++++++++++++
 .../tests/css/css-text/shaping/shaping-023.html    | 29 ++++++++++++++++
 .../tests/css/css-text/shaping/shaping-024.html    | 31 +++++++++++++++++
 .../tests/css/css-text/shaping/shaping-025.html    | 30 ++++++++++++++++
 .../shaping/shaping-arabic-diacritics-001.html     | 31 +++++++++++++++++
 .../shaping/shaping-arabic-diacritics-002.html     | 34 ++++++++++++++++++
 .../css/css-text/shaping/shaping_lig-000.html      | 29 ++++++++++++++++
 .../css/css-text/shaping/shaping_lig-001.html      | 31 +++++++++++++++++
 69 files changed, 1784 insertions(+)
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-000-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-000-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-001-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-001-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-002-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-002-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-003-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-003-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-008-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-008-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-009-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-009-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-010-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-010-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-011-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-011-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-012-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-012-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-014-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-014-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-016-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-016-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-020-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-020-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-021-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-021-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-022-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-022-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-023-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-023-sanity-2-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-023-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-024-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-024-sanity-2-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-024-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-025-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-025-sanity-2-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-025-sanity-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-arabic-diacritics-001-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping-arabic-diacritics-002-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping_lig-000-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/reference/shaping_lig-001-ref.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-000.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-001.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-002.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-003.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-004.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-005.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-006.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-007.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-008.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-009.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-010.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-011.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-012.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-013.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-014.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-016.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-017.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-018.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-020.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-021.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-022.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-023.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-024.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-025.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-arabic-diacritics-001.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping-arabic-diacritics-002.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping_lig-000.html
 create mode 100644 testing/web-platform/tests/css/css-text/shaping/shaping_lig-001.html

(limited to 'testing/web-platform/tests/css/css-text/shaping')

diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-000-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-000-ref.html
new file mode 100644
index 0000000000..46312eb7be
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-000-ref.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+</style>
+<link rel=mismatch href="shaping-000-sanity-ref.html">
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+<div class="ref" lang="ar" dir="rtl">ععع</div>
+<div class="ref" lang="ar" dir="rtl">ععع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-000-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-000-sanity-ref.html
new file mode 100644
index 0000000000..af43f98b0c
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-000-sanity-ref.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;ع&zwnj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;ع&zwnj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-001-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-001-ref.html
new file mode 100644
index 0000000000..53a1093ace
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-001-ref.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.text, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.color { color:blue; }
+</style>
+<link rel=mismatch href="shaping-001-sanity-ref.html">
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="color">&zwj;ع&zwj;</span>&zwj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="color">&zwj;ع&zwj;</span>&zwj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-001-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-001-sanity-ref.html
new file mode 100644
index 0000000000..802c65387c
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-001-sanity-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.text, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.color { color:blue; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="color">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="color">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-002-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-002-ref.html
new file mode 100644
index 0000000000..1871724c1d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-002-ref.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+	font-family: 'csstest_noto';
+	src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+	}
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.fontweight { font-weight: bold; }
+</style>
+<link rel=mismatch href="shaping-002-sanity-ref.html">
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="fontweight">&zwj;ع&zwj;</span>&zwj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="fontweight">&zwj;ع&zwj;</span>&zwj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-002-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-002-sanity-ref.html
new file mode 100644
index 0000000000..5cb1200182
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-002-sanity-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+	font-family: 'csstest_noto';
+	src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+	}
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.fontweight { font-weight: bold; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="fontweight">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="fontweight">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-003-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-003-ref.html
new file mode 100644
index 0000000000..734e510af0
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-003-ref.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.fontstyle { font-style: italic; }
+</style>
+<link rel=mismatch href="shaping-003-sanity-ref.html">
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="fontstyle">&zwj;ع&zwj;</span>&zwj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="fontstyle">&zwj;ع&zwj;</span>&zwj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-003-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-003-sanity-ref.html
new file mode 100644
index 0000000000..6ca7f1c2df
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-003-sanity-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.fontstyle { font-style: italic; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="fontstyle">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="fontstyle">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-008-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-008-ref.html
new file mode 100644
index 0000000000..42be6f8220
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-008-ref.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.fontsizeplus { font-size:120%; }
+</style>
+<link rel=mismatch href="shaping-008-sanity-ref.html">
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="fontsizeplus">&zwj;ع&zwj;</span>&zwj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="fontsizeplus">&zwj;ع&zwj;</span>&zwj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-008-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-008-sanity-ref.html
new file mode 100644
index 0000000000..abad0b4f8e
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-008-sanity-ref.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    font-weight: normal;
+    font-style: normal;
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.fontsizeplus { font-size:120%; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="fontsizeplus">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="fontsizeplus">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-009-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-009-ref.html
new file mode 100644
index 0000000000..6ff0985ab9
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-009-ref.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.margin { margin: 0.5em; }
+</style>
+<link rel=mismatch href="shaping-009-sanity-ref.html">
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box DON'T join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="margin">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="margin">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-009-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-009-sanity-ref.html
new file mode 100644
index 0000000000..b5545097a3
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-009-sanity-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.margin { margin: 0.5em; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box DON'T join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="margin">&zwj;ع&zwj;</span>&zwj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="margin">&zwj;ع&zwj;</span>&zwj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-010-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-010-ref.html
new file mode 100644
index 0000000000..18d3325625
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-010-ref.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.padding { padding: 0.5em; }
+</style>
+<link rel=mismatch href="shaping-010-sanity-ref.html">
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box DON'T join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="padding">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="padding">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-010-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-010-sanity-ref.html
new file mode 100644
index 0000000000..b9d951c887
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-010-sanity-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.padding { padding: 0.5em; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box DON'T join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="padding">&zwj;ع&zwj;</span>&zwj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="padding">&zwj;ع&zwj;</span>&zwj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-011-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-011-ref.html
new file mode 100644
index 0000000000..418b641e23
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-011-ref.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.border { border: 1px solid #ccc; }
+</style>
+<link rel=mismatch href="shaping-011-sanity-ref.html">
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box DON'T join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="border">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="border">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-011-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-011-sanity-ref.html
new file mode 100644
index 0000000000..a57aadc301
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-011-sanity-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.border { border: 1px solid #ccc; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box DON'T join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="border">&zwj;ع&zwj;</span>&zwj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="border">&zwj;ع&zwj;</span>&zwj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-012-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-012-ref.html
new file mode 100644
index 0000000000..8a2f7198a2
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-012-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+</style>
+<link rel=mismatch href="shaping-012-sanity-ref.html">
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box DON'T join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;ع&zwnj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;ع&zwnj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-012-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-012-sanity-ref.html
new file mode 100644
index 0000000000..ce2a7ecbe5
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-012-sanity-ref.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box DON'T join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ععع</div>
+<div class="ref" lang="ar" dir="rtl">ععع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-014-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-014-ref.html
new file mode 100644
index 0000000000..6555baf1c7
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-014-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+.styled { text-decoration: underline; text-decoration-skip-ink: none; }
+</style>
+<link rel=mismatch href="shaping-014-sanity-ref.html">
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="styled">&zwj;ع&zwj;</span>&zwj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="styled">&zwj;ع&zwj;</span>&zwj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-014-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-014-sanity-ref.html
new file mode 100644
index 0000000000..c47d28e223
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-014-sanity-ref.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+.styled { text-decoration: underline; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="styled">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="styled">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-016-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-016-ref.html
new file mode 100644
index 0000000000..af931cd3c5
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-016-ref.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.styled { outline: 1px solid blue; }
+</style>
+<link rel=mismatch href="shaping-016-sanity-ref.html">
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="styled">&zwj;ع&zwj;</span>&zwj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="styled">&zwj;ع&zwj;</span>&zwj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-016-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-016-sanity-ref.html
new file mode 100644
index 0000000000..15debe37b9
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-016-sanity-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.styled { outline: 1px solid blue; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="styled">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="styled">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-020-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-020-ref.html
new file mode 100644
index 0000000000..b5c4d4dcbc
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-020-ref.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansNko-regular-webfont.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.styled { color:blue; }
+</style>
+<link rel="mismatch" href="shaping-020-sanity-ref.html">
+</head>
+<body>
+<p class="instructions">Test passes if the three N'Ko characters in each box join, making the two boxes identical.</p>
+
+<div class="ref" lang="nqo" dir="rtl">ߞ&zwj;<span class="styled">&zwj;ߞ&zwj;</span>&zwj;ߞ</div>
+<div class="ref" lang="nqo" dir="rtl">ߞ&zwj;<span class="styled">&zwj;ߞ&zwj;</span>&zwj;ߞ</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-020-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-020-sanity-ref.html
new file mode 100644
index 0000000000..da3a1469be
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-020-sanity-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansNko-regular-webfont.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.styled { color:blue; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three N'Ko characters in each box join, making the two boxes identical.</p>
+
+<div class="ref" lang="nqo" dir="rtl">ߞ&zwnj;<span class="styled">&zwnj;ߞ&zwnj;</span>&zwnj;ߞ</div>
+<div class="ref" lang="nqo" dir="rtl">ߞ&zwnj;<span class="styled">&zwnj;ߞ&zwnj;</span>&zwnj;ߞ</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-021-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-021-ref.html
new file mode 100644
index 0000000000..c4e63eff6f
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-021-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansNko-regular-webfont.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.styled { font-style:italic; }
+</style>
+<link rel="mismatch" href="shaping-021-sanity-ref.html">
+</head>
+<body>
+<p class="instructions">Test passes if the three N'Ko characters in each box join, making the two boxes identical.</p>
+<div class="ref" lang="nqo" dir="rtl">ߞ&zwj;<span class="styled">&zwj;ߞ&zwj;</span>&zwj;ߞ</div>
+<div class="ref" lang="nqo" dir="rtl">ߞ&zwj;<span class="styled">&zwj;ߞ&zwj;</span>&zwj;ߞ</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-021-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-021-sanity-ref.html
new file mode 100644
index 0000000000..103e38e6c6
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-021-sanity-ref.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansNko-regular-webfont.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.styled { font-style:italic; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three N'Ko characters in each box join, making the two boxes identical.</p>
+<div class="ref" lang="nqo" dir="rtl">ߞ&zwnj;<span class="styled">&zwnj;ߞ&zwnj;</span>&zwnj;ߞ</div>
+<div class="ref" lang="nqo" dir="rtl">ߞ&zwnj;<span class="styled">&zwnj;ߞ&zwnj;</span>&zwnj;ߞ</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-022-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-022-ref.html
new file mode 100644
index 0000000000..6db719d2c1
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-022-ref.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansNko-regular-webfont.woff2') format('woff2');
+    font-weight: normal;
+    font-style: normal;
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.styled { text-decoration: underline; }
+</style>
+<link rel="mismatch" href="shaping-022-sanity-ref.html">
+</head>
+<body>
+<p class="instructions">Test passes if the three N'Ko characters in each box join, making the two boxes identical.</p>
+<div class="ref" lang="nqo" dir="rtl">ߞ&zwj;<span class="styled">&zwj;ߞ&zwj;</span>&zwj;ߞ</div>
+<div class="ref" lang="nqo" dir="rtl">ߞ&zwj;<span class="styled">&zwj;ߞ&zwj;</span>&zwj;ߞ</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-022-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-022-sanity-ref.html
new file mode 100644
index 0000000000..fe28ab3a57
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-022-sanity-ref.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansNko-regular-webfont.woff2') format('woff2');
+    font-weight: normal;
+    font-style: normal;
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.styled { text-decoration: underline; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three N'Ko characters in each box join, making the two boxes identical.</p>
+<div class="ref" lang="nqo" dir="rtl">ߞ&zwnj;<span class="styled">&zwnj;ߞ&zwnj;</span>&zwnj;ߞ</div>
+<div class="ref" lang="nqo" dir="rtl">ߞ&zwnj;<span class="styled">&zwnj;ߞ&zwnj;</span>&zwnj;ߞ</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-023-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-023-ref.html
new file mode 100644
index 0000000000..35e6b75b4a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-023-ref.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="mismatch" href="shaping-023-sanity-ref.html">
+<link rel="mismatch" href="shaping-023-sanity-2-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansMongolian-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; writing-mode: vertical-lr; float:left; }
+/* the CSS above is not part of the test */
+.styled { color:blue; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Mongolian characters in each box join, making the two boxes identical.</p>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwj;<span class="styled">&zwj;ᠨ&zwj;</span>&zwj;ᠨ</div>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwj;<span class="styled">&zwj;ᠨ&zwj;</span>&zwj;ᠨ</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-023-sanity-2-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-023-sanity-2-ref.html
new file mode 100644
index 0000000000..cbde30c641
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-023-sanity-2-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansMongolian-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; writing-mode: vertical-lr; float:left; text-orientation: upright;}
+/* the CSS above is not part of the test */
+.styled { color:blue; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Mongolian characters in each box join, making the two boxes identical.</p>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwnj;<span class="styled">&zwnj;ᠨ&zwnj;</span>&zwnj;ᠨ</div>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwnj;<span class="styled">&zwnj;ᠨ&zwnj;</span>&zwnj;ᠨ</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-023-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-023-sanity-ref.html
new file mode 100644
index 0000000000..966579be1c
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-023-sanity-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansMongolian-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; writing-mode: vertical-lr; float:left; }
+/* the CSS above is not part of the test */
+.styled { color:blue; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Mongolian characters in each box join, making the two boxes identical.</p>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwnj;<span class="styled">&zwnj;ᠨ&zwnj;</span>&zwnj;ᠨ</div>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwnj;<span class="styled">&zwnj;ᠨ&zwnj;</span>&zwnj;ᠨ</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-024-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-024-ref.html
new file mode 100644
index 0000000000..7f6cbf97a0
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-024-ref.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="mismatch" href="shaping-024-sanity-ref.html">
+<link rel="mismatch" href="shaping-024-sanity-2-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansMongolian-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; writing-mode: vertical-lr; }
+/* the CSS above is not part of the test */
+.styled { font-style:italic; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Mongolian characters in each box join, making the two boxes identical.</p>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwj;<span class="styled">&zwj;ᠨ&zwj;</span>&zwj;ᠨ</div>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwj;<span class="styled">&zwj;ᠨ&zwj;</span>&zwj;ᠨ</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-024-sanity-2-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-024-sanity-2-ref.html
new file mode 100644
index 0000000000..657478d9c7
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-024-sanity-2-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansMongolian-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; writing-mode: vertical-lr; float:left; text-orientation: upright;}
+/* the CSS above is not part of the test */
+.styled { font-style:italic; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Mongolian characters in each box join, making the two boxes identical.</p>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwnj;<span class="styled">&zwnj;ᠨ&zwnj;</span>&zwnj;ᠨ</div>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwnj;<span class="styled">&zwnj;ᠨ&zwnj;</span>&zwnj;ᠨ</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-024-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-024-sanity-ref.html
new file mode 100644
index 0000000000..fe89eecf68
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-024-sanity-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansMongolian-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; writing-mode: vertical-lr; float:left; }
+/* the CSS above is not part of the test */
+.styled { font-style:italic; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Mongolian characters in each box join, making the two boxes identical.</p>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwnj;<span class="styled">&zwnj;ᠨ&zwnj;</span>&zwnj;ᠨ</div>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwnj;<span class="styled">&zwnj;ᠨ&zwnj;</span>&zwnj;ᠨ</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-025-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-025-ref.html
new file mode 100644
index 0000000000..0418c263eb
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-025-ref.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="mismatch" href="shaping-025-sanity-ref.html">
+<link rel="mismatch" href="shaping-025-sanity-2-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansMongolian-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; writing-mode: vertical-lr; }
+/* the CSS above is not part of the test */
+.styled { text-decoration:underline; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Mongolian characters in each box join, making the two boxes identical.</p>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwj;<span class="styled">&zwj;ᠨ&zwj;</span>&zwj;ᠨ</div>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwj;<span class="styled">&zwj;ᠨ&zwj;</span>&zwj;ᠨ</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-025-sanity-2-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-025-sanity-2-ref.html
new file mode 100644
index 0000000000..95e0ba2172
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-025-sanity-2-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansMongolian-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; writing-mode: vertical-lr; float:left; text-orientation: upright;}
+/* the CSS above is not part of the test */
+.styled { text-decoration:underline; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Mongolian characters in each box join, making the two boxes identical.</p>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwnj;<span class="styled">&zwnj;ᠨ&zwnj;</span>&zwnj;ᠨ</div>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwnj;<span class="styled">&zwnj;ᠨ&zwnj;</span>&zwnj;ᠨ</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-025-sanity-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-025-sanity-ref.html
new file mode 100644
index 0000000000..a75dd158d4
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-025-sanity-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>reference</title>
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansMongolian-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; writing-mode: vertical-lr; float:left; }
+/* the CSS above is not part of the test */
+.styled { text-decoration:underline; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Mongolian characters in each box join, making the two boxes identical.</p>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwnj;<span class="styled">&zwnj;ᠨ&zwnj;</span>&zwnj;ᠨ</div>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwnj;<span class="styled">&zwnj;ᠨ&zwnj;</span>&zwnj;ᠨ</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-arabic-diacritics-001-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-arabic-diacritics-001-ref.html
new file mode 100644
index 0000000000..f1b3ee100d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-arabic-diacritics-001-ref.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<title>shaping: Arabic diacritics on NBSP - reference</title>
+<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
+<style type="text/css">
+@font-face {
+    font-family: ArabicTest;
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+}
+.test {
+    font: 120px/2 ArabicTest, sans-serif;
+}
+</style>
+</head>
+<body>
+    <p class="instructions">Test passes if the two lines are rendered identically,
+        with the superscript alef (&#x627;) directly above the raised hamza (&#x621;).</p>
+    <!-- Order of lines is reversed from the testcase; if they render identically
+         they should still match perfectly. -->
+    <div class=test>a<span dir=rtl>&nbsp;&#x670;&#x654;</span>z</div>
+    <div class=test>a<span dir=rtl>&nbsp;&#x654;&#x670;</span>z</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping-arabic-diacritics-002-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-arabic-diacritics-002-ref.html
new file mode 100644
index 0000000000..d145e72ed8
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping-arabic-diacritics-002-ref.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<title>shaping: Arabic diacritics on NBSP - reference</title>
+<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
+<style type="text/css">
+@font-face {
+    font-family: ArabicTest;
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+}
+.test {
+    font: 120px/2 ArabicTest, sans-serif;
+}
+.test span {
+    padding: .1em .05em 0;
+    background: black;
+}
+</style>
+</head>
+<body>
+    <p class="instructions">Test passes if the Arabic diacritics are entirely hidden by the black boxes.</p>
+    <!-- Diacritics removed from the test lines, as they should have been completely obscured
+         by the black background anyhow. -->
+    <div class=test>a<span dir=rtl>&nbsp;</span>z</div>
+    <div class=test>a<span dir=rtl>&nbsp;</span>z</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping_lig-000-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping_lig-000-ref.html
new file mode 100644
index 0000000000..7b92b83625
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping_lig-000-ref.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>ligatures: span</title>
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    font-weight: normal;
+    font-style: normal;
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters join.</p>
+<div class="ref" lang="ar" dir="rtl">علا</div>
+<div class="ref" lang="ar" dir="rtl">علا</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
\ No newline at end of file
diff --git a/testing/web-platform/tests/css/css-text/shaping/reference/shaping_lig-001-ref.html b/testing/web-platform/tests/css/css-text/shaping/reference/shaping_lig-001-ref.html
new file mode 100644
index 0000000000..df71a1d019
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/reference/shaping_lig-001-ref.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: test for Chromium bug 1304876</title>
+<style type="text/css">
+@font-face {
+    font-family: GentiumPlus;
+    src: url('/fonts/GentiumPlus-R.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+}
+.test {
+    font-family: GentiumPlus;
+    font-size: 18pt;
+    width: 300px;
+    border: 1px solid black;
+    margin: 1em;
+}
+.line {
+    display: block;
+    white-space: nowrap;
+}
+/* the CSS above is not part of the test */
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the word "office" is rendered without repeated letters.</p>
+<div class="test">
+    <div class="line">Sanitary measures in the</div>
+    <div class="line">office ought be adequately</div>
+    <div class="line"><b>maintained</b>.</div>
+</div>
+<div class="test">
+    <div class="line">Sanitary measures in the</div>
+    <div class="line">office ought be adequately</div>
+    <div class="line"><b>maintained</b>.</div>
+</div>
+</body>
+</html>
\ No newline at end of file
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-000.html b/testing/web-platform/tests/css/css-text/shaping/shaping-000.html
new file mode 100644
index 0000000000..cd682ac733
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-000.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: span</title>
+<meta name="assert" content="Shaping must not be broken across inline box boundaries with no styling change.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-000-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+<div class="test" lang="ar" dir="rtl">ع<span>ع</span>ع</div>
+<div class="ref" lang="ar" dir="rtl">ععع</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-001.html b/testing/web-platform/tests/css/css-text/shaping/shaping-001.html
new file mode 100644
index 0000000000..2068aab769
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-001.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: colour</title>
+<meta name="assert" content="Arabic shaping should not be broken across inline box boundaries for changes to colour.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-001-ref.html">
+<meta name="flags" content="should">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.color { color:blue; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<span class="color">ع</span>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="color">&zwj;ع&zwj;</span>&zwj;ع</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-002.html b/testing/web-platform/tests/css/css-text/shaping/shaping-002.html
new file mode 100644
index 0000000000..282e7d186d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-002.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: font-weight</title>
+<meta name="assert" content="Arabic shaping should not be broken across inline box boundaries for changes in font weight.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-002-ref.html">
+<meta name="flags" content="should">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    font-weight: normal;
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.fontweight { font-weight: bold; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<span class="fontweight">ع</span>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="fontweight">&zwj;ع&zwj;</span>&zwj;ع</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-003.html b/testing/web-platform/tests/css/css-text/shaping/shaping-003.html
new file mode 100644
index 0000000000..58602316f4
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-003.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: font-style</title>
+<meta name="assert" content="Arabic shaping should not be broken across inline box boundaries for changes in font style.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-003-ref.html">
+<meta name="flags" content="should">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    font-style: normal;
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.fontstyle { font-style: italic; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<span class="fontstyle">ع</span>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="fontstyle">&zwj;ع&zwj;</span>&zwj;ع</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-004.html b/testing/web-platform/tests/css/css-text/shaping/shaping-004.html
new file mode 100644
index 0000000000..4eaa25ad4d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-004.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: margin 0</title>
+<meta name="assert" content="Shaping must not be broken across inline box boundaries when margin is set to 0.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-000-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.margin { margin:0; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<span class="margin">ع</span>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="margin">&zwj;ع&zwj;</span>&zwj;ع</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-005.html b/testing/web-platform/tests/css/css-text/shaping/shaping-005.html
new file mode 100644
index 0000000000..809ea2f41c
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-005.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: padding 0</title>
+<meta name="assert" content="Shaping must not be broken across inline box boundaries when padding is set to 0.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-000-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.padding { padding:0; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<span class="padding">ع</span>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="padding">&zwj;ع&zwj;</span>&zwj;ع</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-006.html b/testing/web-platform/tests/css/css-text/shaping/shaping-006.html
new file mode 100644
index 0000000000..21a13c0487
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-006.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: border 0</title>
+<meta name="assert" content="Shaping must not be broken across inline box boundaries when border is set to 0.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-000-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.margin { margin:0; }
+.padding { padding:0; }
+.border { border:0; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<span class="border">ع</span>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="border">&zwj;ع&zwj;</span>&zwj;ع</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-007.html b/testing/web-platform/tests/css/css-text/shaping/shaping-007.html
new file mode 100644
index 0000000000..a4f3dc10ee
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-007.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: font size 100%</title>
+<meta name="assert" content="Shaping must not be broken across inline box boundaries when font-size is set to 100%.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-000-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.fontsize { font-size:100%; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<span class="fontsize">ع</span>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="fontsize">&zwj;ع&zwj;</span>&zwj;ع</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-008.html b/testing/web-platform/tests/css/css-text/shaping/shaping-008.html
new file mode 100644
index 0000000000..509645b349
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-008.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: font size 120%</title>
+<meta name="assert" content="Arabic shaping should not be broken across inline box boundaries for changes to font-size.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-008-ref.html">
+<meta name="flags" content="should">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.fontsizeplus { font-size:120%; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<span class="fontsizeplus">ع</span>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="fontsizeplus">&zwj;ع&zwj;</span>&zwj;ع</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-009.html b/testing/web-platform/tests/css/css-text/shaping/shaping-009.html
new file mode 100644
index 0000000000..4d1d1f7c97
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-009.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: margin &gt; 0</title>
+<meta name="assert" content="Shaping MUST be broken across inline box boundaries when marginis set to a non-zero value.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-009-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.margin { margin: 0.5em; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box DON'T join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<span class="margin">ع</span>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="margin">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-010.html b/testing/web-platform/tests/css/css-text/shaping/shaping-010.html
new file mode 100644
index 0000000000..cd318542bb
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-010.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: padding &gt; 0</title>
+<meta name="assert" content="Shaping MUST be broken across inline box boundaries when padding is set to a non-zero value.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-010-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.padding { padding: 0.5em; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box DON'T join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<span class="padding">ع</span>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="padding">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-011.html b/testing/web-platform/tests/css/css-text/shaping/shaping-011.html
new file mode 100644
index 0000000000..64b464e80b
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-011.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: border &gt; 0</title>
+<meta name="assert" content="Shaping MUST be broken across inline box boundaries when border is set to a non-zero value.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-011-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.border { border: 1px solid #ccc; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box DON'T join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<span class="border">ع</span>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<span class="border">&zwnj;ع&zwnj;</span>&zwnj;ع</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-012.html b/testing/web-platform/tests/css/css-text/shaping/shaping-012.html
new file mode 100644
index 0000000000..6ae3a9ba2b
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-012.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: isolation, bdi</title>
+<meta name="assert" content="Shaping MUST be broken across inline box boundaries when isolation occurs.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-012-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box DON'T join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<bdi>ع</bdi>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;<bdi>&zwnj;ع&zwnj;</bdi>&zwnj;ع</div>
+<!-- Notes:
+This test only works if bdi is supported by the browser.
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-013.html b/testing/web-platform/tests/css/css-text/shaping/shaping-013.html
new file mode 100644
index 0000000000..e9b3359e78
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-013.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: isolation, auto</title>
+<meta name="assert" content="Shaping MUST be broken across inline box boundaries when isolation occurs.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-012-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box DON'T join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<span dir="auto">ع</span>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwnj;ع&zwnj;ع</div>
+<!-- Notes:
+This test only works if dir=auto is supported by the browser.
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-014.html b/testing/web-platform/tests/css/css-text/shaping/shaping-014.html
new file mode 100644
index 0000000000..b817f2c094
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-014.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: text-decoration</title>
+<meta name="assert" content="Shaping must not be broken across inline box boundaries for changes in text-decoration.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-014-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.styled { text-decoration: underline; text-decoration-skip-ink: none; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<span class="styled">ع</span>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="styled">&zwj;ع&zwj;</span>&zwj;ع</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-016.html b/testing/web-platform/tests/css/css-text/shaping/shaping-016.html
new file mode 100644
index 0000000000..b180056510
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-016.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: outline</title>
+<meta name="assert" content="Shaping must not be broken across inline box boundaries for changes in outline.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-016-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.styled { outline: 1px solid blue; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<span class="styled">ع</span>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="styled">&zwj;ع&zwj;</span>&zwj;ع</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-017.html b/testing/web-platform/tests/css/css-text/shaping/shaping-017.html
new file mode 100644
index 0000000000..e4dc68a126
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-017.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: em element</title>
+<meta name="assert" content="Arabic shaping should not be broken across inline box boundaries for the em element.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-003-ref.html">
+<meta name="flags" content="should">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    font-style: normal;
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.styled { font-style: italic; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<em>ع</em>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="styled">&zwj;ع&zwj;</span>&zwj;ع</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+It also assumes that the default rendering for the em element is italic.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-018.html b/testing/web-platform/tests/css/css-text/shaping/shaping-018.html
new file mode 100644
index 0000000000..fc44d6e640
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-018.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: b element</title>
+<meta name="assert" content="Arabic shaping should not be broken across inline box boundaries for the b element.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-002-ref.html">
+<meta name="flags" content="should">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    font-weight: normal;
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.styled { font-weight: bold; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters in each box join, making the two boxes identical.</p>
+
+<div class="test" lang="ar" dir="rtl">ع<b>ع</b>ع</div>
+<div class="ref" lang="ar" dir="rtl">ع&zwj;<span class="styled">&zwj;ع&zwj;</span>&zwj;ع</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+It also assumes that the default rendering for the b element is bold.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-020.html b/testing/web-platform/tests/css/css-text/shaping/shaping-020.html
new file mode 100644
index 0000000000..a88b339e34
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-020.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>n'ko, colour</title>
+<meta name="assert" content="Shaping should not be broken across inline box boundaries for changes to colour in N'Ko.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="help" href="http://www.unicode.org/versions/Unicode12.0.0/ch19.pdf">
+<link rel="match" href="reference/shaping-020-ref.html">
+<meta name="flags" content="should">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansNko-regular-webfont.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.styled { color:blue; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three N'Ko characters in each box join, making the two boxes identical.</p>
+
+<div class="test" lang="nqo" dir="rtl">ߞ<span class="styled">ߞ</span>ߞ</div>
+<div class="ref" lang="nqo" dir="rtl">ߞ&zwj;<span class="styled">&zwj;ߞ&zwj;</span>&zwj;ߞ</div>
+<!-- Notes:
+This test uses the Noto Sans N'Ko font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-021.html b/testing/web-platform/tests/css/css-text/shaping/shaping-021.html
new file mode 100644
index 0000000000..b94a39e4db
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-021.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>n'ko, font-style</title>
+<meta name="assert" content="Shaping should not be broken across inline box boundaries for changes to font-style in N'Ko.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-021-ref.html">
+<meta name="flags" content="should">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansNko-regular-webfont.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.styled { font-style:italic; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three N'Ko characters in each box join, making the two boxes identical.</p>
+
+<div class="test" lang="nqo" dir="rtl">ߞ<span class="styled">ߞ</span>ߞ</div>
+<div class="ref" lang="nqo" dir="rtl">ߞ&zwj;<span class="styled">&zwj;ߞ&zwj;</span>&zwj;ߞ</div>
+<!-- Notes:
+This test uses the Noto Sans N'Ko font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-022.html b/testing/web-platform/tests/css/css-text/shaping/shaping-022.html
new file mode 100644
index 0000000000..131b23253f
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-022.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>n'ko, text-decoration</title>
+<meta name="assert" content="Shaping must not be broken across inline box boundaries for changes to text-decoration in N'Ko.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-022-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansNko-regular-webfont.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+.styled { text-decoration: underline; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three N'Ko characters in each box join, making the two boxes identical.</p>
+<div class="test" lang="nqo" dir="rtl">ߞ<span class="styled">ߞ</span>ߞ</div>
+<div class="ref" lang="nqo" dir="rtl">ߞ&zwj;<span class="styled">&zwj;ߞ&zwj;</span>&zwj;ߞ</div>
+<!-- Notes:
+This test uses the Noto Sans N'Ko font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-023.html b/testing/web-platform/tests/css/css-text/shaping/shaping-023.html
new file mode 100644
index 0000000000..67009d57a7
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-023.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>mongolian, colour</title>
+<meta name="assert" content="Shaping should not be broken across inline box boundaries for changes to colour in Mongolian.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-023-ref.html">
+<meta name="flags" content="should">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansMongolian-regular.woff2') format('woff2');
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; writing-mode: vertical-lr; float:left; }
+/* the CSS above is not part of the test */
+.styled { color:blue; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Mongolian characters in each box join, making the two boxes identical.</p>
+<div class="test" lang="mn" dir="rtl">ᠨ<span class="styled">ᠨ</span>ᠨ</div>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwj;<span class="styled">&zwj;ᠨ&zwj;</span>&zwj;ᠨ</div>
+<!-- Notes:
+This test uses the Noto Sans Mongolian font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-024.html b/testing/web-platform/tests/css/css-text/shaping/shaping-024.html
new file mode 100644
index 0000000000..3ab2bbe951
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-024.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>mongolian, font-style</title>
+<meta name="assert" content="Shaping should not be broken across inline box boundaries for changes to font-style in Mongolian.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-024-ref.html">
+<meta name="flags" content="should">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansMongolian-regular.woff2') format('woff2');
+    font-weight: normal;
+    font-style: normal;
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; writing-mode: vertical-lr; }
+/* the CSS above is not part of the test */
+.styled { font-style:italic; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Mongolian characters in each box join, making the two boxes identical.</p>
+<div class="test" lang="mn" dir="rtl">ᠨ<span class="styled">ᠨ</span>ᠨ</div>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwj;<span class="styled">&zwj;ᠨ&zwj;</span>&zwj;ᠨ</div>
+<!-- Notes:
+This test uses the Noto Sans Mongolian font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-025.html b/testing/web-platform/tests/css/css-text/shaping/shaping-025.html
new file mode 100644
index 0000000000..c888784cd4
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-025.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>mongolian, text-decoration</title>
+<meta name="assert" content="Shaping should not be broken across inline box boundaries for changes to text-decoration in Mongolian.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping-025-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoSansMongolian-regular.woff2') format('woff2');
+    font-weight: normal;
+    font-style: normal;
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; writing-mode: vertical-lr; }
+/* the CSS above is not part of the test */
+.styled { text-decoration:underline; }
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Mongolian characters in each box join, making the two boxes identical.</p>
+<div class="test" lang="mn" dir="rtl">ᠨ<span class="styled">ᠨ</span>ᠨ</div>
+<div class="ref" lang="mn" dir="rtl">ᠨ&zwj;<span class="styled">&zwj;ᠨ&zwj;</span>&zwj;ᠨ</div>
+<!-- Notes:
+This test uses the Noto Sans Mongolian font to control variables related to font choice.
+-->
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-arabic-diacritics-001.html b/testing/web-platform/tests/css/css-text/shaping/shaping-arabic-diacritics-001.html
new file mode 100644
index 0000000000..28f9a1e03d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-arabic-diacritics-001.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<title>shaping: Arabic diacritics on NBSP</title>
+<meta name="assert" content="Shaping must work for diacritics rendered on NBSP as base">
+<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
+<link rel="help" href="https://www.unicode.org/versions/Unicode13.0.0/ch02.pdf">
+<link rel="help" href="https://www.unicode.org/reports/tr53/">
+<link rel="match" href="reference/shaping-arabic-diacritics-001-ref.html">
+<meta name="fuzzy" content="maxDifference=0-1; totalPixels=0-2">
+<style type="text/css">
+@font-face {
+    font-family: ArabicTest;
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+}
+.test {
+    font: 120px/2 ArabicTest, sans-serif;
+}
+</style>
+</head>
+<body>
+    <p class="instructions">Test passes if the two lines are rendered identically,
+        with the superscript alef (&#x627;) directly above the raised hamza (&#x621;).</p>
+    <!-- The Arabic characters here are ARABIC HAMZA ABOVE and ARABIC LETTER
+         SUPERSCRIPT ALEF, and according to UTR53 should always be sorted
+         as <hamza,alef> for rendering regardless of underlying order. -->
+    <div class=test>a<span dir=rtl>&nbsp;&#x654;&#x670;</span>z</div>
+    <div class=test>a<span dir=rtl>&nbsp;&#x670;&#x654;</span>z</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping-arabic-diacritics-002.html b/testing/web-platform/tests/css/css-text/shaping/shaping-arabic-diacritics-002.html
new file mode 100644
index 0000000000..ec252ef5ea
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping-arabic-diacritics-002.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<title>shaping: Arabic diacritics on NBSP</title>
+<meta name="assert" content="Shaping must work for diacritics rendered on NBSP as base">
+<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
+<link rel="help" href="https://www.unicode.org/versions/Unicode13.0.0/ch02.pdf">
+<link rel="help" href="https://www.unicode.org/reports/tr53/">
+<link rel="match" href="reference/shaping-arabic-diacritics-002-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: ArabicTest;
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+}
+.test {
+    font: 120px/2 ArabicTest, sans-serif;
+}
+.test span {
+    padding: .1em .05em 0;
+    background: black;
+}
+</style>
+</head>
+<body>
+    <p class="instructions">Test passes if the Arabic diacritics are entirely hidden by the black boxes.</p>
+    <!-- The Arabic characters here are ARABIC HAMZA ABOVE and ARABIC LETTER
+         SUPERSCRIPT ALEF, and (using the NotoNaskhArabic font) they should both
+         be entirely within the (padded) width of the NBSP, if they are properly
+         positioned (regardless of their order). -->
+    <div class=test>a<span dir=rtl>&nbsp;&#x654;&#x670;</span>z</div>
+    <div class=test>a<span dir=rtl>&nbsp;&#x670;&#x654;</span>z</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping_lig-000.html b/testing/web-platform/tests/css/css-text/shaping/shaping_lig-000.html
new file mode 100644
index 0000000000..6b91835059
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping_lig-000.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html  lang="en" >
+<head>
+<meta charset="utf-8">
+<title>ligatures: span</title>
+<meta name="assert" content="Markup inside a ligature with no styling will NOT break joining behaviour.">
+<link rel="author" title="Richard Ishida" href="mailto:ishida@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-text/#boundary-shaping">
+<link rel="match" href="reference/shaping_lig-000-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: 'csstest_noto';
+    src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
+    font-weight: normal;
+    font-style: normal;
+    }
+.test, .ref { border: 1px solid #02D7F6;  margin: 20px;  padding: 10px; width: 3em; font-size: 120px; font-family: "csstest_noto"; }
+/* the CSS above is not part of the test */
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the three Arabic characters join.</p>
+<div class="test" lang="ar" dir="rtl">ع<span>ل</span>ا</div>
+<div class="ref" lang="ar" dir="rtl">علا</div>
+<!-- Notes:
+This test uses the Noto Naskh Arabic font to control variables related to font choice.
+-->
+</body>
+</html>
\ No newline at end of file
diff --git a/testing/web-platform/tests/css/css-text/shaping/shaping_lig-001.html b/testing/web-platform/tests/css/css-text/shaping/shaping_lig-001.html
new file mode 100644
index 0000000000..059b8df724
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/shaping/shaping_lig-001.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html lang="en" >
+<head>
+<meta charset="utf-8">
+<title>shaping: test for Chromium bug 1304876</title>
+<link rel="author" title="Andreu Botella" href="mailto:abotella@igalia.com">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1304876">
+<link rel="match" href="reference/shaping_lig-001-ref.html">
+<style type="text/css">
+@font-face {
+    font-family: GentiumPlus;
+    src: url('/fonts/GentiumPlus-R.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+}
+.test {
+    font-family: GentiumPlus;
+    font-size: 18pt;
+    width: 300px;
+    border: 1px solid black;
+    margin: 1em;
+}
+/* the CSS above is not part of the test */
+</style>
+</head>
+<body>
+<p class="instructions">Test passes if the word "office" is rendered without repeated letters.</p>
+<div class="test">Sanitary measures in the office ought be adequately <b>maintained</b>.</div>
+<div class="test">Sanitary measures in the<br>office ought be adequately <b>maintained</b>.</div>
+</body>
+</html>
\ No newline at end of file
-- 
cgit v1.2.3