Edit site is not working

[kafleg]

Description

While checking Twenty Twenty Two theme with the latest version of Gutenberg(org version) and while clicking on edit site, it isn't working. The blank page appears.

There is error in browser console, 
index.min.js?ver=8de1f6e7225b2fd27bb5d786ddbd16b8:15 
        
       Uncaught (in promise) TypeError: Cannot destructure property 'id' of '(intermediate value)' as it is null.
    at Ze (index.min.js?ver=8de1f6e7225b2fd27bb5d786ddbd16b8:15)
    at Ze.next (<anonymous>)
    at tt (index.min.js?ver=8de1f6e7225b2fd27bb5d786ddbd16b8:15)
    at tt.next (<anonymous>)
    at index.min.js?ver=79381db76ebb53a195b3b8fa77d1a91b:1

wp-content/plugins/gutenberg/build/edit-site/index.min.js?ver=8de1f6e7225b2fd27bb5d786ddbd16b8

Screenshot of the issue,

Step-by-step reproduction instructions

1. Install the latest WP
2. Install the latest Gutenberg from org
3. Install Twenty Twenty-Two theme from GitHub or install another FSE theme
4. Visit front page and click on Edit Site menu at the top

Screenshots, screen recording, code snippet

No response

Environment info

No response

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

[kafleg]

P.S.:
WordPress version used: 5.8.2
Gutenberg version: 11.9.1
Browser: Edge

None of the other plugins were installed.

[kafleg]

Also,
When checking from the Admin panel, it is not working from here too.

[Andrew-Starr]

It was broken in 11.9.0 (exactly same issue as in your attached screenshots) and then fixed in 11.9.1 #36516

Now in 11.9.1 I am unable to recreate the issue and the editor is working correctly when I test it.

[andrewstaffell]

I am experiencing the same problem with 11.9.1 and 5.8.2

[Andrew-Starr]

Attached video of the Editor working correctly with WP 5.8.2 & Gutenberg 11.9.1

I realised after recording that I was using Firefox but it still works correctly in Edge and Chrome.

2021-11-23.15-49-17.mp4

[ellenbauer]

I'm following here, since I have an Aino theme user who is reporting the same issue. I tested it in Chrome and I see the issue, too.

[michaelbonert]

Same problem here: Just a blank site when starting the editor. It stopped running after updating Gutenberg 11.8 to 11.9. Still not running with 12.0

WP: 5.8.2
Gutenberg: 12.0.1
Browser: Safari, Firefox and Chrome

[kafleg]

Hello All,
Would you please check once by changing the permalinks?

I had no idea how the Custom Structure permalink was selected in default. I changed it to the Post name and its working fine. Would you please see which permalink is selected under Settings > Permalink?

[michaelbonert]

I checked the permalinks: Post name was selected.

I changed it to Numeric -> Editor doesn't work
Changed it back to Post name -> Editor doesn't work

[michaelbonert]

