Adding upstream version 110.0.1.upstream/110.0.1 upstream

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
author: Daniel Baumann <daniel.baumann@progress-linux.org> 2024-04-07 09:22:09 +0000
committer: Daniel Baumann <daniel.baumann@progress-linux.org> 2024-04-07 09:22:09 +0000
commit: 43a97878ce14b72f0981164f87f2e35e14151312 (patch)
tree: 620249daf56c0258faa40cbdcf9cfba06de2a846 /testing/web-platform/tests/editing/run
parent: Initial commit. (diff)
download: firefox-upstream.tar.xz
firefox-upstream.zip
42 files changed, 2596 insertions, 0 deletions
diff --git a/testing/web-platform/tests/editing/run/backcolor.html b/testing/web-platform/tests/editing/run/backcolor.html
new file mode 100644
index 0000000000..5911de309d
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/backcolor.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>backcolor - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/backcolor.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (false) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/bold.html b/testing/web-platform/tests/editing/run/bold.html
new file mode 100644
index 0000000000..390d6810d8
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/bold.html
@@ -0,0 +1,57 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-3000">
+<meta name="variant" content="?3001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>bold - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/bold.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/caret-navigation-after-removing-line-break.html b/testing/web-platform/tests/editing/run/caret-navigation-after-removing-line-break.html
new file mode 100644
index 0000000000..9855c3b9dc
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/caret-navigation-after-removing-line-break.html
@@ -0,0 +1,78 @@
+<!DOCTYPE HTML>
+<style>
+    .wrap span {
+        white-space: pre-wrap;
+    }
+</style>
+<div class="wrap">
+    <span id="initial" contenteditable="true"> abcd </span>111<span id="before" contenteditable="true"> efgh </span>222<br><span id="after" contenteditable="true"> ijkl </span>333<span id="next" contenteditable="true"> mnop </span>444<span id="last" contenteditable="true"> qrst </span>
+</div>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script>
+const KEY_CODE_MAP = {
+  'ArrowLeft':  '\uE012',
+  'ArrowUp':    '\uE013',
+  'ArrowRight': '\uE014',
+  'ArrowDown':  '\uE015',
+  'Tab': '\uE004',
+  'S': '\u0053',
+};
+
+function keyPress(target, key) {
+  const code = KEY_CODE_MAP[key];
+  return test_driver.send_keys(target, code);
+}
+
+function deletebr() {
+  let el;
+  el = document.querySelector('br');
+  if (el) {
+    el.remove();
+  }
+}
+
+// Delete the <br> element so that we get a single line
+deletebr();
+
+const s = getSelection();
+promise_test(async t => {
+  initial.focus();
+  let node = initial.firstChild;
+  assert_equals(s.anchorNode, node, "Focus must be at the span with 'abcd'");
+  assert_equals(s.anchorOffset, 0, "Caret must be at the start of the 'abcd' text");
+
+  await keyPress(initial, "Tab");
+  node = before.firstChild
+  assert_equals(s.anchorNode, node, "Caret moved to span with 'efgh'");
+  assert_equals(s.anchorOffset, 0, "Caret must be at the start of the 'efgh' text");
+
+  await keyPress(before, "Tab");
+  node = after.firstChild
+  assert_equals(s.anchorNode, node, "Focus must be at the span with 'ijkl'");
+  assert_equals(s.anchorOffset, 0, "Caret must be at the start of the 'efgh' text");
+
+  await keyPress(after, "Tab");
+  node = next.firstChild
+  assert_equals(s.anchorNode, node, "Focus must be at the span with 'mnop'");
+  assert_equals(s.anchorOffset, 0, "Caret must be at the start of the 'efgh' text");
+
+}, "Navigate after deleting <br>");
+
+promise_test(async t => {
+  initial.focus();
+  await keyPress(initial, "Tab");
+  await keyPress(before, "Tab");
+  await keyPress(after, "Tab");
+  await keyPress(next, "ArrowRight");
+  await keyPress(next, "ArrowRight");
+  await keyPress(next, "ArrowRight");
+
+  await keyPress(next, "S");
+  assert_equals(next.firstChild.textContent, " mnSop ", "Inserting a 'S' char betwen 'n' and 'o'");
+}, "Insert text after deleting <br>")
+
+</script>
diff --git a/testing/web-platform/tests/editing/run/caret-navigation-around-line-break.html b/testing/web-platform/tests/editing/run/caret-navigation-around-line-break.html
new file mode 100644
index 0000000000..eb1499936e
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/caret-navigation-around-line-break.html
@@ -0,0 +1,137 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Caret navigation around line break</title>
+<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
+<meta name="assert" content="This test checks that caret navigation works well around various kinds of line breaks." />
+<meta name="timeout" content="long">
+<style>
+.test {
+  font-size: 16px;
+  line-height: 20px;
+  padding: 4px;
+  width: 5.5ch;
+  padding: 5px;
+  font-family: monospace;
+  word-wrap: break-word;
+}
+</style>
+
+<div class="test" contenteditable data-title="no separator"
+    >line1line2</div>
+<div class="test" contenteditable data-title="<br> separator"
+    >line1<br>line2</div>
+<div class="test" contenteditable data-title="<wbr> separator"
+    >line1<wbr>line2</div>
+<div class="test" contenteditable data-title="<span> separator"
+    >line1<span></span>line2</div>
+<div class="test" contenteditable data-title="two <span> separators"
+    >line1<span></span><span></span>line2</div>
+
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script>
+const KEY_CODE_MAP = {
+  'ArrowLeft':  '\uE012',
+  'ArrowUp':    '\uE013',
+  'ArrowRight': '\uE014',
+  'ArrowDown':  '\uE015',
+};
+
+function click(target, x, y) {
+  return new test_driver.Actions()
+    .pointerMove(x, y, {origin: target})
+    .pointerDown()
+    .pointerUp()
+    .send();
+}
+
+const s = getSelection();
+for (const test of document.querySelectorAll(".test")) {
+  const padding = 4;
+  const halfLineWidth = Math.floor((test.offsetWidth - padding) / 2);
+  const halfLineHeight = Math.floor(20 / 2);
+  const hasSeparator = test.firstChild !== test.lastChild;
+  const line1 = {
+    node: test.firstChild,
+    start: 0,
+    end: "line1".length,
+  };
+  const line2 = {
+    node: test.lastChild,
+    start: hasSeparator ? 0 : "line1".length,
+    end: hasSeparator ? "line2".length : "line1line2".length,
+  };
+
+  promise_test(async t => {
+    // Click at the start of line 1
+    await click(test, -halfLineWidth, -halfLineHeight);
+    assert_equals(s.anchorNode, line1.node, "Caret is in line 1");
+    assert_equals(s.anchorOffset, line1.start, "Caret is at the start of line 1");
+
+    // Move down, expect start of line 2
+    await test_driver.send_keys(test, KEY_CODE_MAP.ArrowDown);
+    assert_equals(s.anchorNode, line2.node, "Caret moved to line 2");
+    assert_equals(s.anchorOffset, line2.start, "Caret moved to the start of line 2");
+
+    // Click at the end of line 1
+    await click(test, +halfLineWidth, -halfLineHeight);
+    range = getSelection().getRangeAt(0);
+    assert_equals(s.anchorNode, line1.node, "Caret is in line 1");
+    assert_equals(s.anchorOffset, line1.end, "Caret is at the end of line 1");
+
+    // Move down, expect end of line 2
+    await test_driver.send_keys(test, KEY_CODE_MAP.ArrowDown);
+    assert_equals(s.anchorNode, line2.node, "Caret moved to line 2");
+    assert_equals(s.anchorOffset, line2.end, "Caret moved to the end of line 2");
+  }, test.dataset.title + " - move down");
+
+  promise_test(async t => {
+    // Click at the start of line 2
+    await click(test, -halfLineWidth, +halfLineHeight);
+    assert_equals(s.anchorNode, line2.node, "Caret is in line 2");
+    assert_equals(s.anchorOffset, line2.start, "Caret is at the start of line 2");
+
+    // Move up, expect start of line 1
+    await test_driver.send_keys(test, KEY_CODE_MAP.ArrowUp);
+    assert_equals(s.anchorNode, line1.node, "Caret moved to line 1");
+    assert_equals(s.anchorOffset, line1.start, "Caret moved to the start of line 1");
+
+    // Click at the end of line 2
+    await click(test, +halfLineWidth, +halfLineHeight);
+    assert_equals(s.anchorNode, line2.node, "Caret is in line 2");
+    assert_equals(s.anchorOffset, line2.end, "Caret is at the end of line 2");
+
+    // Move up, expect end of line 1
+    await test_driver.send_keys(test, KEY_CODE_MAP.ArrowUp);
+    assert_equals(s.anchorNode, line1.node, "Caret moved to line 1");
+    assert_equals(s.anchorOffset, line1.end, "Caret moved to the end of line 1");
+  }, test.dataset.title + " - move up");
+
+  promise_test(async t => {
+    // Click at the end of line 1
+    await click(test, +halfLineWidth, -halfLineHeight);
+    assert_equals(s.anchorNode, line1.node, "Caret is in line 1");
+    assert_equals(s.anchorOffset, line1.end, "Caret is at the end of line 1");
+
+    // Move right, expect start or start+1 of line 2
+    await test_driver.send_keys(test, KEY_CODE_MAP.ArrowRight);
+    assert_equals(s.anchorNode, line2.node, "Caret moved to line 2");
+    assert_in_array(s.anchorOffset, [line2.start, line2.start + 1], "Caret moved to the start or start+1 of line 2");
+  }, test.dataset.title + " - move right");
+
+  promise_test(async t => {
+    // Click at the start of line 2
+    await click(test, -halfLineWidth, +halfLineHeight);
+    assert_equals(s.anchorNode, line2.node, "Caret is in line 2");
+    assert_equals(s.anchorOffset, line2.start, "Caret is at the start of line 2");
+
+    // Move left, expect end or end-1 of line 1
+    await test_driver.send_keys(test, KEY_CODE_MAP.ArrowLeft);
+    assert_equals(s.anchorNode, line1.node, "Caret moved to line 1");
+    assert_in_array(s.anchorOffset, [line1.end, line1.end - 1], "Caret moved to the end or end-1 of line 1");
+  }, test.dataset.title + " - move left");
+}
+</script>
diff --git a/testing/web-platform/tests/editing/run/caretnavigation.html b/testing/web-platform/tests/editing/run/caretnavigation.html
new file mode 100644
index 0000000000..c0a8eca4ac
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/caretnavigation.html
@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Caret navigation</title>
+
+<link rel="stylesheet" href="../support/reset.css">
+
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+
+<script>
+const KEY_CODE_MAP = {
+  'ArrowLeft':  '\uE012',
+  'ArrowUp':    '\uE013',
+  'ArrowRight': '\uE014',
+  'ArrowDown':  '\uE015',
+};
+
+/**
+ * Send key event to the target element using test driver. Supports human
+ * friendly key names for common keyboard scroll operations e.g., arrow keys,
+ * page keys, etc.
+ * @param {Node} target
+ * @param {string} key
+ * @returns {Promise}
+ */
+function keyPress(target, key) {
+  const code = KEY_CODE_MAP[key];
+  return test_driver.send_keys(target, code);
+}
+</script>
+
+<div id="container">
+  <div contenteditable data-title="Move with ArrowLeft to BR following a div">
+    <div>line 1</div>
+    <br>
+    <div class="caret">line 2</div>
+  </div>
+  <div contenteditable data-title="Move with ArrowLeft to BR following an img">
+    <img style="display:block;width:100px;height:100px">
+    <br>
+    <div class="caret">line 2</div>
+  </div>
+</div>
+
+<script>
+const container = document.getElementById("container");
+
+for (const test of container.children) {
+  promise_test(async t => {
+    test.focus();
+    getSelection().collapse(test.querySelector(".caret"));
+    await keyPress(test, "ArrowLeft");
+
+    const range = getSelection().getRangeAt(0);
+
+    assert_equals(range.commonAncestorContainer.localName, "div");
+    assert_equals(range.startOffset, 3);
+    assert_equals(range.commonAncestorContainer.childNodes[range.startOffset].localName, "br");
+  }, test.dataset.title);
+}
+</script>
diff --git a/testing/web-platform/tests/editing/run/createlink.html b/testing/web-platform/tests/editing/run/createlink.html
new file mode 100644
index 0000000000..b67357e684
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/createlink.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>createlink - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/createlink.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/delete-list-items-in-table-cell.html b/testing/web-platform/tests/editing/run/delete-list-items-in-table-cell.html
new file mode 100644
index 0000000000..b765bc4b97
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/delete-list-items-in-table-cell.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>delete list items in table cells - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/delete-list-items-in-table-cells.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/delete.html b/testing/web-platform/tests/editing/run/delete.html
new file mode 100644
index 0000000000..2d11f6af26
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/delete.html
@@ -0,0 +1,61 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-3000">
+<meta name="variant" content="?3001-4000">
+<meta name="variant" content="?4001-5000">
+<meta name="variant" content="?5001-6000">
+<meta name="variant" content="?6001-7000">
+<meta name="variant" content="?7001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>delete - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/delete.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/empty-editable-crash.html b/testing/web-platform/tests/editing/run/empty-editable-crash.html
new file mode 100644
index 0000000000..eda75a13cd
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/empty-editable-crash.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<link rel="help" href="https://crbug.com/1171845">
+<span id="target"></span>
+<div contenteditable="true">
+  <span></span>
+</div>
+<script>
+document.body.offsetTop;
+document.getElementById('target').style.paddingRight = '1em';
+document.getElementById('target').style.fontVariantNumeric = 'ordinal';
+</script>
diff --git a/testing/web-platform/tests/editing/run/first-letter-crossing-engine-boundary-crash.html b/testing/web-platform/tests/editing/run/first-letter-crossing-engine-boundary-crash.html
new file mode 100644
index 0000000000..be6325fce4
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/first-letter-crossing-engine-boundary-crash.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="http://crbug.com/962090">
+<style>
+  #container::first-letter { background:blue; }
+</style>
+<div id="container">
+  <div id="edit" style="overflow:hidden;" contenteditable>xx</div>
+  <div id="elm" style="display:none;">PASS</div>
+</div>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script>
+  document.body.offsetTop;
+  elm.style.display = "initial";
+  test(()=>{}, "No crash or DCHECK failure");
+</script>
diff --git a/testing/web-platform/tests/editing/run/fontname.html b/testing/web-platform/tests/editing/run/fontname.html
new file mode 100644
index 0000000000..53800c540c
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/fontname.html
@@ -0,0 +1,56 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>fontname - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/fontname.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/fontsize.html b/testing/web-platform/tests/editing/run/fontsize.html
new file mode 100644
index 0000000000..66ae99ebc1
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/fontsize.html
@@ -0,0 +1,56 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>fontsize - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/fontsize.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/forecolor.html b/testing/web-platform/tests/editing/run/forecolor.html
new file mode 100644
index 0000000000..8594e061c1
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/forecolor.html
@@ -0,0 +1,56 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>forecolor - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/forecolor.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/formatblock.html b/testing/web-platform/tests/editing/run/formatblock.html
new file mode 100644
index 0000000000..5c97c08e73
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/formatblock.html
@@ -0,0 +1,58 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-3000">
+<meta name="variant" content="?3001-4000">
+<meta name="variant" content="?4001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>formatblock - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/formatblock.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/forwarddelete.html b/testing/web-platform/tests/editing/run/forwarddelete.html
new file mode 100644
index 0000000000..e17190053a
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/forwarddelete.html
@@ -0,0 +1,60 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-3000">
+<meta name="variant" content="?3001-4000">
+<meta name="variant" content="?4001-5000">
+<meta name="variant" content="?5001-6000">
+<meta name="variant" content="?6001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>forwarddelete - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/forwarddelete.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/hilitecolor.html b/testing/web-platform/tests/editing/run/hilitecolor.html
new file mode 100644
index 0000000000..cd9e5528e5
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/hilitecolor.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>hilitecolor - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/hilitecolor.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/indent.html b/testing/web-platform/tests/editing/run/indent.html
new file mode 100644
index 0000000000..13e98f5ea6
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/indent.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>indent - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/indent.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/insert-list-items-in-table-cell.html b/testing/web-platform/tests/editing/run/insert-list-items-in-table-cell.html
new file mode 100644
index 0000000000..8d08f8c3eb
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/insert-list-items-in-table-cell.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>Insert list items in table cells - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/insert-list-items-in-table-cells.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/inserthorizontalrule.html b/testing/web-platform/tests/editing/run/inserthorizontalrule.html
new file mode 100644
index 0000000000..6e3e5490a6
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/inserthorizontalrule.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>inserthorizontalrule - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/inserthorizontalrule.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/inserthtml.html b/testing/web-platform/tests/editing/run/inserthtml.html
new file mode 100644
index 0000000000..f83102e6a9
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/inserthtml.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>inserthtml - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/inserthtml.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/insertimage.html b/testing/web-platform/tests/editing/run/insertimage.html
new file mode 100644
index 0000000000..7a1f7b9226
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/insertimage.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>insertimage - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/insertimage.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/insertlinebreak.html b/testing/web-platform/tests/editing/run/insertlinebreak.html
new file mode 100644
index 0000000000..ddab665084
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/insertlinebreak.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>insertlinebreak - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/insertlinebreak.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/insertorderedlist.html b/testing/web-platform/tests/editing/run/insertorderedlist.html
new file mode 100644
index 0000000000..68772355c2
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/insertorderedlist.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>insertorderedlist - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/insertorderedlist.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/insertparagraph.html b/testing/web-platform/tests/editing/run/insertparagraph.html
new file mode 100644
index 0000000000..173c5aea40
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/insertparagraph.html
@@ -0,0 +1,60 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-3000">
+<meta name="variant" content="?3001-4000">
+<meta name="variant" content="?4001-5000">
+<meta name="variant" content="?5001-6000">
+<meta name="variant" content="?6001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>insertparagraph - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/insertparagraph.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/inserttext.html b/testing/web-platform/tests/editing/run/inserttext.html
new file mode 100644
index 0000000000..a01293fcae
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/inserttext.html
@@ -0,0 +1,56 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>inserttext - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/inserttext.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/insertunorderedlist.html b/testing/web-platform/tests/editing/run/insertunorderedlist.html
new file mode 100644
index 0000000000..b1f636b109
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/insertunorderedlist.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>insertunorderedlist - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/insertunorderedlist.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/italic.html b/testing/web-platform/tests/editing/run/italic.html
new file mode 100644
index 0000000000..6185d553d0
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/italic.html
@@ -0,0 +1,56 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>italic - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/italic.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/justifycenter.html b/testing/web-platform/tests/editing/run/justifycenter.html
new file mode 100644
index 0000000000..4902a302cc
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/justifycenter.html
@@ -0,0 +1,60 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-3000">
+<meta name="variant" content="?3001-4000">
+<meta name="variant" content="?4001-5000">
+<meta name="variant" content="?5001-6000">
+<meta name="variant" content="?6001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>justifycenter - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/justifycenter.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/justifyfull.html b/testing/web-platform/tests/editing/run/justifyfull.html
new file mode 100644
index 0000000000..c11befaf89
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/justifyfull.html
@@ -0,0 +1,58 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-3000">
+<meta name="variant" content="?3001-4000">
+<meta name="variant" content="?4001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>justifyfull - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/justifyfull.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/justifyleft.html b/testing/web-platform/tests/editing/run/justifyleft.html
new file mode 100644
index 0000000000..f6b2818538
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/justifyleft.html
@@ -0,0 +1,56 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>justifyleft - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/justifyleft.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/justifyright.html b/testing/web-platform/tests/editing/run/justifyright.html
new file mode 100644
index 0000000000..edd30b7f5f
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/justifyright.html
@@ -0,0 +1,58 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-3000">
+<meta name="variant" content="?3001-4000">
+<meta name="variant" content="?4001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>justifyright - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/justifyright.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/misc.html b/testing/web-platform/tests/editing/run/misc.html
new file mode 100644
index 0000000000..5bf5268229
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/misc.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>misc - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/misc.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/multitest.html b/testing/web-platform/tests/editing/run/multitest.html
new file mode 100644
index 0000000000..813b9edc03
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/multitest.html
@@ -0,0 +1,63 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-3000">
+<meta name="variant" content="?3001-4000">
+<meta name="variant" content="?4001-5000">
+<meta name="variant" content="?5001-6000">
+<meta name="variant" content="?6001-7000">
+<meta name="variant" content="?7001-8000">
+<meta name="variant" content="?8001-9000">
+<meta name="variant" content="?9001-last">
+<link rel=stylesheet href=../include/reset.css>
+<meta name="timeout" content="long">
+<title>multitest - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/multitest.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/outdent.html b/testing/web-platform/tests/editing/run/outdent.html
new file mode 100644
index 0000000000..f1f9fb491a
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/outdent.html
@@ -0,0 +1,56 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>outdent - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/outdent.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/removeformat.html b/testing/web-platform/tests/editing/run/removeformat.html
new file mode 100644
index 0000000000..0c38ff915f
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/removeformat.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>removeformat - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/removeformat.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/strikethrough.html b/testing/web-platform/tests/editing/run/strikethrough.html
new file mode 100644
index 0000000000..cb06c10d0c
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/strikethrough.html
@@ -0,0 +1,56 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>strikethrough - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/strikethrough.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/subscript.html b/testing/web-platform/tests/editing/run/subscript.html
new file mode 100644
index 0000000000..e0071d7a08
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/subscript.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>subscript - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/subscript.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/superscript.html b/testing/web-platform/tests/editing/run/superscript.html
new file mode 100644
index 0000000000..0c3519b288
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/superscript.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>superscript - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/superscript.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/underline.html b/testing/web-platform/tests/editing/run/underline.html
new file mode 100644
index 0000000000..f53add984b
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/underline.html
@@ -0,0 +1,56 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<meta name="variant" content="?1-1000">
+<meta name="variant" content="?1001-2000">
+<meta name="variant" content="?2001-last">
+<link rel=stylesheet href=../include/reset.css>
+<title>underline - HTML editing conformance tests</title>
+
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/underline.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
diff --git a/testing/web-platform/tests/editing/run/undo-redo-after-mutation.html b/testing/web-platform/tests/editing/run/undo-redo-after-mutation.html
new file mode 100644
index 0000000000..8d583a161f
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/undo-redo-after-mutation.html
@@ -0,0 +1,119 @@
+<!DOCTYPE html>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<div contenteditable></div>
+<script>
+"use strict";
+let editor = document.querySelector("div[contenteditable]");
+let selection = document.getSelection();
+
+test(function () {
+  editor.innerHTML = "<i>will be removed</i> abc";
+  selection.collapse(editor.lastChild, editor.lastChild.length);
+  document.execCommand("insertLineBreak", false, "");
+  assert_equals(editor.innerHTML, "<i>will be removed</i> abc<br><br>",
+                "<br> element should be inserted by execCommand(\"insertLineBreak\")");
+  document.execCommand("undo", false, "");
+  assert_equals(editor.innerHTML, "<i>will be removed</i> abc",
+                "<br> element should be removed by execCommand(\"undo\")");
+  editor.firstChild.remove();
+  document.execCommand("redo", false, "");
+  assert_equals(editor.innerHTML, " abc<br><br>",
+                "<br> element should be inserted by execCommand(\"redo\")");
+}, "Redo for execCommand(\"insertLineBreak\") after removing prior sibling with DOM API after undoing");
+
+test(function () {
+  editor.innerHTML = "abc";
+  selection.collapse(editor.firstChild, editor.firstChild.length);
+  document.execCommand("insertLineBreak", false, "");
+  assert_equals(editor.innerHTML, "abc<br><br>",
+                "<br> element should be inserted by execCommand(\"insertLineBreak\")");
+  document.execCommand("undo", false, "");
+  assert_equals(editor.innerHTML, "abc",
+                "<br> element should be removed by execCommand(\"undo\")");
+  let i = document.createElement("i");
+  i.textContent = " appended text";
+  editor.appendChild(i);
+  document.execCommand("redo", false, "");
+  assert_equals(editor.innerHTML, "abc<i> appended text</i><br><br>",
+                "<br> element should be appended by execCommand(\"redo\") after the appended text");
+}, "Redo for execCommand(\"insertLineBreak\") after appending new child with DOM API after undoing");
+
+test(function () {
+  editor.innerHTML = "abc";
+  selection.collapse(editor.firstChild, editor.firstChild.length);
+  document.execCommand("insertLineBreak", false, "");
+  assert_equals(editor.innerHTML, "abc<br><br>",
+                "<br> element should be inserted by execCommand(\"insertLineBreak\")");
+  document.execCommand("undo", false, "");
+  assert_equals(editor.innerHTML, "abc",
+                "<br> element should be removed by execCommand(\"undo\")");
+  let i = document.createElement("i");
+  i.textContent = "inserted text ";
+  editor.insertBefore(i, editor.firstChild);
+  document.execCommand("redo", false, "");
+  assert_equals(editor.innerHTML, "<i>inserted text </i>abc<br><br>",
+                "<br> element should be appended by execCommand(\"redo\") after the appended text");
+}, "Redo for execCommand(\"insertLineBreak\") after inserting new child with DOM API after undoing");
+
+test(function () {
+  editor.innerHTML = "<b>will be removed</b><i>abc</i>";
+  selection.collapse(editor.querySelector("b").firstChild, editor.querySelector("b").firstChild.length);
+  document.execCommand("insertLineBreak", false, "");
+  assert_equals(editor.innerHTML, "<b>will be removed<br></b><i>abc</i>",
+                "<br> element should be inserted into the <b> element by execCommand(\"insertLineBreak\")");
+  document.execCommand("undo", false, "");
+  assert_equals(editor.innerHTML, "<b>will be removed</b><i>abc</i>",
+                "<br> element should be removed by execCommand(\"undo\")");
+  editor.querySelector("b").remove();
+  document.execCommand("redo", false, "");
+  assert_equals(editor.innerHTML, "<i>abc</i>",
+                "<br> element shouldn't be restored by execCommand(\"redo\") after removing the <b> element");
+}, "Redo for execCommand(\"insertLineBreak\") after removing its container with DOM API after undoing");
+
+test(function () {
+  editor.innerHTML = "<b>abc</b><i>will be removed</i>";
+  selection.collapse(editor.querySelector("b").firstChild, editor.querySelector("b").firstChild.length);
+  document.execCommand("insertLineBreak", false, "");
+  assert_equals(editor.innerHTML, "<b>abc<br></b><i>will be removed</i>",
+                "<br> element should be inserted into the <b> element by execCommand(\"insertLineBreak\")");
+  document.execCommand("undo", false, "");
+  assert_equals(editor.innerHTML, "<b>abc</b><i>will be removed</i>",
+                "<br> element should be removed by execCommand(\"undo\")");
+  editor.querySelector("i").remove();
+  document.execCommand("redo", false, "");
+  assert_equals(editor.innerHTML, "<b>abc<br></b>",
+                "<br> element should be restored by execCommand(\"redo\") after removing the following <i> element");
+}, "Redo for execCommand(\"insertLineBreak\") after removing <i> element following the container with DOM API after undoing");
+
+// Not sure whether redoing in both of the following 2 cases should work as so.
+test(function () {
+  editor.innerHTML = "<b>will be removed</b><i>abc</i>";
+  selection.collapse(editor, 1);
+  document.execCommand("insertLineBreak", false, "");
+  assert_equals(editor.innerHTML, "<b>will be removed</b><br><i>abc</i>",
+                "<br> element should be inserted between the <b> and <i> elements by execCommand(\"insertLineBreak\")");
+  document.execCommand("undo", false, "");
+  assert_equals(editor.innerHTML, "<b>will be removed</b><i>abc</i>",
+                "<br> element should be removed by execCommand(\"undo\")");
+  editor.querySelector("b").remove();
+  document.execCommand("redo", false, "");
+  assert_equals(editor.innerHTML, "<br><i>abc</i>",
+                "<br> element should be restored by execCommand(\"redo\") after removing the preceding <b> element");
+}, "Redo for execCommand(\"insertLineBreak\") between <b> and <i> after removing preceding <b> element with DOM API after undoing");
+
+test(function () {
+  editor.innerHTML = "<b>abc</b><i>will be removed</i>";
+  selection.collapse(editor, 1);
+  document.execCommand("insertLineBreak", false, "");
+  assert_equals(editor.innerHTML, "<b>abc</b><br><i>will be removed</i>",
+                "<br> element should be inserted between the <b> and <i> elements by execCommand(\"insertLineBreak\")");
+  document.execCommand("undo", false, "");
+  assert_equals(editor.innerHTML, "<b>abc</b><i>will be removed</i>",
+                "<br> element should be removed by execCommand(\"undo\")");
+  editor.querySelector("i").remove();
+  document.execCommand("redo", false, "");
+  assert_equals(editor.innerHTML, "<b>abc</b><br>",
+                "<br> element should be restored by execCommand(\"redo\") after removing the following <i> element");
+}, "Redo for execCommand(\"insertLineBreak\") between <b> and <i> after after removing following <i> element with DOM API after undoing");
+</script>
diff --git a/testing/web-platform/tests/editing/run/undo-redo.html b/testing/web-platform/tests/editing/run/undo-redo.html
new file mode 100644
index 0000000000..69bee00c86
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/undo-redo.html
@@ -0,0 +1,226 @@
+<!DOCTYPE html>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="../include/editor-test-utils.js"></script>
+<iframe srcdoc=""></iframe>
+<script>
+"use strict";
+const iframe = document.querySelector("iframe");
+
+promise_test(async () => {
+  await new Promise(resolve => {
+    addEventListener("load", resolve, {once: true});
+  });
+}, "Waiting for load...");
+
+/**
+ * This test does NOT test whether the edit result is valid or invalid.
+ * This test just tests whether "undo" and "redo" restores previous state
+ * and additional "undo" and "redo" does not run unexpectedly.
+ *
+ * description: Set string to explain what's testing.
+ * editorInnerHTML: Set initial innerHTML value of editor.
+ * init: Set a function object if you need to test complicated cases, e.g.,
+ *       testing with empty text node.
+ * run: Set a function object which run something modifying the editor (or
+ *      does nothing).
+ * expectedUndoResult: Set an expected innerHTML result as string or array
+ *                     of the string.  If this is not specified, it's compared
+ *                     with editorInnerHTML value.
+ * cleanUp: Set a function object if you need to clean something up after the
+ *          test.
+ */
+
+const tests = [
+  {
+    description: "insertParagraph at start of a paragraph",
+    editorInnerHTML: "<p>[]abcdef</p>",
+    run: (win, doc, editingHost) => {
+      doc.execCommand("insertParagraph");
+    },
+  },
+  {
+    description: "insertParagraph at middle of a paragraph",
+    editorInnerHTML: "<p>abc[]def</p>",
+    run: (win, doc, editingHost) => {
+      doc.execCommand("insertParagraph");
+    },
+  },
+  {
+    description: "insertParagraph at end of a paragraph",
+    editorInnerHTML: "<p>abcdef[]</p>",
+    run: (win, doc, editingHost) => {
+      doc.execCommand("insertParagraph");
+    },
+  },
+  {
+    description: "insertParagraph at start of a listitem",
+    editorInnerHTML: "<ul><li>[]abcdef</li></ul>",
+    run: (win, doc, editingHost) => {
+      doc.execCommand("insertParagraph");
+    },
+  },
+  {
+    description: "insertParagraph at middle of a listitem",
+    editorInnerHTML: "<ul><li>abc[]def</li></ul>",
+    run: (win, doc, editingHost) => {
+      doc.execCommand("insertParagraph");
+    },
+  },
+  {
+    description: "insertParagraph at end of a listitem",
+    editorInnerHTML: "<ul><li>abcdef[]</li></ul>",
+    run: (win, doc, editingHost) => {
+      doc.execCommand("insertParagraph");
+    },
+  },
+  {
+    description: "insertLineBreak at start of a paragraph",
+    editorInnerHTML: "<p>[]abcdef</p>",
+    run: (win, doc, editingHost) => {
+      doc.execCommand("insertLineBreak");
+    },
+  },
+  {
+    description: "insertLineBreak at middle of a paragraph",
+    editorInnerHTML: "<p>abc[]def</p>",
+    run: (win, doc, editingHost) => {
+      doc.execCommand("insertLineBreak");
+    },
+  },
+  {
+    description: "insertLineBreak at end of a paragraph",
+    editorInnerHTML: "<p>abcdef[]</p>",
+    run: (win, doc, editingHost) => {
+      doc.execCommand("insertLineBreak");
+    },
+  },
+  {
+    description: "insertLineBreak at start of a listitem",
+    editorInnerHTML: "<ul><li>[]abcdef</li></ul>",
+    run: (win, doc, editingHost) => {
+      doc.execCommand("insertLineBreak");
+    },
+  },
+  {
+    description: "insertLineBreak at middle of a listitem",
+    editorInnerHTML: "<ul><li>abc[]def</li></ul>",
+    run: (win, doc, editingHost) => {
+      doc.execCommand("insertLineBreak");
+    },
+  },
+  {
+    description: "insertLineBreak at end of a listitem",
+    editorInnerHTML: "<ul><li>abcdef[]</li></ul>",
+    run: (win, doc, editingHost) => {
+      doc.execCommand("insertLineBreak");
+    },
+  },
+  {
+    description: "delete at start of second paragraph",
+    editorInnerHTML: "<p>abc</p><p>[]def</p>",
+    run: (win, doc, editingHost) => {
+      doc.execCommand("delete");
+    }
+  },
+  {
+    description: "forwarddelete at end of first paragraph",
+    editorInnerHTML: "<p>abc[]</p><p>def</p>",
+    run: (win, doc, editingHost) => {
+      doc.execCommand("forwarddelete");
+    }
+  },
+  {
+    description: "delete at start of second paragraph starting with an emoji",
+    editorInnerHTML: "<p>abc\uD83D\uDC49</p><p>[]\uD83D\uDC48def</p>",
+    run: (win, doc, editingHost) => {
+      doc.execCommand("delete");
+    }
+  },
+  {
+    description: "forwarddelete at end of first paragraph ending with an emoji",
+    editorInnerHTML: "<p>abc\uD83D\uDC49[]</p><p>\uD83D\uDC48def</p>",
+    run: (win, doc, editingHost) => {
+      doc.execCommand("forwarddelete");
+    }
+  },
+];
+
+for (const curTest of tests) {
+  promise_test(async t => {
+    await new Promise(resolve => {
+      iframe.addEventListener("load", resolve, {once: true});
+      iframe.srcdoc = "<html><body><div contenteditable></div></body></html>";
+    });
+    const contentDocument = iframe.contentDocument;
+    const contentWindow = iframe.contentWindow;
+    contentWindow.focus();
+    const editingHost = contentDocument.querySelector("div[contenteditable]");
+    const utils = new EditorTestUtils(editingHost, window);
+    utils.setupEditingHost(curTest.editorInnerHTML);
+    contentDocument.documentElement.scrollHeight;  // flush pending things
+    if (typeof curTest.init == "function") {
+      await curTest.init(contentWindow, contentDocument, editingHost);
+    }
+    const initialValue = editingHost.innerHTML;
+    await curTest.run(contentWindow, contentDocument, editingHost);
+    const newValue = editingHost.innerHTML;
+    test(t2 => {
+      const ret = contentDocument.execCommand("undo");
+      if (curTest.expectedUndoResult !== undefined) {
+        if (typeof curTest.expectedUndoResult == "string") {
+          assert_equals(
+            editingHost.innerHTML,
+            curTest.expectedUndoResult,
+            `${t2.name}: should restore the innerHTML value`
+          );
+        } else {
+          assert_in_array(
+            editingHost.innerHTML,
+            curTest.expectedUndoResult,
+            `${t2.name}: should restore one of the innerHTML values`
+          );
+        }
+      } else {
+        assert_equals(
+          editingHost.innerHTML,
+          initialValue,
+          `${t2.name}: should restore the initial innerHTML value`
+        );
+      }
+      assert_true(ret, `${t2.name}: execCommand("undo") should return true`);
+    }, `${t.name} - first undo`);
+    test(t3 => {
+      const ret = contentDocument.execCommand("redo");
+      assert_equals(
+        editingHost.innerHTML,
+        newValue,
+        `${t3.name}: should restore the modified innerHTML value`
+      );
+      assert_true(ret, `${t3.name}: execCommand("redo") should return true`);
+    }, `${curTest.description} - first redo`);
+    test(t4 => {
+      const ret = contentDocument.execCommand("redo");
+      assert_equals(
+        editingHost.innerHTML,
+        newValue,
+        `${t4.name}: should not modify the modified innerHTML value`
+      );
+      assert_false(ret, `${t4.name}: execCommand("redo") should return false`);
+    }, `${curTest.description} - second redo`);
+    if (typeof curTest.cleanUp == "function") {
+      await curTest.cleanUp(contentWindow, contentDocument, editingHost);
+    }
+    iframe.srcdoc = "";
+    contentDocument.documentElement.scrollHeight; // flush pending things
+    await new Promise(resolve =>
+      requestAnimationFrame(
+        () => requestAnimationFrame(resolve)
+      )
+    );
+  }, curTest.description);
+}
+</script>
diff --git a/testing/web-platform/tests/editing/run/unlink.html b/testing/web-platform/tests/editing/run/unlink.html
new file mode 100644
index 0000000000..5a623b4a09
--- /dev/null
+++ b/testing/web-platform/tests/editing/run/unlink.html
@@ -0,0 +1,57 @@
+<!doctype html>
+<meta charset=utf-8>
+<meta name="timeout" content="long">
+<link rel=stylesheet href=../include/reset.css>
+<title>unlink - HTML editing conformance tests</title>
+<style>
+.bold {
+  font-weight: bold;
+}
+</style>
+<p id=timing></p>
+
+<div id=log></div>
+
+<div id=test-container></div>
+
+<script src=../include/implementation.js></script>
+<script>var testsJsLibraryOnly = true</script>
+<script src=../include/tests.js></script>
+<script src=../data/unlink.js></script>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/subset-tests.js"></script>
+<script>
+"use strict";
+
+(function() {
+    var startTime = Date.now();
+
+    // Make document.body.innerHTML more tidy by removing unnecessary things.
+    [].forEach.call(document.querySelectorAll("script"), function(node) {
+        node.parentNode.removeChild(node);
+    });
+
+    if (true) {
+        // Silly hack: the CSS styling flag should be true, not false, to match
+        // expected results.  This is because every group of tests except the
+        // last (multitest) sets styleWithCSS automatically, and it sets it
+        // first to false and then to true.  Thus it's left at true at the end
+        // of each group of tests, so in gentest.html it will be true when
+        // starting each group of tests other than the first.  But browsers are
+        // supposed to default it to false when the page loads, so flip it.
+        try { document.execCommand("styleWithCSS", false, "true") } catch(e) {}
+    }
+
+    browserTests.forEach(runConformanceTest);
+
+    document.getElementById("test-container").parentNode
+        .removeChild(document.getElementById("test-container"));
+
+    var elapsed = Math.round(Date.now() - startTime)/1000;
+    document.getElementById("timing").textContent =
+        "Time elapsed: " + Math.floor(elapsed/60) + ":"
+        + ((elapsed % 60) < 10 ? "0" : "")
+        + (elapsed % 60).toFixed(3) + " min.";
+})();
+</script>
author	Daniel Baumann <daniel.baumann@progress-linux.org>	2024-04-07 09:22:09 +0000
committer	Daniel Baumann <daniel.baumann@progress-linux.org>	2024-04-07 09:22:09 +0000
commit	43a97878ce14b72f0981164f87f2e35e14151312 (patch)
tree	620249daf56c0258faa40cbdcf9cfba06de2a846 /testing/web-platform/tests/editing/run
parent	Initial commit. (diff)
download	firefox-upstream.tar.xz firefox-upstream.zip