[wp-trac] [WordPress Trac] #57904: Per-level styling of heading blocks does not work

[WordPress Trac]

#57904: Per-level styling of heading blocks does not work
--------------------------+-----------------------------
 Reporter:  wongjn        |      Owner:  (none)
     Type:  defect (bug)  |     Status:  new
 Priority:  normal        |  Milestone:  Awaiting Review
Component:  General       |    Version:
 Severity:  normal        |   Keywords:
  Focuses:                |
--------------------------+-----------------------------
 As reported in the [https://make.wordpress.org/core/2023/03/07
 /miscellaneous-editor-changes-in-wordpress-6-2/#wp-block-heading-css-
 class-added-to-every-heading-block Miscellaneous Editor changes in
 WordPress 6.2], one should be able to style the `h1`-`h6` elements of a
 `core/heading` block differently to the global `h1`-`h6` elements via
 `theme.json`:

 {{{
 {
         "styles": {
                 "elements": {
                         "h1": {
                                 "color": {
                                         "background": "blue"
                                 }
                         }
                 },
                 "blocks": {
                         "core/heading": {
                                 "elements": {
                                         "h1": {
                                                 "color": {
                                                         "background":
 "pink"
                                                 }
                                         }
                                 }
                         }
                 }
         }
 }
 }}}

 However, this does not work as the CSS that is generated by the WordPress
 style engine is as follows:

 {{{
 .wp-block-heading h1{background-color: pink;}
 }}}

 Where it should be more like:

 {{{
 h1.wp-block-heading{background-color: pink;}
 }}}

 Tested in `6.2-RC1-55503` with Twenty Twenty-Three.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/57904>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform