search

WordPress / gutenberg

The Block Editor project for WordPress and beyond. Plugin is available from the official repository.
https://wordpress.org/gutenberg/
Other
10.37k stars 4.15k forks source link

Customize Widgets: Editor hides when selecting some blocks #62898

Closed talldan closed 3 months ago

talldan commented 3 months ago

Description

The customize widgets editor disappears leaving only a grey panel when selecting some blocks (paragraph works ok, blocks like image or latest posts cause an issue)

Step-by-step reproduction instructions

  1. Activate a classic theme like Twenty Twenty One
  2. Go to Customize > Widgets
  3. Select a non-paragraph block

Expected: The block is selected and is still visible: Screenshot 2024-06-27 at 12 18 12 pm

Actual: The editor disappears like this:

https://github.com/WordPress/gutenberg/assets/677833/9aa211c5-1fd4-47ba-9910-0b1a12e5ff02

Or maybe more like this: homer disappear

Screenshots, screen recording, code snippet

No response

Environment info

It seems to only happen with the Gutenberg plugin active. It's ok when I check WP6.6

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

andrewserong commented 3 months ago

I ran a git bisect which points to https://github.com/WordPress/gutenberg/pull/61943/ as the PR that introduced the regression in the widgets screen within the customizer.

From manually reverting part of that PR (just the addition of <StrictMode> in customize-widgets/src/index.js), I can get it working again locally.

@Mamaduka do you have an idea why the strict mode might affect this, and/or what a potential fix might be? I don't know much about strict mode, so that PR being the cause seemed a bit of a surprise to me!

andrewserong commented 3 months ago

Also, I double-checked and #61943 wasn't included in WP 6.6, and this feature appears to be working fine in 6.6 RC 1, so it looks like it's just Gutenberg that's affected.

talldan commented 3 months ago

It's probably related to the way strict mode re-runs effects to find bugs - https://react.dev/reference/react/StrictMode#fixing-bugs-found-by-re-running-effects-in-development.

So there might be an effect that works ok when it's run once, but the second run causes this issue.

The good thing is that it won't be an issue for production versions of code.

Mamaduka commented 3 months ago

Thanks for the ping!

Yeah, it's probably an effect or non-pure component issue, which StrictMode just highlighted. I fixed some bugs that the e2e tests caught.

I am assigning this to myself and will have a look later.

andrewserong commented 3 months ago

Thanks so much!