syntax-tree/hast-util-from-html

`type="anything"` is parsed as child instead of property

albinekb opened this issue · 4 comments

albinekb commented

Initial checklist

Affected packages and versions

hast-util-from-html@2.0.3

Link to runnable example

https://github.com/albinekb/hast-unknown-node-repro/blob/main/index.ts

Steps to reproduce

import { fromHtml } from 'hast-util-from-html'
const tree = fromHtml('<button type="login">Hello</button>', { fragment: true })

Expected behavior

Parses like any other property:

{
  type: 'root',
  children: [
    {
      type: 'element',
      tagName: 'button',
      properties: { type: 'login' },
      children: [
        {
          type: 'text',
          value: 'Hello',
          position: {
            start: { line: 1, column: 23, offset: 22 },
            end: { line: 1, column: 28, offset: 27 }
          }
        }
      ],
      position: {
        start: { line: 1, column: 1, offset: 0 },
        end: { line: 1, column: 37, offset: 36 }
      }
    }
  ],
  data: { quirksMode: false },
  position: {
    start: { line: 1, column: 1, offset: 0 },
    end: { line: 1, column: 37, offset: 36 }
  }
}

Actual behavior

Putting anything else than "submit", "reset", "button" in type="", moves the property from the properties to being a child:

{
  type: 'root',
  children: [
    {
      type: 'element',
      tagName: 'button',
      properties: {},
      children: [
        { type: 'login' }, // <=== Should not be here?
        {
          type: 'text',
          value: 'Hello',
          position: {
            start: { line: 1, column: 22, offset: 21 },
            end: { line: 1, column: 27, offset: 26 }
          }
        }
      ],
      position: {
        start: { line: 1, column: 1, offset: 0 },
        end: { line: 1, column: 36, offset: 35 }
      }
    }
  ],
  data: { quirksMode: false },
  position: {
    start: { line: 1, column: 1, offset: 0 },
    end: { line: 1, column: 36, offset: 35 }
  }
}

If i put more attributes on the button:

fromHtml('<button aria-type="button" type="broken" disabled>Hello</button>', { fragment: true })

The other attributes gets added to the erroneous child:


    {
      type: 'element',
      tagName: 'button',
      properties: {},
      children: [
        { 'aria-type': 'button', type: 'broken', disabled: '' },
        {
          type: 'text',
          value: 'Hello',
          position: {
            start: { line: 1, column: 50, offset: 49 },
            end: { line: 1, column: 55, offset: 54 }
          }
        } 
      ]

Affected runtime and version

node@20.12.2

Affected package manager and version

pnpm@9.13.2

Affected OS and version

No response

Build and bundle tools

esbuild

albinekb commented

Update, after more investigation, it looks like I filed this under the wrong package again:

syntax-tree/hast-util-from-parse5@main...albinekb:hast-util-from-parse5:unknown-attribute-test

hast-util-from-parse5 seems to be the source of the error..

Update:

Found the line:https://github.com/syntax-tree/hastscript/blob/2a7451dc1eb2adc6b07af6efed8a8bdcc8f13758/lib/create-h.js#L166

Seems to be fixed in hastscript 9.0.0? syntax-tree/hastscript@8a5f97e

  • ❤️1
github-actions commented

Hi! This was closed. Team: If this was fixed, please add phase/solved. Otherwise, please add one of the no/* labels.

github-actions commented

Hi team! Could you describe why this has been marked as external?

Thanks,
— bb

wooorm commented

Released in hast-util-from-parse5@8.0.2, thanks!

  • ❤️1
  • 🚀1