Breaking change in behavior in interpolation (or bug?) 7.2.1 -> 8.1

Hi, I came across this when upgrading to Preact 8 recently. I’m not sure of bug or new feature 😸 but I didn’t find anything about it in the migration docs.

Open console and execute these two gists.

First 8.1: https://esnextb.in/?gist=7e1fb23c1b9d0dc43f1d6b9069ed5190 It logs ["xx", "Hello"].

Then 7.2.1: https://esnextb.in/?gist=e9b1d7c4da061b144c67d93291824d96 It logs: ["xxHello"]

The only difference is the Preact version.

(adding the important parts of the code below if esnextb.in goes away)

const val = 'xx'
render(<Comp>{val}Hello</Comp>, document.getElementById('app'))

[robertknight]

React renders a separate text node for each child:

import React from "react";
import { render } from "react-dom";

function App() {
  const two = "Two";
  return <div>One {two} Three</div>;
}

const root = document.querySelector("#app");
render(<App />, root);

Demo: https://codesandbox.io/s/ol0y4v26lq

Since Preact is consistent with React here and the current behaviour is easy to reason about, I think this issue can be closed. Please let me know if you can think of a strong reason to change this.

[developit]

Yeah, I’m stuck on that. I guess really the only thought here is “what does react do?”, and AFAIK it just treats children as whatever you pass, so it’d be the Array of strings/numbers/etc.