Skip to content

Global Styles: Add scoping of feature level selectors for custom block style variations#61033

Merged
aaronrobertshaw merged 3 commits into
trunkfrom
fix/scoping-feature-selectors-in-theme-json
Apr 29, 2024
Merged

Global Styles: Add scoping of feature level selectors for custom block style variations#61033
aaronrobertshaw merged 3 commits into
trunkfrom
fix/scoping-feature-selectors-in-theme-json

Conversation

@aaronrobertshaw

Copy link
Copy Markdown
Contributor

Related:

Note: The changes in this PR are being split out from #57908 to make that more manageable

What?

Ensures that feature-level selectors for block style variations are correctly scoped when generating a theme.json stylesheet.

Important: Currently, only block styles registered via block.json on core blocks are supported through theme.json. This means the supported blocks and their block styles don't currently leverage feature-level selectors. The issue this PR addresses would only surface once custom block style variations can be defined via theme.json in #57908.

Why?

To ensure that once custom block style variations being registered via theme.json are supported, the resulting CSS selectors are correct.

Testing Instructions

  • There should be no change to existing core block style variations that can be styled via Global Styles e.g. Image rounded
  • npm run test:unit:php:base -- --filter WP_Theme_JSON_Gutenberg_Test

@aaronrobertshaw aaronrobertshaw added [Type] Enhancement A suggestion for improvement. Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json labels Apr 24, 2024
@aaronrobertshaw aaronrobertshaw requested a review from talldan April 24, 2024 08:38
@aaronrobertshaw aaronrobertshaw self-assigned this Apr 24, 2024
@github-actions

github-actions Bot commented Apr 24, 2024

Copy link
Copy Markdown

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: aaronrobertshaw <aaronrobertshaw@git.wordpress.org>
Co-authored-by: talldan <talldanwp@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

Comment thread lib/class-wp-theme-json-gutenberg.php Outdated
@talldan talldan added the Needs PHP backport Needs PHP backport to Core label Apr 26, 2024
@talldan

talldan commented Apr 26, 2024

Copy link
Copy Markdown
Contributor

Guessing this one will need a PHP backport, so I've added the label.

@talldan talldan left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for adding the test. I don't see any issues here, though I'm not particularly familiar with this part of the codebase, so if you want a second approval it might not be a bad idea.

@aaronrobertshaw

Copy link
Copy Markdown
Contributor Author

Thanks for the reviews @talldan 🙇

so if you want a second approval it might not be a bad idea.

I'm pretty comfortable with this one.

The scoping of node selectors in this class was added separately to the selectors API but around the same time. This PR just makes it work as expected and correctly scope any custom selectors defined by the block via the selectors API.

The underlying issue hasn't surfaced previously as the few use cases that would scope things never needed custom selectors to target inner block markup. That will change with the extended block style variations feature.

@aaronrobertshaw aaronrobertshaw merged commit 01b24ce into trunk Apr 29, 2024
@aaronrobertshaw aaronrobertshaw deleted the fix/scoping-feature-selectors-in-theme-json branch April 29, 2024 10:09
@github-actions github-actions Bot added this to the Gutenberg 18.3 milestone Apr 29, 2024
@aaronrobertshaw

Copy link
Copy Markdown
Contributor Author

Backport for the PHP changes here can be found in WordPress/wordpress-develop#6475

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json Needs PHP backport Needs PHP backport to Core [Type] Enhancement A suggestion for improvement.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants