Skip to content

Refactored Single Product Block Context Delivery#51390

Closed
ObliviousHarmony wants to merge 9 commits intotrunkfrom
fix/51352-single-product-block-context
Closed

Refactored Single Product Block Context Delivery#51390
ObliviousHarmony wants to merge 9 commits intotrunkfrom
fix/51352-single-product-block-context

Conversation

@ObliviousHarmony
Copy link
Copy Markdown
Contributor

Submission Review Guidelines:

Changes proposed in this Pull Request:

By its nature, any context that a block provides will be passed from parent to child. Previously we were setting the context on all inner blocks of a Single Product block. In cases where a block was being passed a postId by a parent, this filter would override that value. This manifested in the Product Collection block where the first product shown in the block was being overridden with the Single Product block's selection.

After reviewing relevant code in Gutenberg I discovered that last year the Post Template block changed the way it passed context to inner blocks. Using this as inspiration:

  • Changed the Product Template block to replicate Gutenberg's behavior.
  • Reworked the Single Product block's context passing so that Gutenberg handles cascading it to children. This keeps us from setting the postId on products that may have their own plans for it. I also added the missing singleProduct context to the editor.
  • Strengthened the Single Product block's global post override to apply to all inner blocks. This makes sure all inner blocks have the correct post set when rendering in case they use the post or functions that return information about the global post.

Backward Compatibility Concerns

This does come with some caveats:

  • The postId and singleProduct context is not available unless a block explicitly declares it in the block.json as usesContext.
    • Anyone relying on the presence of this context without declaring it will no longer receive it.
  • The postId will now cascade from the Post Template block to all inner blocks.
    • Inner blocks of the Product Collection will now have the overridden postId passed correctly through the block hierarchy.
  • The global post will now be overridden for all children of the Single Product block, rather than just the post title and excerpt.

In my opinion these risks are worth accepting. The proposed behavior is better aligned with Gutenberg and ensures that inner blocks of both the Single Product and Product Collection blocks have the correct context and global post. We shouldn't encourage people to rely on secret runtime context that is automatically injected into every block.

Closes #51352.

How to test the changes in this Pull Request:

Using the WooCommerce Testing Instructions Guide, include your detailed testing instructions:

  1. Create a new post.
  2. Add a "Single Product" block to the page and select a product.
  3. Confirm that the editor displays the correct product.
  4. Confirm that the frontend displays the correct product.
  5. Add a "Product Collection" block as an inner block somewhere in the "Single Product" block.
  6. Confirm that the editor displays the collection correctly.
  7. Confirm that the frontend displays the collection correctly.

Changelog entry

  • Automatically create a changelog entry from the details below.
  • This Pull Request does not require a changelog entry. (Comment required below)
Changelog Entry Details

Significance

  • Patch
  • Minor
  • Major

Type

  • Fix - Fixes an existing bug
  • Add - Adds functionality
  • Update - Update existing functionality
  • Dev - Development related task
  • Tweak - A minor adjustment to the codebase
  • Performance - Address performance issues
  • Enhancement - Improvement to existing functionality

Message

Changelog Entry Comment

Comment

By its nature, all context is passed from parent to child. This means
there isn't a reason to manually set it, and instead, block should
opt-in to using the context.
Rather than relying entirely on the `postId` context, some blocks use
the global post to figure out what content to display. This updates
the global post so that all inner blocks have the selected product
set as the global post.
This should make sure that the client and server are consistent.
@github-actions github-actions bot added the plugin: woocommerce Issues related to the WooCommerce Core plugin. label Sep 13, 2024
@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented Sep 13, 2024

Test using WordPress Playground

The changes in this pull request can be previewed and tested using a WordPress Playground instance.
WordPress Playground is an experimental project that creates a full WordPress instance entirely within the browser.

Test this pull request with WordPress Playground.

Note that this URL is valid for 30 days from when this comment was last updated. You can update it by closing/reopening the PR or pushing a new commit.

@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented Sep 13, 2024

Size Change: +682 B (+0.03%)

Total Size: 2.37 MB

Filename Size Change
./plugins/woocommerce-blocks/build/product-search.js 3.45 kB +631 B (+22.42%) 🚨

compressed-size-action

Since blocks can be nested we need to use a stack to change the global
post. This makes sure each downstream block has the post set to the
product that is currently being rendered by the block.
@ObliviousHarmony
Copy link
Copy Markdown
Contributor Author

While this pull request is ready, unfortunately, it's blocked by an issue with the way that WordPress handles inner block context. This Trac ticket is about the issue.

@ObliviousHarmony ObliviousHarmony added status: blocked The issue is blocked from progressing, waiting for another piece of work to be done. status: awaiting upstream Upstream issue that needs to be fixed. labels Sep 16, 2024
@ObliviousHarmony
Copy link
Copy Markdown
Contributor Author

ObliviousHarmony commented Oct 31, 2025

The referenced upstream work was merged and is part of WordPress 6.8. Once it is covered by the minimum WordPress version we support, this PR can be looked at again.

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

Labels

plugin: woocommerce Issues related to the WooCommerce Core plugin. status: awaiting upstream Upstream issue that needs to be fixed. status: blocked The issue is blocked from progressing, waiting for another piece of work to be done.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Product Collection: Single Product Block Overrides First Product Collection Entry

1 participant