block-content-to-react icon indicating copy to clipboard operation
block-content-to-react copied to clipboard

Improve error handling in BlockContent

Open balazsorban44 opened this issue 4 years ago • 4 comments

The title says it all, I was curious if it would be a good idea to be able to either set an ENV variable or send a prop to the block renderer, so if NODE_ENV !== "production", only write missing serializer types errors to the console, instead of throwing. I am working in Next.js, and these errors cause the app to crash if BlockContent throws an error on server-side. We cannot add all the serializer types at once.

balazsorban44 avatar May 01 '20 21:05 balazsorban44

I'm also affected by this. My issue was that I was using the build in sanity reference type in a block. The block content for some reason didn't know how to handle this and would crash the entire application in the preview.

Strangely, the reference was a child of another block and it was the top-level block that was complaining when nothing had been added. I think it was something to do with the preview and fetching new data from sanity.

I "fixed" by adding a serialiser for the reference at the top level of the application. Seems to still be rendering the array references on the next level down so I'm happy.

Some sort of option to render as a fallback or some error handling built in would be a more desirable option to console.error, I think. The built in React error boundaries don't help in my case because the error was caused as a result of an async action.

richardvanbergen avatar May 04 '20 02:05 richardvanbergen

It would be nice to have a prop to handle unknown schema types, e.g. unknownType where the default behavior is to do the exact thing it is currently doing right now: throw, but allow a react component to specified.

Why?

  • Current behavior is preserved, so no backward compatibility issues introduced.
  • Allows the developers to better work as teams allowing creation and usage of new schema without causing pages to crash if the developer's branch isn't aware of it yet. This is providing the developer opts in by defining a component that can do things such as draw a placeholder, complain to sentry, console log errors, or whatever the developer decides.
  • Much nicer than the current "wait for a teammate to break my page, then stub out their new schema type on my branch" approach.

xiata avatar Jun 01 '20 18:06 xiata

I really like the idea by @xiata!

balazsorban44 avatar Jun 01 '20 19:06 balazsorban44

Looks like there is already an open issue similar to this #10

balazsorban44 avatar Jun 01 '20 19:06 balazsorban44

Closing this, as the new @portabletext/react library is the successor to this module. Please see https://github.com/portabletext/react-portabletext

rexxars avatar Jan 31 '23 01:01 rexxars