[w3c/selection-api] Clarify how `selection.modify()` when the granularity parameter is `paragraph` handles non-editable elements in an editing host (Issue #173)

[The specification](https://w3c.github.io/selection-api/#dom-selection-modify) doesn't define the behavior of `seleciton.modify()` when the granularity parameter is `paragraph`.

Consider [this test case](https://codepen.io/Peng-Zhou/pen/LYabZVR):
```
<style>
div {
  width: 1000px;
}
</style>
<div contenteditable>
  <p id="one">Demo 1</p>
  <p id="two">
    Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, <span contenteditable="false">11111</span> omnis voluptas assumenda est, omnis dolor repellendus.
  </p>
</div>

<p>Move the caret at the end of p#two, then click the button.</p>

<button>Modify</button>

<script>
document.querySelector('button').addEventListener('click', () => {
  const selection = window.getSelection();
  selection.modify('move', 'backward', 'paragraph');
});
</script>
```

The behavior of browsers: 
- Safari, Edge, and Chrome: Same as the granularity of `line`, the caret position is `cumque |nihil`.
- Firefox:  Not support the granularity of `paragraph`.

If we make `span` to be editable, the behavior of browsers:
- Safari, Edge, and Chrome: The caret position is `Demo 1|`.
- Firefox:  Not support the granularity of `paragraph`.


-- 
Reply to this email directly or view it on GitHub:
https://github.com/w3c/selection-api/issues/173
You are receiving this because you are subscribed to this thread.

Message ID: <w3c/selection-api/issues/173@github.com>

Received on Tuesday, 19 March 2024 09:13:04 UTC