w3c / w3c/editing

insertParagraph definition is different from current browsers' behavior when selection is collapsed at end of inline element(s)

Open
#172 7 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

execCommand
Dominant language
HTML
Stars
202
Forks
43
PR merge metrics
No merged PRs in 30d

Description

Although I'm not sure here is a good place to file an issue of execCommand spec:
https://w3c.github.io/editing/execCommand.html#the-insertparagraph-command

insertParagraph command declares that when selection is started from end of inline element(s), start of range to copy nodes to new container should be next to its next node (16). However, actually, at least Gecko and Blink copies inline elements for keeping same style in new paragraph. For example, |<p><b>foo[]</b></p>| will be |<p><p>foo</b></p><p><b>[]<br></b></p>|. I think that this behavior makes sense.

Oddly, if |<b>| is |<a href="">|, Blink doesn't copy it and Gecko didn't do it too (but currently, we changed the behavior accidentally, we will take the old behavior back *1). I feel that this must be better for users since users must not want to keep creating same link in new paragraph in most cases. So, perhaps, this should also be speced.

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

Here are some testcases:

at end of text node:
https://jsfiddle.net/d_toybox/x0kohuo0/8/ (|<b>|)
https://jsfiddle.net/d_toybox/x0kohuo0/9/ (|<a name="foo">|)
https://jsfiddle.net/d_toybox/x0kohuo0/16/ (|<a href="foo">|)

at after text node:
https://jsfiddle.net/d_toybox/x0kohuo0/11/ (|<b>|)
https://jsfiddle.net/d_toybox/x0kohuo0/12/ (|<a href="foo">|)

nested case:
https://jsfiddle.net/d_toybox/x0kohuo0/13/ (|<b><a href="foo">|)
https://jsfiddle.net/d_toybox/x0kohuo0/14/ (|<b><i>|)
https://jsfiddle.net/d_toybox/x0kohuo0/15/ (|<a href="foo"><i>|)

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the insertParagraph command definition at the linked execCommand specification section, then reproduce the linked jsfiddle cases in Gecko and Blink. Compare collapsed selections at the ends of b, a, and nested inline elements, and update the specification only after the intended behavior is established for these cases.

Written by the indexing model from the issue text.

Assessment

Tech stack
html
Domain
frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
32/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.