editorjs-html icon indicating copy to clipboard operation
editorjs-html copied to clipboard

Nested list (<ul>, <ol>) should be child of <li>, not sibling

Open karloku opened this issue 2 years ago • 1 comments

Expected behaviour

Given nested list as below

- Green
  1. Lime
  2. Mint
- Red
  - Garnet
  - Crimson
- Blue

Should be parsed into

<ul>
  <li>
    Green
    <ol>
      <li>Lime</li>
      <li>Mint</li>
    </ol>
  </li>
  <li>
    Red
    <ul>
      <li>Garnet</li>
      <li>Crimson</li>
    </ul>
  </li>
  <li>Blue</li>
</ul>

<ul> and <ol> should be child of <li>

Actual behaviour

<ul> and <ol> were parsed as siblings of <li>

<ul>
  <li>Green</li>
  <ol>
    <li>Lime</li>
    <li>Mint</li>
  </ol>
  <li>Red</li>
  <ul>
    <li>Garnet</li>
    <li>Crimson</li>
  </ul>
  <li>Blue</li>
</ul>

This could cause some problems:

  1. In W3C standards <ul> and <ol> cound only have zero or more <li> as their content. Nesting <ul> and <ol> directly is not correct (would fail validation by The Nu Html Checker).
  2. The official @editorjs/nested-list handles html (NestedList.pasteHandler) in the W3C way, making current result not handleable by the official NestedList component.

karloku avatar Aug 23 '23 11:08 karloku

This issue was resolved in #50. Please close this @pavittarx.

Luzefiru avatar Mar 21 '24 14:03 Luzefiru