Crash when using validation

[frederikgdl]

When using validation for a field with type colorlist and the validation fails there is a warning icon next to the field label in the studio. When hovering over the icon the studio crashes with the error Error: flushSync was called from inside a lifecycle method. It cannot be called when React is already rendering.

This can be recreated by creating a new studio with for instance the blog template. Then add the example field from the readme and add validation.

{
    title: "Color List",
    description: "Pick a color",
    name: "colors",
    type: "colorlist",
    options: {
      list: [
        { title: "Red", value: "#f16d70" },
        { title: "Teal", value: "#88c6db" },
        { title: "Purple", value: "#aca0cc" },
        { title: "Green", value: "#bdcdcb" },
        { title: "White", value: "white" },
      ],
    },
    validation: (Rule) => Rule.required(),
  },

When creating a document the warning icon appears, when hovering over the icon the studio crashes.

I'm using the following versions:

@sanity/cli                   2.35.0 (up to date)
@sanity/base                  2.35.0 (up to date)
@sanity/core                  2.35.0 (up to date)
@sanity/default-layout        2.35.0 (up to date)
@sanity/default-login         2.35.0 (up to date)
@sanity/desk-tool             2.35.1 (up to date)
@sanity/eslint-config-studio   2.0.1 (up to date)
@sanity/vision                2.35.0 (up to date)

Node and npm

v16.17.0
8.19.2

[adam-rocska]

Not only when you use validation. Wtf.
We only added this utility to a simple plain old field. No validation no nothin', and still get this bug...

[martosijoe]

I have also experienced this issue. :( Sadly I am not even using validation.

[fvieira]

Not sure if this applies to everyone, but we noticed that this bug only happens in development. It is still annoying and confusing, but at least does prevent the lib from being used successfully in production.

[quentin-f451]

It seems that this only happens with tooltip option set to true actually.