Components don't render in html.for

[shiftyp]

Description:

When using html.for(...) to render keyed elements, passing a uland Component, either directly or through a nested html template, does not render.

Expected Behavior

The Component should render within keyed elements

Reproduction

Here is a modified codepen from the uhtml html.for(...) example. The key bit is reproduced below, along with the output:

Code

const Name = Component((name) => html`<span>${name}</span>`)
const update = (items) => {
  const ref = document.querySelector('.list-items');
  render(ref, html`
    <ul>
      ${items.map(
        ({id, name}) =>
          html.for(ref, id)`<li data-id=${id}>${Name(name)}</li>`
      )}
    </ul>`
  );
};

Output

[WebReflection]

Thanks for providing a minimal use-case example, it really helps!

I can confirm the behavior is not expected, so please bear with me, I'll fix this ASAP 👍

[WebReflection]

@shiftyp thee was a silly mistake within the code, and it got fixed. Everything should be fine now 👋