µhtml.node -> valueOf() and remove()

[Mike Kidder]

I will preface this by saying I don't plan on using html.node but the documentation mentions following:

µhtml fragments have also two special methods: valueOf(), that allow you to move all nodes initially assigned to the fragment somewhere else, or remove(), which would remove all nodes initially assigned in one shot.

Codepen Sample

I could not get it work, when:

• single sibling -> HTMLElement
  • Uncaught TypeError: Failed to execute 'removeChild' on 'Node': parameter 1 is not of type 'Node
• multiple siblings -> DocumentFragment
  • Uncaught TypeError: fragment2.remove is not a function

Not sure if functions are still valid, or am missing something fundamental?

[Andrea Giammarchi]

This is a misunderstanding maybe worth clarifying in the REDME.

The html.node is an utility to create real DOM nodes and the wire is not a DOM node so it cannot be used directly as such.

Accordingly, the valueOf() and remove() works with html and html.ref(...) but not with html.node, as I don't want to attach live methods to fragments as that'd be misleading in terms of DOM behavior, and html.node is about such DOM behavior.

Don't use html.node unless you really need it, which is 0.01% of the cases (it's just an extra helper that I regret I've exposed as it keeps being misused).

[Andrea Giammarchi]

To clarify my latter point:

const createWire = () => html`
  <button>1</button>
  <button>2</button>
`;

Internally, above wier will be "unrolled" as pseudo fragment and handled accordingly while diffing ... but this is an implementation detail you shouldn't care about, or use, unless you are extending the library somehow (see uland).