[wp-trac] [WordPress Trac] #57891: Frontend of block theme does not render as expected

[WordPress Trac]

#57891: Frontend of block theme does not render as expected
----------------------------------------------+-----------------------
 Reporter:  ironprogrammer                    |       Owner:  azaozz
     Type:  defect (bug)                      |      Status:  assigned
 Priority:  normal                            |   Milestone:  6.2
Component:  Themes                            |     Version:  trunk
 Severity:  major                             |  Resolution:
 Keywords:  has-screenshots has-testing-info  |     Focuses:
----------------------------------------------+-----------------------

Old description:

> Instead of displaying a block theme's frontend like that represented in
> the backend editor, posts are displayed in a `<ul>` block. Also, the site
> navigation appears broken.
>
> Confirmed this behavior with TT3, TT2, and Blockbase. (Unable to repro
> with classic themes like TT1 and TT.) Note that activating Gutenberg
> (tested with `trunk`) results in resolving this issue.
>
> == Testing Instructions
> These steps define how to reproduce the issue, and indicate the expected
> behavior.
>
> === Steps to Reproduce
> 1. From `wordpress-develop:trunk`, run `npm run build`.
> 2. Copy the `build/` folder to a new location, and set it up as a new
> site.
> 3. After configuring the site, add a few test posts.
> 4. 🐞 With TT3 active (should be by default), load the site frontend, and
> observe that posts are displayed in a list, rather than columns.
> 5. 🐞 Try testing with other block themes.
>
> === Expected Results
> When testing a patch to validate it works as expected:
> - ✅ The frontend of the site should render like that represented in the
> backend editor.
>
> When reproducing a bug:
> - ❌ The frontend of the site renders with posts in a list, and site
> navigation broken.
>
> === Supplemental Artifacts
> ||= Backend Editor =||= Frontend  =||
> || [[Image(https://cldup.com/0LC1ninezr.png)]] ||
> [[Image(https://cldup.com/ckIBM-jyZw.png)]] ||
>
> (Here is an example of the TT theme that does not have this issue:
> https://cldup.com/FH9pnSZ78F.png.)

New description:

 Instead of displaying a block theme's frontend like that represented in
 the backend editor, posts are displayed in a `<ul>` block. Also, the site
 navigation appears broken.

 Confirmed this behavior with TT3, TT2, and Blockbase. (Unable to repro
 with classic themes like TT1 and TT.) Note that activating Gutenberg
 (tested with `trunk`) results in resolving this issue.

 == Testing Instructions
 These steps define how to reproduce the issue, and indicate the expected
 behavior.

 === Steps to Reproduce
 1. From `wordpress-develop:trunk`, run `npm run build`.
 2. Copy the `build/` folder to a new location, and set it up as a new
 site.
 3. After configuring the site, add a few test posts.
 4.  With TT3 active (should be by default), load the site frontend, and
 observe that posts are displayed in a list, rather than columns.
 5.  Try testing with other block themes.

 === Expected Results
 When testing a patch to validate it works as expected:
 -  The frontend of the site should render like that represented in the
 backend editor.

 When reproducing a bug:
 -  The frontend of the site renders with posts in a list, and site
 navigation broken.

 === Supplemental Artifacts
 ||= Backend Editor =||= Frontend  =||
 || [[Image(https://cldup.com/0LC1ninezr.png)]] ||
 [[Image(https://cldup.com/ckIBM-jyZw.png)]] ||

 (Here is an example of the TT theme that does not have this issue:
 https://cldup.com/FH9pnSZ78F.png.)

--

Comment (by azaozz):

 Confirmed. Happens because the .css files in `wp-includes/blocks/` are
 cleaned together with the other CSS files, but are built earlier by
 Webpack.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/57891#comment:8>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform