Make WordPress Core

Opened 5 months ago

Closed 5 months ago

Last modified 5 months ago

#60453 closed defect (bug) (fixed)

Block Styles: Fix block style variation selector generation

Reported by: aaronrobertshaw's profile aaronrobertshaw Owned by: youknowriad's profile youknowriad
Milestone: 6.5 Priority: normal
Severity: normal Version: 6.5
Component: Editor Keywords: gutenberg-merge has-patch has-unit-tests
Focuses: Cc:

Description

This ticket tracks the backporting of PHP files for the following Gutenberg changes:

https://github.com/WordPress/gutenberg/pull/58051

These changes fix the generation of selectors for block style variations which could previously invalid CSS selectors e.g. .is-style-darkp instead of p.is-style-dark if the block with the variation used an element tag as it's base selector.

Change History (5)

This ticket was mentioned in PR #6053 on WordPress/wordpress-develop by @aaronrobertshaw.


5 months ago
#1

  • Keywords has-patch has-unit-tests added

Syncs the changes from https://github.com/WordPress/gutenberg/pull/58051.

These changes fix the generation of selectors for block style variations. Previously, an incorrect CSS selector could be generated if the block's base selector used an element tag etc.

To test:

Run: npm run test:php -- --filter Tests_Theme_wpThemeJson

https://i0.wp.com/github.com/WordPress/wordpress-develop/assets/60436221/92f6dae8-3f05-4034-aa5c-47fa775b5eb5

If you want to go further and test manually:

  1. Add a block style to the paragraph block in its block.json file
  2. Within Global Styles, set a text color or something for the block style variation you just added
  3. Apply the variation to a block instance and view it on the frontend
  4. Inspect paragraph and confirm the variation's selector e.g. is-style-dark is appended to the p tag rather than prefixing it

Trac ticket: https://core.trac.wordpress.org/ticket/60453

@youknowriad commented on PR #6053:


5 months ago
#2

Thanks for the comprehensive tests.

#3 @youknowriad
5 months ago

  • Owner set to youknowriad
  • Resolution set to fixed
  • Status changed from new to closed

In 57547:

Editor: Fix block style variation selector generation.

These changes fix the generation of selectors for block style variations. Previously, an incorrect CSS selector could be generated if the block's base selector used an element tag etc.

Props aaronrobertshaw, youknowriad, mukesh27.
Fixes #60453.

#4 @youknowriad
5 months ago

  • Milestone changed from Awaiting Review to 6.5
Note: See TracTickets for help on using tickets.