Just updatet the Gutenberg Plugin to 12.0.2. Unfortunately, the editor doesn`t run here either. Only a blank page is shown.

[michaelbonert]

Since Gutenberg Update 12.1.0 the editor is working again. Thanks.

[andrewstaffell]

It's still broken for me under 12.1.0 (Appearance > Editor results in a blank screen with the Cannot destructure property error in Console).

Workaround is to append &postType=wp_template to the URL manually. Then it loads.

In other words:
Blank screen at /wp-admin/themes.php?page=gutenberg-edit-site
Editor loads correctly at /wp-admin/themes.php?page=gutenberg-edit-site&postType=wp_template

[lukecarbis]

Reporting in that I'm experiencing the same problem.

• WordPress 5.8.2
• Gutenberg 12.1.0
• Twenty Twenty Two 0.5

@andrewstaffell's workaround works for me to show a list of templates, but I can't edit any.

[andrewstaffell]

Still broken for me in 12.2.0. Error unchanged.

Uncaught (in promise) TypeError: Cannot destructure property 'id' of '(intermediate value)' as it is null.

[lukecarbis]

I just tried the latest in twentytwentytwo's develop branch, and it works. This is a theme issue, not a Gutenberg issue, and it will be fixed in the next release.

If someone else could confirm, I'll close the issue.

[andrewstaffell]

Still broken for me in 12.3.0 regardless of theme.

If it'll be fixed in the next release (of Gutenberg or WP) fine!

[annezazu]

I tried replicating this with the following setups and couldn't:

• Test 1: WP 5.8.2 with GB 12.3 and TT2 with permalinks set to Post Name.
• Test 2: WP 5.8.2 with GB 12.3 and TT2 with permalinks set to Custom Structure.
• Test 3: WP 5.9 RC1 with GB 12.3 and TT2 with permalinks set to Post Name.
• Test 4: WP 5.9 RC1 without GB and TT2 with permalinks set to Post Name.
• Test 5: WP 5.9 RC1 with GB 12.3 and TT2 with permalinks set to Custom Structure.
• Test 6: WP 5.9 RC1 without GB and TT2 with permalinks set to Custom Structure.
• Test 7: WP 5.9 RC1 with GB 12.3 and TT2 with permalinks set to Numeric.
• Test 8: WP 5.8.2 with GB 12.3 and TT2 with permalinks set to Numeric.

I checked both by going to Appearance > Editor (beta) and, while viewing the site, selecting "Edit Site" in the toolbar.

Of note, can't test TT2 without Gutenberg with 5.8.2 since that still requires the GB plugin to work. Can someone share their site info so I can try to track this down more?

Further, please test against 5.9 RC1 if you can :)

[annezazu]

Can anyone else still replicate this problem? @lukecarbis @andrewstaffell @michaelbonert @ellenbauer @kafleg I cannot replicate with 5.9 RC2 with TT2 but want to be sure to follow up :) If you can share more about your setup if you can replicate, that would be great.

[michaelbonert]

My editor is still running (since Gutenberg Update 12.1.0)
My actual configuration: WP 5.8.3 - GB 12.3.2 - Aino Theme 2.5.0 with permalinks set to Post Name.

[andrewstaffell]

Surprisingly still broken for me in WP 5.9 RC2, regardless of theme.

Even if I activate TT2 I still get a blank screen and the same error in console:
Uncaught (in promise) TypeError: Cannot destructure property 'id' of '(intermediate value)' as it is null.

Happens at both /wp-admin/site-editor.php and /wp-admin/themes.php?page=gutenberg-edit-site URLs.

I don't know what the id property that's being consulted there is, but if there's anything I can test/check in console let me know!

[annezazu]

cc @noisysocks flagging for you. I cannot replicate this but others can!

[noisysocks]

The error message sounds similar to the one in https://core.trac.wordpress.org/ticket/54507.

Could you check that you have a .htaccess file? It may be that this is the same issue as described in https://core.trac.wordpress.org/ticket/54507#comment:14 where misconfigured sites (no .htaccess) fail ungracefully.

[andrewstaffell]

.htaccess is present and has the correct WP rules in it.

I've tried messing with the permalink settings to no avail.

In case it helps to debug and/or add the required sanity checks, the line of code that's failing is in wp-content/plugins/gutenberg/build/edit-site/index.min.js and is line 1242 when I use Chrome Dev Tools to pretty print it. The specific (minified) line is:

 const {id: n, slug: l} = yield c.controls.resolveSelect(u.store, "__experimentalGetTemplateForLink", e.path);

[kafleg]

I am not able to replicate it now.
Tested in RC2

[noisysocks]

I think we need to fix #37236 as a first step so that we can see what the real underlying error is in all of these cases. It's not realistic that we can do this and then fix the underlying issue in time for WP 5.9 though so I'll bump this from the board and add this issue to my list of things to look at for WP 5.9.1.

[stuffnting]

With WP 5.9, when there is a home.html template file, the theme editor works, when there is no home.html template file I get the following error and a blank white screen:

Uncaught (in promise) TypeError: Cannot destructure property 'id' of '(intermediate value)' as it is null. at actions_setPage (edit-site.js:1019:9) at actions_setPage.next (<anonymous>) at actions_showHomepage (edit-site.js:1052:31) at actions_showHomepage.next (<anonymous>) at redux-routine.js:885:55 at nrWrapper (site-editor.php:5:30071)

The URL has:

site-editor.php

With the Gutenberg plugin, and no home.html file, the editor launches with the message:

You attempted to edit an item that doesn't exist. Perhaps it was deleted?

And, the top centre template/part selector does not work.

The URL has:

/site-editor.php?postType=wp_template&postId=fse-tester%2F%2Fhome

[andrewstaffell]

We still have the WSOD in 5.9, with or without Gutenberg plugin activated, BUT when the plugin is activated we now seem to get a different error message than the destructure one above.

The new one is:

Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0

... and that is apparently coming from themes.php. If I follow the web inspector link to that file, I see:

TypeError: Cannot read properties of undefined (reading 'requestContent')

Hope this is useful!

[annezazu]

Very useful! Thank you so much for following up with more details. @stuffnting can you clarify what you did & why to remove your home.html template?

[stuffnting]

I was writing a theme from scratch and started off with only index.html and single.html: the theme editor did not work.

When I switched the theme over to TT2, the theme editor worked.

Switching back to my theme, I looked at the error in the console, and followed the link to the code where it occurred.

It was:

function* actions_setPage(page) {
  var _page$context;

  if (!page.path && (_page$context = page.context) !== null && _page$context !== void 0 && _page$context.postId) {
    const entity = yield external_wp_data_["controls"].resolveSelect(external_wp_coreData_["store"], 'getEntityRecord', 'postType', page.context.postType || 'post', page.context.postId);
    page.path = Object(external_wp_url_["getPathAndQueryString"])(entity.link);
  }

  const {
    id: templateId,
    slug: templateSlug
  } = yield external_wp_data_["controls"].resolveSelect(external_wp_coreData_["store"], '__experimentalGetTemplateForLink', page.path);
  yield {
    type: 'SET_PAGE',
    page: !templateSlug ? page : { ...page,
      context: { ...page.context,
        templateSlug
      }
    },
    templateId
  };
  return templateId;
}

In particular, the line: id: templateId.

I guessed the theme editor could not find the initial template it was looking for. I also noted that, when using TT2, the theme editor opened with home.html.

So, I added home.html to my theme... BINGO, the theme editor now worked.

[andrewstaffell]

Finally working for me in Gutenberg 12.6.0 (WP 5.9). No WSOD, loads Page template with homepage ready for editing.

It might be that I didn't previously have a homepage set (recent local change preparing for our launch), rather than changes in 12.6.0 specifically, but I've just tried unsetting it and it still works, so not sure.

[skorasaurus]

Thanks for all of the reports; closing since all of the reporters in the issue are no longer experiencing it.

[aadilayub]

I'm experiencing this in a blank block theme as well, while following the Low code block theme tutorial.

My theme contains three files,

• index.php

<?

• style.css

/* 
Theme Name: Practice
Author: Aadil
Description: A practice theme made for learn.wordpress.org
Version: 1.0
*/

• templates/index.html (blank)

This is what I see in the browser when I go to the site editor:

(there are no javascript errors in the console)

This happens with or without index.php present.

For reference, I'm using WordPress 6.1.1

[aadilayub]

Just to leave an update, I added a theme.json file to my theme and the site editor started working. Is this as designed?

[annezazu]

@jonathanbossenger mind taking a look here when it comes to the tutorial aspect?

[jonathanbossenger]

@annezazu I can confirm that with WordPress 6.1.1, creating an empty theme, with just a style.css, index.php, and templates/index.html file (the minimum required files for a block theme), and attempting to edit the newly created/activated theme in the Editor results in a blank screen.

With debugging enabled

define( 'WP_DEBUG', true );
define( 'WP_DEBUG_DISPLAY', false );
define( 'WP_DEBUG_LOG', true );
define( 'SCRIPT_DEBUG', true );

Nothing is logged to the debug.log, and no errors are reported to the browser console:

Adding a theme.json file with an empty JSON object to the theme fixes the problem in 6.1.1 and I am able to edit the theme in the Editor.

I then rolled back to the site to WordPress 6.1 and removed the theme.json from the theme, I was able to edit the theme in the Editor. So it looks like this was regression reintroduced in WordPress 6.1.1.

[ndiego]

@jonathanbossenger are you able to retest with the latest version of Gutenberg active? I am no longer seeing any issues with Gutenberg, but am able to replicate without Gutenberg. This PR fixes the issue and will be included in 6.2. Let me know if everything is working properly with Gutenberg active and I will close out this issue. Thanks!

[jonathanbossenger]

@ndiego, whoops, I should have done that in my testing, shouldn't I? 🙈

I can confirm that everything works as expected with the latest version of the Gutenberg plugin (15.0.1) installed and active this is fixed, and therefore will be fixed once it's included in 6.2.

[ndiego]

Haha no worries, thanks for confirming @jonathanbossenger. I'm closing this one out. 💪