Use `hast-util-from-dom` in the browser

[remcohaszing]

Initial checklist

• I read the support docs
• I read the contributing guide
• I agree to follow the code of conduct
• I searched issues and couldn’t find anything (or linked relevant results below)

Problem

parse5 and hast-util-from-parse5 are quite big. Bundle size could be decreased by using hast-util-from-dom instead in a browser condition.

Solution

Make this package export a solution based on hast-util-from-dom for the browser using an export map.

Alternatives

Create a new wrapper package that uses hast-util-from-dom or hast-util-from-html conditionally.

If a wrapper package is created, should rehype-parse use that?

[wooorm]

That would not have support for positional info, and it would mean the parsing is dependent on the current actual browser (which is often fine, but might not always be). More info: https://github.com/syntax-tree/hast-util-from-dom#when-should-i-use-this.

I think a conditional package is better. And that package should remove positional info in the server case to make the output more similar too probably

[wooorm]

I did have this need before too btw, think it’d be super useful to solve this 👍

[remcohaszing]

That would not have support for positional info, and it would mean the parsing is dependent on the current actual browser (which is often fine, but might not always be).

Ah yes, that makes perfect sense!

I think this fits within the scope of the syntax-tree organization, right?

What should the package be called? hast-util-from-html-isomorphic? I’m open to suggestions.

I currently don’t have the time. I’ll create it later this week.

---

I’m closing this issue, as it’s no longer relevant for this repository.

[github-actions]

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

[wooorm]

Yep!
As we don’t have positional info, I think this package fits perfectly within this organization, but doesn’t fit with the higher level things like rehype.
As ASTs without positional info are great for injecting into existing trees, as those are “generated” nodes.
But not for the entire tree, when processed with rehype or so

---

hast-util-from-html-isomorphic

On the name, I dunno. I don’t think this is great. But I don’t have an alternative. So, sure!

[remcohaszing]

hast-util-from-html-isomorphic

On the name, I dunno. I don’t think this is great. But I don’t have an alternative. So, sure!

I feel the same way. If something comes to mind before I publish, please let me know.

---

Just some additional context: This is part of an effort to update remark-mermaidjs to the latest version of mermaid, create an additional package rehype-mermaid, and reuse some of that logic. :)

[wooorm]

For reference, future reader, it exists!: https://github.com/syntax-tree/hast-util-from-html-isomorphic