CompatRoute doesn't render at all

[RedHatter]

I'm trying to use react-router-dom-v5-compat to upgrade from v5 to v6 however I can't get any CompatRoute to render. Below I've included the simplest usage of CompatRoute trying to narrow down the problem.

import type { FC } from 'react';
import { BrowserRouter, Switch } from 'react-router-dom';
import { CompatRoute, CompatRouter } from 'react-router-dom-v5-compat';

const About: FC = () => <h1>About</h1>;

const App: FC = () => (
  <BrowserRouter>
    <CompatRouter>
      <Switch>
        <CompatRoute path="/about" element={<About />} />
      </Switch>
    </CompatRouter>
  </BrowserRouter>
);

The about route above does not render. Am I missing something? I have looked over the docs, migration guide, and everything else I could find but I don't see any reason this shouldn't work.

sandbox link

[SamSverko]

Looks like changing the element prop to component works for me:

<CompatRoute path="/about" component={About} />

Results:

Important

Don't forget to visit the /about route (i.e. "https://sandbox-url-stuff.webcontainer.io/about") in the sandbox's URL! Your sandbox links to the index page - which has a path of /.