test_bug372086.html

Enable keyboard shortcuts

<!DOCTYPE HTML>

<html>

<!--

https://bugzilla.mozilla.org/show_bug.cgi?id=372086

-->

<head>

  <title>Test for Bug 372086</title>

  <script src="/tests/SimpleTest/SimpleTest.js"></script>

  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />

</head>

<body>

<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=372086">Mozilla Bug 372086</a>

<p id="display">

  <div id="d" is="custom-div">abc</div>def

</p>

<div id="content" style="display: none">

</div>

<pre id="test">

<script class="testbody" type="text/javascript">

/** Test for Bug 372086 **/

customElements.define("custom-div", class extends HTMLDivElement {

  constructor() {

    super();

    this.attachShadow({ mode: "open" });

    this.shadowRoot.innerHTML = `ghi<slot></slot>jkl`;

}, {

  extends: "div",

});

function runTest() {

  let range = document.createRange();

  var c = $("d").firstChild;

  var a = $("d").nextSibling;

  range.setStart(c, 1);

  range.setEnd(c, 3);

  is(range.startContainer, c, "Unexpected start container");

  is(range.startOffset, 1, "Unexpected start offset");

  is(range.endContainer, c, "Unexpected end container");

  is(range.endOffset, 3, "Unexpected end offset");

  is(range.toString(), "bc", "Unexpected range serialization");

  let shadow = d.shadowRoot.firstChild;

  // Should collapse the range, because can't determine order

  range.setEnd(shadow, 2);

  is(range.startContainer, shadow,

     "Unexpected collapsed start container");

  is(range.startOffset, 2, "Unexpected collapsed start offset");

  is(range.endContainer, shadow,

     "Unexpected collapsed end container");

  is(range.endOffset, 2, "Unexpected collapsed end offset");

  is(range.toString(), "", "Unexpected collapsed range serialization");

  range.setEnd(a, 2);

  range.setStart(a, 0);

  is(range.startContainer, a, "Unexpected start container after");

  is(range.startOffset, 0, "Unexpected start offset after");

  is(range.endContainer, a, "Unexpected end container after");

  is(range.endOffset, 2, "Unexpected end offset after");

  is(range.toString(), "de", "Unexpected range serialization after");

  shadow = d.shadowRoot.lastChild;

  // Collapses because one endpoint is anonymous from point of view of

  // the other.

  range.setStart(shadow, 1);

  is(range.startContainer, shadow,

     "Unexpected newly collapsed start container");

  is(range.startOffset, 1, "Unexpected newly collapsed start offset");

  is(range.endContainer, shadow,

     "Unexpected newly collapsed end container");

  is(range.endOffset, 1, "Unexpected newly collapsed end offset");

  is(range.toString(), "", "Unexpected collapsed range serialization");

  range.setEnd(shadow, 3);

  is(range.startContainer, shadow,

     "Unexpected shadow start container");

  is(range.startOffset, 1, "Unexpected shadow start offset");

  is(range.endContainer, shadow,

     "Unexpected shadow end container");

  is(range.endOffset, 3, "Unexpected shadow end offset");

  is(range.toString(), "kl", "Unexpected shadow range serialization");

SimpleTest.waitForExplicitFinish();

addLoadEvent(runTest);

addLoadEvent(SimpleTest.finish)

</script>

</pre>

</body>

</html>