Replicache Todo example app throws errors

Ahineya commented 2 years ago

Hi, Went step-by-step with the https://doc.replicache.dev to set up the todo app. The app is running, but the collaboration does not work. Are there any additional steps needed to be done?

% npm run dev                                                                  

> nextjs@0.1.0 dev
> next dev

ready - started server on 0.0.0.0:3000, url: http://localhost:3000
info  - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5
Browserslist: caniuse-lite is outdated. Please run:
npx browserslist@latest --update-db

Why you should do it regularly:
https://github.com/browserslist/browserslist#browsers-data-updating
event - compiled successfully
Attention: Next.js now collects completely anonymous telemetry regarding usage.
This information is used to shape Next.js' roadmap and prioritize features.
You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
https://nextjs.org/telemetry

event - build page: /
wait  - compiling...
event - compiled successfully
event - build page: /d/[id]
wait  - compiling...
event - compiled successfully
Warning: viewport meta tags should not be used in _document.js's <Head>. https://nextjs.org/docs/messages/no-document-viewport-meta
event - build page: /next/dist/pages/_error
wait  - compiling...
event - compiled successfully
Warning: viewport meta tags should not be used in _document.js's <Head>. https://nextjs.org/docs/messages/no-document-viewport-meta
event - build page: /api/replicache-pull
wait  - compiling...
event - compiled successfully
Processing pull "{\"profileID\":\"p26c0d1259e714a49a1b59f906c3e4807\",\"clientID\":\"ab465aad-6243-4255-9db1-561b5d6f8081\",\"cookie\":null,\"lastMutationID\":0,\"pullVersion\":0,\"schemaVersion\":\"\"}"
ZodError: [
  {
    "code": "invalid_type",
    "expected": "object",
    "received": "string",
    "path": [],
    "message": "Expected object, received string"
  }
]
    at handleResult (/Users/ahineya/projects/boardly/node_modules/zod/lib/types.js:28:23)
    at ZodObject.safeParse (/Users/ahineya/projects/boardly/node_modules/zod/lib/types.js:140:16)
    at ZodObject.parse (/Users/ahineya/projects/boardly/node_modules/zod/lib/types.js:120:29)
    at __webpack_exports__.default (webpack-internal:///./pages/api/replicache-pull.ts:16:28)
    at apiResolver (/Users/ahineya/projects/boardly/node_modules/next/dist/next-server/server/api-utils.js:8:7)
    at runMicrotasks (<anonymous>)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async DevServer.handleApiRequest (/Users/ahineya/projects/boardly/node_modules/next/dist/next-server/server/next-server.js:66:462)
    at async Object.fn (/Users/ahineya/projects/boardly/node_modules/next/dist/next-server/server/next-server.js:58:580)
    at async Router.execute (/Users/ahineya/projects/boardly/node_modules/next/dist/next-server/server/router.js:25:67) {
  issues: [
    {
      code: 'invalid_type',
      expected: 'object',
      received: 'string',
      path: [],
      message: 'Expected object, received string'
    }
  ],
  addIssue: [Function (anonymous)],
  addIssues: [Function (anonymous)]
}

aboodman commented 2 years ago

This is odd. It looks like the type of req.body in replicache-pull.ts is string not Object as expected. I believe Next.js detects the correct type by the content-type header sent to replicache-pull. Replicache is supposed to send Content-Type: application/json and in my dev inspector I can see that to be the case. Do you see something different?

Ahineya commented 2 years ago

@aboodman Yep, no Content-Type header in my case:

aboodman commented 2 years ago

What is the body payload? Also what browser is this?

aboodman commented 2 years ago

Nevermind browser question, I see the user agent.

Ahineya commented 2 years ago

The payload is:

{"profileID":"p26c0d1259e714a49a1b59f906c3e4807","clientID":"ecf3e1f8-6839-47bf-bd1d-d5a48cb87014","cookie":null,"lastMutationID":0,"pullVersion":0,"schemaVersion":""}

Ahineya commented 2 years ago

Ok, weird. I tried another browser, and it works now. If I find the cause of this behavior, I will update the ticket.

aboodman commented 2 years ago

Could it be an extension? I also noticed some cookies in the request body. Our sample doesn't add any cookies. Perhaps another clue.

Ahineya commented 2 years ago

@aboodman Yep, it was the extension. "Mokku" with a default configuration logs all requests to the localhost, and looks like breaks something.

Thanks for your help!

rocicorp / replicache

Replicache Todo example app throws errors #1003