blitz-js / babel-plugin-superjson-next

Automatically transform your Next.js Pages to use SuperJSON
MIT License
125 stars 15 forks source link

Should I be expecting props to be automatically deserialized? #28

Closed samuelgoldenbaum closed 3 years ago

samuelgoldenbaum commented 3 years ago

Question here.

Should I be expecting props to be automatically deserialized? Given the code below, my props come through as:

props {
  json: { authors: [ [Object], [Object] ] },
  meta: {
    values: {
      'authors.0.createdAt': [Array],
      'authors.0.updatedAt': [Array],
      'authors.1.createdAt': [Array],
      'authors.1.updatedAt': [Array]
    }
  }
}

Example Code:

const Page = (props: InferGetStaticPropsType<typeof getStaticProps>) => {
    console.info('props', props);

    return (
        <>
            {props.authors && props.authors.map((author: Author) => (
                <li key={author.id}>{author.name}</li>
            ))}
        </>
    )
}

export async function getStaticProps() {
    const authors: Author[] = await getList();

    return {
        props: {
            authors: authors
        }
    }
}

.baberc:

{
  "presets": [
    "next/babel"
  ],
  "plugins": ["superjson-next"]
}
Skn0tt commented 3 years ago

Should I be expecting props to be automatically serialized?

Yes, that's how this plugin is supposed to work.

On which version are you? Are you using Windows?

samuelgoldenbaum commented 3 years ago

Should I be expecting props to be automatically serialized?

Yes, that's how this plugin is supposed to work.

On which version are you? Are you using Windows?

On Mac, will create a simple test repo and try to see if there is something that may be conflicting

flybayer commented 3 years ago

@Skn0tt reproduction in a blitz example app: https://github.com/blitz-js/blitz/commit/a9c49351ab53875e84f19f9cb42ac6a0cf3f07a9

  1. yarn build
  2. cd examples/store
  3. blitz prisma generate && blitz start
  4. Go to http://localhost:3000/products/ssr
flybayer commented 3 years ago

The issue is that withSuperJSONPage() HOC is only added in the server build, not the client build. So in dev mode for example, the initial render on the server is success, but then the render on the client fails.

image