Allow an async component to return null rendering

[VanTanev]

The original description is inaccurate. It's kept after the horizontal line for posterity. Real issue is described here:

The issue is that Async component cannot render into a tree that's completely empty. So, for example:

const App = () => {
  return (
    <ErrorBoundry>
      <AuthProvider>
        <Router>
          <Route one>
          <Route two component={SomeAsyncComponent}> // the matching route
          <Route three>
        </Router>
      <AuthProvider>
    </ErrorBoundry>
  )
}

All the components except the Routes just render their children, and the routes render null when they do not match.
This results in a render tree that looks something like [null, <AsyncComponent>, null], which renders to whitespace initially and then fails to re-render properly when the async request completes.

The workaround is to have a concrete DOM node to render into, eg:

const App = () => {
  return (
    <div>
      <ErrorBoundry>
        <AuthProvider>
          <Router>
            <Route one>
            <Route two component={SomeAsyncComponent}> // the matching route
            <Route three>
          </Router>
        <AuthProvider>
      </ErrorBoundry>
    <div>
  )
}

Adding this wrapping <div> element makes the tree something like: [div, [null, <AsyncComponent> null]], which resolves properly.

Still, this PR will allow the first version of the code to work without issue.

---

Original issue description:

Currently, I have a custom router that does something like:

const Route = ({ component }) => {
  const auth = useAuth()
  if (auth.authenticated === false) {
    return <Redirect to="/login" />
  }

  return h(component, { params: calculateRouteParams() })
}

const Redirect = ({to}) => {
  history.push(to)
  return null // if I return any value here, it works
}

// in components/app.tsx
<Router>
  <Route component={AsyncComponent} />
</Router>

This results in the following error:

Error: Undefined component passed to createElement()

You likely forgot to export your component or might have mixed up default and named imports<#text dangerouslySetInnerHTML="[object Object]" />

  in #text
  in AsyncComponent
  in Route
  in Switch
  in Router
  in Auth
  in App

    at preact__WEBPACK_IMPORTED_MODULE_0__.options.__b (webpack-internal:///../node_modules/preact/debug/dist/debug.module.js:144:37)
    at preact__WEBPACK_IMPORTED_MODULE_1__.options.__b (webpack-internal:///../node_modules/preact/compat/dist/compat.module.js:104:78)
    at $ (webpack-internal:///../node_modules/preact/dist/preact.module.js:251:90)
    at m (webpack-internal:///../node_modules/preact/dist/preact.module.js:155:11)
    at $ (webpack-internal:///../node_modules/preact/dist/preact.module.js:265:387)
    at m (webpack-internal:///../node_modules/preact/dist/preact.module.js:155:11)
    at $ (webpack-internal:///../node_modules/preact/dist/preact.module.js:265:387)
    at m (webpack-internal:///../node_modules/preact/dist/preact.module.js:155:11)
    at $ (webpack-internal:///../node_modules/preact/dist/preact.module.js:265:387)
    at eval (webpack-internal:///../node_modules/preact/dist/preact.module.js:127:96)

The proposed change fixes the error.

Did you add tests for your changes?

No

Does this PR introduce a breaking change?

No

Other information

Environment Info:
  System:
    OS: Linux 4.15 Ubuntu 16.04.7 LTS (Xenial Xerus)
    CPU: (16) x64 Intel(R) Core(TM) i9-9900KS CPU @ 4.00GHz
  Binaries:
    Node: 14.8.0 - ~/.nvm/versions/node/v14.8.0/bin/node
    Yarn: 1.21.1 - /usr/bin/yarn
    npm: 6.14.7 - ~/.nvm/versions/node/v14.8.0/bin/npm
  Browsers:
    Chrome: 85.0.4183.121
    Firefox: 80.0.1
  npmPackages:
    preact: ^10.5.2 => 10.5.2 
    preact-cli: ^3.0.2 => 3.0.2 
    preact-render-to-string: ^5.1.10 => 5.1.10 

[changeset-bot]

🦋 Changeset detected

Latest commit: a95398d

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
preact-cli	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[VanTanev]

@developit If this helps with debug:
The content of me is this:

[VanTanev]

Worth noting, the problem exists only in dev, both with and without --refresh

[VanTanev]

@developit With your better fix in place, this should be merged?