Hydration warning when editing a published item

[ersinakinci]

Describe the bug I get the following warning when editing a published item: Warning: Prop builder-inline-styles did not match. Server: "null" Client: "". It appears to only affect the Visual Editor.

Content item: https://builder.io/content/87aaf4bc20b140f98ba3db2aba959453 Server: https://github.com/ersinakinci/hydration-test

I believe it's related to: https://github.com/BuilderIO/builder/blob/c2663237c83435c04d92e6b81d658e5759e9396b/packages/react/src/components/builder-block.component.tsx#L519-L527

The Builder.isEditing check means that the attribute doesn't get created server-side. However, naively adding Builder.isServer to the conditional creates a new warning from Next.js about how the server sent an "extra attribute" with a psuedo-random name.

To Reproduce Steps to reproduce the behavior:

1. Clone the server, npm i && npm run dev.
2. Open up the content item link.
3. Observe the error in the browser's JS console.

Expected behavior

There shouldn't be any warnings.

cc: @shyam-builder

[mrkoreye]

@ersinakinci is this a blocking issue? As in, does it prevent you from editing or publishing content?

[ersinakinci]

@mrkoreye sorry I missed your comment earlier!

It doesn't appear to be a blocker. I've been working through many hydration issues similar to this one and some of them have been blocking me, so it wasn't clear at first. @shyam-builder's recent updates have fixed those other issues and I'm no longer blocked.

[ersinakinci]

Also it seems that the issue is fixed on this particular content item. I'm still seeing the warning on other content items for my clients but it doesn't seem to block.