Route component={Home} vs component={<Home />}

[xenohim]

Describe the bug

These two codes run fine :

render(() => (
    <Router>
        <Route path="/" component={Test} />
    </Router>
), root);

render(() => (
    <Router>
        <Route path="/" component={<Test />} />
    </Router>
), root);

However, the moment you use any route hook, the second code fails.

Your Example Website or App

X

Steps to Reproduce the Bug or Issue

Run the code

Expected behavior

It should either fails every time or works every time.

Screenshots or Videos

No response

Platform

• OS: [e.g. macOS, Windows, Linux]
• Browser: [e.g. Chrome, Safari, Firefox]
• Version: [e.g. 91.1]

Additional context

No response

[ryansolid]

Yeah.. it should never be:

render(() => (
    <Router>
        <Route path="/" component={<Test />} />
    </Router>
), root);

We are expecting component functions. It's a shame if the typescrupt can't determine the difference.

Expressions in Solid lazy evaluate so you aren't going to hit this probably until you go to the route. So this all makes sense.

From a runtime perspective it should be trying to call it with the route props