• Check if updating to the latest Preact version resolves the issue

Describe the bug

@DAreRodz discovered in our experiments that Preact recreates the DOM nodes of a keyed list (instead of preserving them) if the component with the key has multiple DOM node children.

It's easier to see than to explain, so here is a video:

I've used a text node ({''}) in the example because it's the simplest, but it happens with any node. For example:

const User = ({ name, surname }) => {
  return (
    <>
      <span>Name: {name}</span>
      <span>Surname: {surname}</span>
    </>
  );
};

To Reproduce

• Stackblitz with reproduction in Preact

Steps to reproduce the behavior:

1. Create a list
2. Create a component to encapsulate the items
3. Add the key in that component
4. If the component has multiple children, the DOM nodes are not preserved

Expected behavior

Preact should preserve the DOM nodes.

For reference, this is the exact same code using React: Stackblitz with React