summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/editing/other/insertparagraph-in-non-splittable-element.html
diff options
context:
space:
mode:
Diffstat (limited to 'testing/web-platform/tests/editing/other/insertparagraph-in-non-splittable-element.html')
-rw-r--r--testing/web-platform/tests/editing/other/insertparagraph-in-non-splittable-element.html145
1 files changed, 145 insertions, 0 deletions
diff --git a/testing/web-platform/tests/editing/other/insertparagraph-in-non-splittable-element.html b/testing/web-platform/tests/editing/other/insertparagraph-in-non-splittable-element.html
new file mode 100644
index 0000000000..21aa495bd6
--- /dev/null
+++ b/testing/web-platform/tests/editing/other/insertparagraph-in-non-splittable-element.html
@@ -0,0 +1,145 @@
+<!doctype html>
+<meta charset="utf-8">
+<meta name="timeout" content="long">
+<title>Test for inserting paragraph in non-splittable elements</title>
+<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>
+<div contenteditable></div>
+<script>
+"use strict";
+
+const editingHost = document.querySelector("div[contenteditable]");
+const utils = new EditorTestUtils(editingHost);
+
+const tests = [
+ {
+ selector: "button",
+ initial: "<div><button>abc</button></div>",
+ // <button> can have <br> so that it should be handled as insertLineBreak.
+ expected: "<div><button><br>abc</button></div>",
+ },
+ {
+ selector: "caption",
+ initial: "<div><table><caption>abc</caption><tbody><tr><td>abc</td></tr></tbody></table></div>",
+ // <caption> can have paragraphs so that it should be handled as in a block.
+ expected: [
+ "<div><table><caption><br><div>abc</div></caption><tbody><tr><td>abc</td></tr></tbody></table></div>",
+ "<div><table><caption><div><br></div><div>abc</div></caption><tbody><tr><td>abc</td></tr></tbody></table></div>",
+ ],
+ },
+ {
+ selector: "col",
+ initial: "<div><table><colgroup><col></colgroup><tbody><tr><td>abc</td></tr></tbody></table></div>",
+ // <col> and its table parents cannot have paragraphs nor <br>, therefore,
+ // it should be handled outside <table> or the first cell in the table.
+ expected: [
+ "<div><table><colgroup><col></colgroup><tbody><tr><td><br>abc</td></tr></tbody></table></div>", // handled with the first cell case
+ "<div><br></div><div><table><colgroup><col></colgroup><tbody><tr><td>abc</td></tr></tbody></table></div>", // handled outside the table case
+ ],
+ },
+ {
+ selector: "colgroup",
+ initial: "<div><table><colgroup><col></colgroup><tbody><tr><td>abc</td></tr></tbody></table></div>",
+ // <colgroup> and its table parents cannot have paragraphs nor <br>,
+ // therefore, it should be handled outside <table> or the the first cell
+ // in the table.
+ expected: [
+ "<div><table><colgroup><col></colgroup><tbody><tr><td><br>abc</td></tr></tbody></table></div>", // handled with the first cell case
+ "<div><br></div><div><table><colgroup><col></colgroup><tbody><tr><td>abc</td></tr></tbody></table></div>", // handled outside the table case
+ ],
+ },
+ {
+ selector: "iframe",
+ initial: "<div><iframe srcdoc=\"abc\"></iframe></div>",
+ // <iframe> is a replaced element so that it should be handled outside of it.
+ expected: "<div><br></div><div><iframe srcdoc=\"abc\"></iframe></div>",
+ },
+ {
+ selector: "legend",
+ initial: "<div><fieldset><legend>abc</legend></fieldset></div>",
+ // <fieldset> cannot have multiple <legend> elements so that it should not
+ // be split, and it cannot have paragraphs so that <br> element should be
+ // inserted instead.
+ expected: "<div><fieldset><legend><br>abc</legend></fieldset></div>",
+ },
+ {
+ selector: "meter",
+ initial: "<div><meter max=\"100\" value=\"50\">abc</meter></div>",
+ // <meter> is a replaced element so that it should be handled outside of it.
+ expected: "<div><br></div><div><meter max=\"100\" value=\"50\">abc</meter></div>",
+ },
+ {
+ selector: "optgroup",
+ initial: "<div><select><optgroup><option>abc</option></optgroup></select></div>",
+ // <optgroup> is a part of <select> and they are replaced so that it should
+ // be handled outside of it.
+ expected: "<div><br></div><div><select><optgroup><option>abc</option></optgroup></select></div>",
+ },
+ {
+ selector: "option",
+ initial: "<div><select><option>abc</option></select></div>",
+ // <option> is a part of <select> and they are replaced so that it should
+ // be handled outside of it.
+ expected: "<div><select><option>abc</option></select></div>",
+ },
+ {
+ selector: "progress",
+ initial: "<div><progress max=\"100\" value=\"50\">abc</progress></div>",
+ // <meter> is a replaced element so that it should be handled outside of it.
+ expected: "<div><br></div><div><progress max=\"100\" value=\"50\">abc</progress></div>",
+ },
+ {
+ selector: "select",
+ initial: "<div><select><option>abc</option></select></div>",
+ // <select> is a replaced element so that it should be handled outside of it.
+ expected: "<div><br></div><div><select><option>abc</option></select></div>",
+ },
+ {
+ selector: "table",
+ initial: "<div><table><tbody><tr><td>abc</td></tr></tbody></table></div>",
+ // <table> cannot have paragraphs nor <br>, therefore, it should be handled
+ // outside or in the first cell in the table.
+ expected: [
+ "<div><table><tbody><tr><td><br>abc</td></tr></tbody></table></div>", // handled in the first cell case
+ "<div><br></div><div><table><tbody><tr><td>abc</td></tr></tbody></table></div>", // handled outside the table case
+ ],
+ },
+ {
+ selector: "tbody",
+ initial: "<div><table><tbody><tr><td>abc</td></tr></tbody></table></div>",
+ // <tbody> and its parent cannot have paragraphs nor <br>, therefore,
+ // it should be handled outside <table> or the first cell in the table.
+ expected: [
+ "<div><table><tbody><tr><td><br>abc</td></tr></tbody></table></div>", // handled in the next cell case
+ "<div><br></div><div><table><tbody><tr><td>abc</td></tr></tbody></table></div>", // handled outside the table case
+ ],
+ },
+ {
+ selector: "tr",
+ initial: "<div><table><tbody><tr><td>abc</td></tr></tbody></table></div>",
+ // <tr> and its table parents cannot have paragraphs nor <br>, therefore,
+ // it should be handled outside <table> or the first cell in the table.
+ expected: [
+ "<div><table><tbody><tr><td><br>abc</td></tr></tbody></table></div>", // handled in the next cell case
+ "<div><br></div><div><table><tbody><tr><td>abc</td></tr></tbody></table></div>", // handled outside the table case
+ ],
+ },
+];
+
+for (const currentTest of tests) {
+ promise_test(async t => {
+ editingHost.innerHTML = currentTest.initial;
+ getSelection().collapse(editingHost.querySelector(currentTest.selector), 0);
+ await utils.sendEnterKey();
+ if (Array.isArray(currentTest.expected)) {
+ assert_in_array(editingHost.innerHTML, currentTest.expected);
+ } else {
+ assert_equals(editingHost.innerHTML, currentTest.expected);
+ }
+ }, `insertParagraph in ${currentTest.selector} of ${currentTest.initial}`);
+}
+</script>