Prevent duplicate registration of core blocks in client by joshuatf · Pull Request #37350 · woocommerce/woocommerce

joshuatf · 2023-03-21T20:35:01Z

All Submissions:

Have you followed the WooCommerce Contributing guideline?
Does your code follow the WordPress' coding standards?
Have you checked to ensure there aren't other open Pull Requests for the same update/change?

Changes proposed in this Pull Request:

Checks core block registration before attempting to register a core block.

Closes #37348 .

How to test the changes in this Pull Request:

Have you followed the Writing high-quality testing instructions guide?

Navigate to the product block editor
Check your console to verify no duplicate block registration errors exist
Check that the editor continues to work as expected
Turn on the previous product editor experience
Check that the rich text areas continue to work as expected without error

Other information:

Have you added an explanation of what your changes do and why you'd like us to include them?
Have you written new tests for your changes, as applicable?
Have you created a changelog file for each project being changed, ie pnpm --filter=<project> changelog add?
Have you included testing instructions?

FOR PR REVIEWER ONLY:

I have reviewed that everything is sanitized/escaped appropriately for any SQL or XSS injection possibilities. I made sure Linting is not ignored or disabled.

codecov · 2023-03-21T20:59:52Z

Codecov Report

Merging #37350 (27af4f9) into trunk (c4f0170) will not change coverage.
The diff coverage is n/a.

Additional details and impacted files

@@           Coverage Diff            @@
##             trunk   #37350   +/-   ##
========================================
  Coverage     45.8%    45.8%           
  Complexity   17196    17196           
========================================
  Files          429      429           
  Lines        64911    64911           
========================================
  Hits         29703    29703           
  Misses       35208    35208

Impacted Files	Coverage Δ
...ugins/woocommerce/includes/class-wc-post-types.php	`2.6% <ø> (ø)`
plugins/woocommerce/includes/class-woocommerce.php	`19.4% <ø> (ø)`
plugins/woocommerce/woocommerce.php	`15.4% <ø> (ø)`

github-actions · 2023-03-21T21:05:23Z

Test Results Summary

Commit SHA: 27af4f9

Test 🧪	Passed ✅	Failed 🚨	Broken 🚧	Skipped ⏭️	Unknown ❔	Total 📊	Duration ⏱️
API Tests	259	0	0	2	0	261	0m 49s
E2E Tests	191	0	0	10	0	201	17m 15s

To view the full API test report, click here.
To view the full E2E test report, click here.
To view all test reports, visit the WooCommerce Test Reports Dashboard.

louwie17

Thanks for addressing this @joshuatf, I was going to create an issue for this, but you beat me to it by pushing up a PR 🎉
These changes look good, so approving! I did leave some thoughts about calling initBlocks and registerCoreBlocks outside of the respective editor components, something handled by the consumer (aka our client/admin code), but that could also be a follow up.

louwie17 · 2023-03-22T10:54:27Z

packages/js/components/src/rich-text-editor/utils/register-blocks.ts

+	const blocks = coreBlocks.filter( ( block: BlockInstance ) => {
+		const isRegistered = !! getBlockType( block.name );
+		return ! isRegistered && ALLOWED_CORE_BLOCKS.includes( block.name );
+	} );


louwie17 · 2023-03-22T10:57:34Z

packages/js/product-editor/src/components/editor/init-blocks.ts

+	const coreBlocks = __experimentalGetCoreBlocks();
+	const blocks = coreBlocks.filter( ( block: BlockInstance ) => {
+		return ! getBlockType( block.name );
+	} );


Nice, I guess this works to :)
I had talked with @mdperez86 about it, and thought the initBlocks should more so be something triggered outside of the editor package (same goes for the rich text editor component ), so controlled by the client instead of the editor component.
But this logic would be handy anyhow and fixes the immediate problem. It may still be nice to move the initBlocks and registerCoreBlocks calls outside of the respective Editor components, but that could be a future change.

Ya, I'm also thinking the same.

Part of me feels like there may be performance gains to not initialize blocks on every single WCA page and only do it when these components are loaded, but those gains may be overstated or even non-existent.

But let's leave it for a follow-up and we can think about the best way to enqueue all these blocks/assets for various use cases in WCA.

this is not fixed for all use cases. If one is using the filter to add block editor to the product post type, there is no conditional check (here) to prevent the duplicate loading of core blocks error. For example, using the filter itself, in a snippet, with the Kadence theme, it generates the following console errors (truncated):

