Unable to add registration mark to Lexical editor

[DesignyourCode]

trafficstars

Describe the Bug

When I add a registration mark ® to the lexical editor I get the following:

ERROR: invalid byte sequence for encoding "UTF8": 0xae
    err: {
      "type": "DatabaseError",
      "message": "invalid byte sequence for encoding \"UTF8\": 0xae",
      "stack":
          error: invalid byte sequence for encoding "UTF8": 0xae
              at eval (webpack-internal:///(rsc)/./node_modules/.pnpm/[email protected]/node_modules/pg/lib/client.js:526:17)
              at process.processTicksAndRejections (node:internal/process/task_queues:105:5)
              at async eval (webpack-internal:///(rsc)/./node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected][email protected]/node_modules/drizzle-orm/node-postgres/session.js:96:22)
              at async Object.insert (webpack-internal:///(rsc)/./node_modules/.pnpm/@[email protected]_@[email protected][email protected][email protected]_mon_4xutdrqpzxdbkpmh7shhtpfdfe/node_modules/@payloadcms/drizzle/dist/postgres/insert.js:11:18)
              at async upsertRow (webpack-internal:///(rsc)/./node_modules/.pnpm/@[email protected]_@[email protected][email protected][email protected]_mon_4xutdrqpzxdbkpmh7shhtpfdfe/node_modules/@payloadcms/drizzle/dist/upsertRow/index.js:238:44)
              at async Object.updateOne (webpack-internal:///(rsc)/./node_modules/.pnpm/@[email protected]_@[email protected][email protected][email protected]_mon_4xutdrqpzxdbkpmh7shhtpfdfe/node_modules/@payloadcms/drizzle/dist/update.js:49:20)
              at async updateByIDOperation (webpack-internal:///(rsc)/./node_modules/.pnpm/[email protected][email protected][email protected][email protected]_va5mycf4t2ayy5zkactcivw7na/node_modules/payload/dist/collections/operations/updateByID.js:279:22)
              at async Object.updateByID (webpack-internal:///(rsc)/./node_modules/.pnpm/@[email protected][email protected][email protected][email protected]_react-dom@19._s7iylsmqcvtsisjmcvxqpy7enm/node_modules/@payloadcms/next/dist/routes/rest/collections/updateByID.js:37:15)
              at async eval (webpack-internal:///(rsc)/./node_modules/.pnpm/@[email protected][email protected][email protected][email protected]_react-dom@19._s7iylsmqcvtsisjmcvxqpy7enm/node_modules/@payloadcms/next/dist/routes/rest/index.js:760:19)
              at async AppRouteRouteModule.do (/Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:10:33313)
              at async AppRouteRouteModule.handle (/Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:10:40382)
              at async doRender (/Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/server/base-server.js:1455:42)
              at async responseGenerator (/Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/server/base-server.js:1814:28)
              at async DevServer.renderToResponseWithComponentsImpl (/Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/server/base-server.js:1824:28)
              at async DevServer.renderPageComponent (/Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/server/base-server.js:2240:24)
              at async DevServer.renderToResponseImpl (/Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/server/base-server.js:2278:32)
              at async DevServer.pipeImpl (/Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/server/base-server.js:960:25)
              at async NextNodeServer.handleCatchallRenderRequest (/Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/server/next-server.js:281:17)
              at async DevServer.handleRequestImpl (/Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/server/base-server.js:853:17)
              at async /Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/server/dev/next-dev-server.js:373:20
              at async Span.traceAsyncFn (/Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/trace/trace.js:153:20)
              at async DevServer.handleRequest (/Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/server/dev/next-dev-server.js:370:24)
              at async invokeRender (/Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/server/lib/router-server.js:183:21)
              at async handleRequest (/Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/server/lib/router-server.js:360:24)
              at async requestHandlerImpl (/Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/server/lib/router-server.js:384:13)
              at async Server.requestListener (/Users/tomclarke/Documents/Clients/andanotherday/andanotherday-payload/node_modules/.pnpm/[email protected][email protected][email protected]__react@19_fp54jxyuxeln2xmzrtvqhtxduu/node_modules/next/dist/server/lib/start-server.js:142:13)
      "length": 146,
      "name": "error",
      "severity": "ERROR",
      "code": "22021",
      "where": "unnamed portal parameter $5",
      "file": "mbutils.c",
      "line": "1720",
      "routine": "report_invalid_encoding"
    }

Link to the code that reproduces this issue

https://github.com/payloadcms/payload/tree/main/templates/website

Reproduction Steps

I am just running a copy of the standard website locally at the moment with no template with no changes.

Just add a symbol into the content editor: ® and it will error

Which area(s) are affected? (Select all that apply)

plugin: richtext-lexical

Environment Info

Binaries:
  Node: 20.16.0
  npm: 10.8.1
  Yarn: 1.22.19
  pnpm: 9.12.3
Relevant Packages:
  payload: 3.0.0-beta.134
  next: 15.0.3
  @payloadcms/db-postgres: 3.0.0-beta.134
  @payloadcms/email-nodemailer: 3.0.0-beta.134
  @payloadcms/graphql: 3.0.0-beta.134
  @payloadcms/live-preview: 3.0.0-beta.134
  @payloadcms/live-preview-react: 3.0.0-beta.134
  @payloadcms/next/utilities: 3.0.0-beta.134
  @payloadcms/payload-cloud: 3.0.0-beta.134
  @payloadcms/plugin-cloud-storage: 3.0.0-beta.134
  @payloadcms/plugin-form-builder: 3.0.0-beta.134
  @payloadcms/plugin-nested-docs: 3.0.0-beta.134
  @payloadcms/plugin-redirects: 3.0.0-beta.134
  @payloadcms/plugin-search: 3.0.0-beta.134
  @payloadcms/plugin-seo: 3.0.0-beta.134
  @payloadcms/richtext-lexical: 3.0.0-beta.134
  @payloadcms/storage-vercel-blob: 3.0.0-beta.134
  @payloadcms/translations: 3.0.0-beta.134
  @payloadcms/ui/shared: 3.0.0-beta.134
  react: 19.0.0-rc-65a56d0e-20241020
  react-dom: 19.0.0-rc-65a56d0e-20241020
Operating System:
  Platform: darwin
  Arch: x64
  Version: Darwin Kernel Version 24.0.0: Tue Sep 24 23:36:30 PDT 2024; root:xnu-11215.1.12~1/RELEASE_X86_64
  Available memory (MB): 16384
  Available CPU cores: 12

[rilrom]

I have been unable to replicate this in v3.0.2 using postgres in the website template.

® in UTF-8 encoding would be 0xC2 0xAE. Since in your case it is only 0xAE, it's using something like Latin-1 or Windows-1252 encoding, which is causing a mismatch between server and client.

[DesignyourCode]

Hi @rilrom - I have upgrade my local site to 3.1.1 as that is the latest and can confirm that I am no longer getting the issue I was getting when running the beta version. I can see there's been a lot of improvements to the Lexical editor in the last few versions so I think this issue is now resolve.

I will close this ticket. Thank you for responding. Amazing work to you and the Payload team

[github-actions[bot]]

This issue has been automatically locked. Please open a new issue if this issue persists with any additional detail.