Make WordPress Core

Opened 3 days ago

Closed 2 days ago

#65450 closed defect (bug) (reported-upstream)

Site Editor crashes on block style variation detail route for `core/column`

Reported by: kimjiwoon's profile kimjiwoon Owned by:
Milestone: Priority: normal
Severity: normal Version: 7.0
Component: Editor Keywords:
Focuses: Cc:

Description

When opening the Site Editor style variation detail screen for a core/column block style variation, the editor crashes with:

`text
TypeError: Cannot read properties of undefined (reading 'map')
`

This reproduces with the default Twenty Twenty-Five theme, so it does not appear to be caused by a custom theme implementation.

Environment

  • WordPress: 7.0
  • Theme: Twenty Twenty-Five 1.5
  • Browser: Chromium-based browser
  • Context: Site Editor → Styles → Blocks → Column → Style variation

Steps To Reproduce

  1. Activate Twenty Twenty-Five 1.5.
  2. Open the Site Editor.
  3. Navigate to a core/column block style variation detail route, for example:

`text
/wp-admin/site-editor.php?p=%2Fstyles&section=%2Fblocks%2Fcore%252Fcolumn%2Fvariations%2Fsection-1
`

  1. Observe the JavaScript error.

Actual Result
The Site Editor crashes and logs:

`text
TypeError: Cannot read properties of undefined (reading 'map')

at Dwe (.../wp-includes/js/dist/editor.min.js:149:7185)

`

Expected Result
The style variation detail screen should render without crashing.

If the Style Book has no standalone preview example for core/column, the editor should either:

  • fall back to a suitable parent/container example, or
  • render an empty/unsupported preview state gracefully, without throwing.

Technical Notes
The error appears to come from the Style Book preview flow.

In the unminified editor build, applyBlockVariationsToExamples() assumes examples is defined:

`js
function applyBlockVariationsToExamples(examples, variation) {

if (!variation) {

return examples;

}
return examples.map((example) => {

...

});

}
`

For core/column variation routes, the filtered Style Book example set appears to be missing or undefined, likely because core/column is primarily a nested child block and does not have a standalone Style Book example.

The same route pattern works for core/group, but fails for core/column.

Additional Reproduction
A custom block style variation for core/column produces the same error, while the same variation on core/group renders normally. This suggests the issue is tied to core/column Style Book preview handling rather than a specific theme JSON style declaration.

Change History (3)

#1 @sainathpoojary
3 days ago

Reproduction Report

Environment

  • WordPress: 7.1-alpha-62482
  • Subdirectory: No
  • PHP: 8.3.31
  • Server: Apache/2.4.67 (Debian)
  • Database: mysqli (Server: 12.3.2-MariaDB-ubu2404 / Client: mysqlnd 8.3.31)
  • Browser: Chrome 149.0.0.0
  • OS: macOS
  • Theme: Twenty Twenty-Five 1.5
  • MU Plugins:
    • Gutenberg Test Plugin, Disable Login Autofocus
    • Gutenberg Test Plugin, Disable Remote Patterns
    • Gutenberg Test Plugin, Enable Templates UI
    • Gutenberg Test Plugin, No-cache Headers
    • Gutenberg Test Plugin, Normalize Theme
    • server-timing.php
  • Plugins:
    • Gutenberg 23.4.0-rc.1

Steps taken

  1. Open your browser's Developer Tools, then go to the Console tab.
  2. Go to Appearance > Editor to open the Site Editor.
  3. In the left sidebar of the Site Editor, click on Styles (the half-black/half-white circle icon).
  4. In the Styles panel, click on Blocks.
  5. Click the Eye icon at the top right of the Styles sidebar to ensure the Style Book is toggled ON.
  6. You will see a search bar. Type Column
  7. Click on the Column block in the search results to open its style details.
  8. You should see a list of style variations for the Column block (e.g., "Style 1" or "Section 1"). Click on any of these style variations.

Expected behavior

The style variation detail screen should render without crashing the editor.

Screenshots/Screencast with results

https://rioudcpuyg.ufs.sh/f/PL8E4NiPUWyOMfp7iIhp3F90beESqliHBLy7PKXG5nvmwjAd

#2 @sainathpoojary
2 days ago

I have tested this issue in Gutenberg and can confirm it is reproducible there as well. Since the source of this bug is in the Gutenberg repository, I have opened a corresponding issue on GitHub to track the fix: https://github.com/WordPress/gutenberg/issues/79130

#3 @jorbin
2 days ago

  • Focuses ui javascript administration removed
  • Milestone Awaiting Review deleted
  • Resolution set to reported-upstream
  • Status changed from new to closed

Thank you for the report @kimjiwoon and thank you for moving this over @sainathpoojary.

Note: See TracTickets for help on using tickets.