blocks.min.js?ver=639e14271099dc3d85bf:3 Block "woocommerce/product-summary" is already registered. ne @ blocks.min.js?ver=639e14271099dc3d85bf:3 Ke @ index.js?ver=7.7.2:2 (anonymous) @ index.js?ver=7.7.2:2 (anonymous) @ index.js?ver=7.7.2:2 (anonymous) @ index.js?ver=7.7.2:2 (anonymous) @ index.js?ver=7.7.2:2 blocks.min.js?ver=639e14271099dc3d85bf:3 Block "woocommerce/product-sku" is already registered. ne @ blocks.min.js?ver=639e14271099dc3d85bf:3 At @ index.js?ver=7.7.2:2 (anonymous) @ index.js?ver=7.7.2:2 (anonymous) @ index.js?ver=7.7.2:2 (anonymous) @ index.js?ver=7.7.2:2 (anonymous) @ index.js?ver=7.7.2:2 blocks.min.js?ver=639e14271099dc3d85bf:3 Block "core/paragraph" is already registered. ne @ blocks.min.js?ver=639e14271099dc3d85bf:3 je @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 Uh @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 (anonymous) @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 SE @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 Io @ edit-post.min.js?ver=d098b8ee5bdffa238c03:7 (anonymous) @ post.php?post=478&action=edit:293 blocks.min.js?ver=639e14271099dc3d85bf:3 Block "core/image" is already registered. ne @ blocks.min.js?ver=639e14271099dc3d85bf:3 je @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 Xu @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 (anonymous) @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 SE @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 Io @ edit-post.min.js?ver=d098b8ee5bdffa238c03:7 (anonymous) @ post.php?post=478&action=edit:293 blocks.min.js?ver=639e14271099dc3d85bf:3 Block "core/heading" is already registered. ne @ blocks.min.js?ver=639e14271099dc3d85bf:3 je @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 yu @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 (anonymous) @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 SE @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 Io @ edit-post.min.js?ver=d098b8ee5bdffa238c03:7 (anonymous) @ post.php?post=478&action=edit:293 blocks.min.js?ver=639e14271099dc3d85bf:3 Block "core/gallery" is already registered. ne @ blocks.min.js?ver=639e14271099dc3d85bf:3 je @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 Ic @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 (anonymous) @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 SE @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 Io @ edit-post.min.js?ver=d098b8ee5bdffa238c03:7 (anonymous) @ post.php?post=478&action=edit:293 blocks.min.js?ver=639e14271099dc3d85bf:3 Block "core/list" is already registered. ne @ blocks.min.js?ver=639e14271099dc3d85bf:3 je @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 Fm @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 (anonymous) @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 SE @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 Io @ edit-post.min.js?ver=d098b8ee5bdffa238c03:7 (anonymous) @ post.php?post=478&action=edit:293 blocks.min.js?ver=639e14271099dc3d85bf:3 Block "core/list-item" is already registered. ne @ blocks.min.js?ver=639e14271099dc3d85bf:3 je @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 ld @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 (anonymous) @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 SE @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 Io @ edit-post.min.js?ver=d098b8ee5bdffa238c03:7 (anonymous) @ post.php?post=478&action=edit:293 blocks.min.js?ver=639e14271099dc3d85bf:3 Block "core/quote" is already registered. ne @ blocks.min.js?ver=639e14271099dc3d85bf:3 je @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 my @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 (anonymous) @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 SE @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 Io @ edit-post.min.js?ver=d098b8ee5bdffa238c03:7 (anonymous) @ post.php?post=478&action=edit:293 blocks.min.js?ver=639e14271099dc3d85bf:3 Block "core/archives" is already registered. ne @ blocks.min.js?ver=639e14271099dc3d85bf:3 je @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 tt @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 (anonymous) @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 SE @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 Io @ edit-post.min.js?ver=d098b8ee5bdffa238c03:7 (anonymous) @ post.php?post=478&action=edit:293 blocks.min.js?ver=639e14271099dc3d85bf:3 Block "core/audio" is already registered. ne @ blocks.min.js?ver=639e14271099dc3d85bf:3 je @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 Qt @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 (anonymous) @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 SE @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 Io @ edit-post.min.js?ver=d098b8ee5bdffa238c03:7 (anonymous) @ post.php?post=478&action=edit:293 blocks.min.js?ver=639e14271099dc3d85bf:3 Block "core/button" is already registered. ne @ blocks.min.js?ver=639e14271099dc3d85bf:3 je @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 _n @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 (anonymous) @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 SE @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 Io @ edit-post.min.js?ver=d098b8ee5bdffa238c03:7 (anonymous) @ post.php?post=478&action=edit:293 blocks.min.js?ver=639e14271099dc3d85bf:3 Block "core/buttons" is already registered. ne @ blocks.min.js?ver=639e14271099dc3d85bf:3 je @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 Mn @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 (anonymous) @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 SE @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 Io @ edit-post.min.js?ver=d098b8ee5bdffa238c03:7 (anonymous) @ post.php?post=478&action=edit:293 blocks.min.js?ver=639e14271099dc3d85bf:3 Block "core/calendar" is already registered. ne @ blocks.min.js?ver=639e14271099dc3d85bf:3 je @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 Dn @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 (anonymous) @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 SE @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 Io @ edit-post.min.js?ver=d098b8ee5bdffa238c03:7 (anonymous) @ post.php?post=478&action=edit:293 blocks.min.js?ver=639e14271099dc3d85bf:3 Block "core/categories" is already registered. ne @ blocks.min.js?ver=639e14271099dc3d85bf:3 je @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 Wn @ block-library.min.js?ver=3115f0b5551a55bb6d3b:12 (anonymous) @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 SE @ block-library.min.js?ver=3115f0b5551a55bb6d3b:14 Io @ edit-post.min.js?ver=d098b8ee5bdffa238c03:7 (anonymous) @ post.php?post=478&action=edit:293 blocks.min.js?ver=639e14271099dc3d85bf:3 Block "core/freeform" is already registered.

