Bug Rending <div><div><div> </div></div></div>

[yzhou88]

Rendering <div><div><div></div></div></div> Gives this result: </div>

Please try it in the playground. Playground

[yzhou88]

Looks like it is caused by the regular expression. But it is too complicated to fix:

const HTML_BLOCK_ELEMENT_R = /^ *(?!<[a-z][^ >/]* ?\/>)<([a-z][^ >/]*) ?([^>]*)\/{0}>\n?(\s*(?:<\1[^>]*?>[\s\S]*?<\/\1>|(?!<\1)[\s\S])*?)<\/\1>\n*/i

Can the author fix this issue?

[joehe00]

It resolves the issue mentioned in the original ticket, but failed for test below and generate string:

<div><div><div></div><div></div></div><pre><code>&lt;/div&gt;</code></pre></div>

  it('', () => {
    render(compiler(`<div>
    <div><div></div></div>
    </div>`))

    expect(root.innerHTML).toMatchInlineSnapshot(`
      <div>
        <div>
          <div>
          </div>
        </div>
      </div>
    `)
  })