Ref gets lost during prepass?

[dios-david]

I'm not sure whether this is a preact-ssr-prepass or a Preact bug, but I report here first :)

I'm migrating a project from React to Preact and I noticed a weird difference in prepass during SSR. I know Preact is not guaranteed to be fully compatible with React, so maybe this is not a bug at all :)

But looks like ref values get lost when using Suspense on SSR. Take this component as an example:

const App = () => {
  const initialised = useRef(false);

  console.log("initialised", initialised.current);

  if (!initialised.current) {
    initialised.current = true;
  }

  const [{ data }] = useQuery({
    query: `
      {
        country(code: "HU") {
          name
        }
      }
    `
  });

  return <span>{data.country.name}</span>;
};

What happens here is when the component is getting rendered in prepass:

1. Component sets initialised ref to true (it's false by default)
2. useQuery uses Suspense, so it throws a promise
3. Once the promise is resolved, the component gets rendered again
4. initialised ref value got lost, it's false again (with React it's still true)

To Reproduce with Preact

Sandbox with Preact: https://codesandbox.io/s/preact-ref-bug-preact-lswel?file=/src/App.js

1. Go to http://localhost:3000
2. Check console in the node app

The output is:

prepass start
initialised false
initialised false
prepass end

Expected behaviour with React

Sandbox with React: https://codesandbox.io/s/preact-ref-bug-react-h6ukj?file=/src/App.js

1. Go to http://localhost:3000
2. Check console in the node app

The output is:

prepass start
initialised false
initialised true
prepass end

Let me know if you need more details!

[dios-david]

This is fixed by #24