Suggest that some type of conditional check needs to be added to determine whether the block editor has already been applied to the product post type by some other (legacy) method and if so, to prevent also triggering the loading of default gutenberg blocks for core and woocommerce

so controlled by the client instead of the editor component.

YES! You understand. As it is, there are so many legacy use cases from plugins/customization that folks have created for WooCommerce product pages that forced the use of Gutenberg...it is causing great grief to try and remedy the errors being generated by NOT giving anyone a separate option box in WooCommerce as to whether to load block editor and especially whether to load the core blocks (again), which causes an error as I've loaded below.

joshuatf added 2 commits March 21, 2023 13:32

Prevent duplicate registration of core blocks

8d0f543

Add components changelog entry

27af4f9

joshuatf requested a review from a team March 21, 2023 20:35

joshuatf self-assigned this Mar 21, 2023

github-actions bot added the package: @woocommerce/components issues related to @woocommerce/components label Mar 21, 2023

louwie17 approved these changes Mar 22, 2023

View reviewed changes

joshuatf merged commit 562749b into trunk Mar 22, 2023

joshuatf deleted the fix/37348 branch March 22, 2023 23:56

github-actions bot added this to the 7.7.0 milestone Mar 22, 2023

AashikP mentioned this pull request Apr 21, 2023

Uncaught (in promise) TypeError: r[e] is undefined #37782

Closed

2 tasks

galbaras mentioned this pull request May 12, 2023

Multiple issues when editing WooCommerce pages with the Block Editor #38269

Closed

5 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Prevent duplicate registration of core blocks in client#37350

Prevent duplicate registration of core blocks in client#37350
joshuatf merged 2 commits intotrunkfrom
fix/37348

joshuatf commented Mar 21, 2023

Uh oh!

codecov bot commented Mar 21, 2023

Uh oh!

github-actions bot commented Mar 21, 2023

Uh oh!

louwie17 left a comment

Uh oh!

louwie17 Mar 22, 2023

Uh oh!

louwie17 Mar 22, 2023

Uh oh!

joshuatf Mar 22, 2023

Uh oh!

wplaunchify Jun 9, 2023

Uh oh!

wplaunchify Jun 9, 2023

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Conversation

joshuatf commented Mar 21, 2023

All Submissions:

Changes proposed in this Pull Request:

How to test the changes in this Pull Request:

Other information:

FOR PR REVIEWER ONLY:

Uh oh!

codecov bot commented Mar 21, 2023

Codecov Report

Uh oh!

github-actions bot commented Mar 21, 2023

Test Results Summary

Uh oh!

louwie17 left a comment

Choose a reason for hiding this comment

Uh oh!

louwie17 Mar 22, 2023

Choose a reason for hiding this comment

Uh oh!

louwie17 Mar 22, 2023

Choose a reason for hiding this comment

Uh oh!

joshuatf Mar 22, 2023

Choose a reason for hiding this comment

Uh oh!

wplaunchify Jun 9, 2023

Choose a reason for hiding this comment

Uh oh!

wplaunchify Jun 9, 2023

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants