Fix analytics crashes with gutenberg 21.2 #59846

louwie17 · 2025-07-21T14:26:39Z

Submission Review Guidelines:

I have followed the WooCommerce Contributing Guidelines and the WordPress Coding Standards.
I have checked to ensure there aren't other open Pull Requests for the same update/change.
I have reviewed my code for security best practices.
Following the above guidelines will result in quick merges and clear and detailed feedback when appropriate.

Changes proposed in this Pull Request:

With the latest GB version sprintf does not allow you to pass in undefined ( expected ), but it looks like we were doing this for some of our Analytics reports.
This change makes it so we only call sprintf when the items label is defined.

Closes WOOA7S-313 .

(For Bug Fixes) Bug introduced in PR # .

Screenshots or screen recordings:

Before	After

How to test the changes in this Pull Request:

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

Install Woo from this branch and the latest Gutenberg version ( 21.2 )
Go to Analytics > Overview and all the other report screens if no error appears.

Testing that has already taken place:

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

coderabbitai · 2025-07-21T14:26:47Z

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

Review comments: Directly reply to a review comment made by CodeRabbit. Example:
- I pushed a fix in commit <commit_id>, please review it.
- Explain this complex logic.
- Open a follow-up GitHub issue for this discussion.
Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
- @coderabbitai explain this code block.
- @coderabbitai modularize this function.
PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
- @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
- @coderabbitai read src/utils.ts and explain its main purpose.
- @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
- @coderabbitai help me debug CodeRabbit configuration file.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

@coderabbitai pause to pause the reviews on a PR.
@coderabbitai resume to resume the paused reviews.
@coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
@coderabbitai full review to do a full review from scratch and review all the files again.
@coderabbitai summary to regenerate the summary of the PR.
@coderabbitai generate docstrings to generate docstrings for this PR.
@coderabbitai generate sequence diagram to generate a sequence diagram of the changes in this PR.
@coderabbitai resolve resolve all the CodeRabbit review comments.
@coderabbitai configuration to show the current CodeRabbit configuration for the repository.
@coderabbitai help to get help.

Other keywords and placeholders

Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (`.coderabbit.yaml`)

You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
Please see the configuration documentation for more information.
If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

Visit our Documentation for detailed information on how to use CodeRabbit.
Join our Discord Community to get help, request features, and share feedback.
Follow us on X/Twitter for updates and announcements.

github-actions · 2025-07-21T14:26:48Z

Testing Guidelines

Hi @woocommerce/ventures,

Apart from reviewing the code changes, please make sure to review the testing instructions (Guide) and verify that relevant tests (E2E, Unit, Integration, etc.) have been added or updated as needed.

Reminder: PR reviewers are required to document testing performed. This includes:

🖼️ Screenshots or screen recordings.
📝 List of functionality tested / steps followed.
🌐 Site details (environment attributes such as hosting type, plugins, theme, store size, store age, and relevant settings).
🔍 Any analysis performed, such as assessing potential impacts on environment attributes and other plugins, conducting performance profiling, or using LLM/AI-based analysis.

⚠️ Within the testing details you provide, please ensure that no sensitive information (such as API keys, passwords, user data, etc.) is included in this public issue.

github-actions · 2025-07-21T14:32:10Z

Size Change: +60 B (0%)

Total Size: 5.96 MB

_{compressed-size-action}

github-actions · 2025-07-21T14:34:02Z

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.

retrofox

LGTM 🚀

retrofox · 2025-07-21T14:37:49Z

packages/js/components/src/chart/index.js

@@ -333,6 +333,11 @@ class Chart extends Component {
 		const legendDirection = legendPosition === 'top' ? 'row' : 'column';
 		const chartDirection = legendPosition === 'side' ? 'row' : 'column';

+		// Items label is not defined for all the reports.
+		const totalLabel = itemsLabel


Should we check if it's a string?

Something like...

Suggested change

const totalLabel = itemsLabel

const totalLabel = typeof itemsLabel === 'String' && itemsLabel?.length

Which case would this handle specifically? Just if itemsLabel is an empty string, that we still call sprintf?

I'd say any case other than a non-empty string. sprintf() indeed expects a string.

Seems to be some structural issues with this component. Why was sprintf being invoked on itemsLabel here instead of within the function passing in the prop? itemsLabel should be passed in as the final string?

The use for sprintf here is to add the length of the ordered keys into the label, which appears to be only available within this component specifically

nerrad · 2025-07-21T15:28:43Z

Looks like the change in Gutenberg might have been introduced with this (which you've already noticed was a switch to the tannin/sprintf pacakge). Probably worth checking to see there are no other undefined values passed to string and we should flag this more broadly.

louwie17 · 2025-07-21T16:06:53Z

I pushed one change ( 6e2cf9d ) also for the SearchListControl component, as it doesn't know if messages.noResults is defined or not, and it definitely isn't for some of its use cases like here:

woocommerce/plugins/woocommerce/client/blocks/assets/js/blocks/attribute-filter/edit.tsx

Lines 129 to 152 in d03c691

    
           const messages = { 
        
           	clear: __( 'Clear selected attribute', 'woocommerce' ), 
        
           	list: __( 'Product Attributes', 'woocommerce' ), 
        
           	noItems: __( 
        
           		"Your store doesn't have any product attributes.", 
        
           		'woocommerce' 
        
           	), 
        
           	search: __( 'Search for a product attribute:', 'woocommerce' ), 
        
           	selected: ( n: number ) => 
        
           		sprintf( 
        
           			/* translators: %d is the number of attributes selected. */ 
        
           			_n( 
        
           				'%d attribute selected', 
        
           				'%d attributes selected', 
        
           				n, 
        
           				'woocommerce' 
        
           			), 
        
           			n 
        
           		), 
        
           	updated: __( 
        
           		'Product attribute search results updated.', 
        
           		'woocommerce' 
        
           	), 
        
           };

The good thing is that in this instance, the component isn't being shown anyway if items is empty, so it wouldn't run into the above scenario.

* Fix issue with passing an undefined value to sprintf for item labels. * Correctly handle sprintf label when label is undefined * Add changelog * Make sure that if noResults is undefined we still pass an empty string. * Update changelog

github-actions · 2025-07-23T06:51:17Z

IMPORTANT: Merging this PR to the appropriate branches is critical to the release process and ensures that the bug does not cause regressions in the future releases.

Cherry picking was successful for trunk. Please merge the following PR: #59904

* Fix issue with passing an undefined value to sprintf for item labels. * Correctly handle sprintf label when label is undefined * Add changelog * Make sure that if noResults is undefined we still pass an empty string. * Update changelog

github-actions · 2025-07-23T06:51:22Z

IMPORTANT: Merging this PR to the appropriate branches is critical to the release process and ensures that the bug does not cause regressions in the future releases.

Cherry picking was successful for frozen release (release/10.1). Please merge the following PR: #59905

Fix analytics crashes with gutenberg 21.2 (#59846) * Fix issue with passing an undefined value to sprintf for item labels. * Correctly handle sprintf label when label is undefined * Add changelog * Make sure that if noResults is undefined we still pass an empty string. * Update changelog Co-authored-by: louwie17 <lourensschep@gmail.com>

louwie17 added 2 commits July 21, 2025 16:09

Fix issue with passing an undefined value to sprintf for item labels.

0e8790f

Correctly handle sprintf label when label is undefined

ee4327f

louwie17 requested a review from a team July 21, 2025 14:26

github-actions bot added package: @woocommerce/components issues related to @woocommerce/components plugin: woocommerce Issues related to the WooCommerce Core plugin. labels Jul 21, 2025

louwie17 mentioned this pull request Jul 21, 2025

[PRR]: Fix Analytics report screen crash with Gutenberg 21.2 #59848

Closed

11 tasks

retrofox approved these changes Jul 21, 2025

View reviewed changes

Add changelog

019aeb7

louwie17 force-pushed the wooa7s-313-analytics-crash-with-gutenberg-2120 branch from 378efa1 to 019aeb7 Compare July 21, 2025 14:36

retrofox reviewed Jul 21, 2025

View reviewed changes

nerrad mentioned this pull request Jul 21, 2025

I18N: Use @tannin/sprintf WordPress/gutenberg#70434

Merged

Make sure that if noResults is undefined we still pass an empty string.

6e2cf9d

Update changelog

f1a5dec

nerrad mentioned this pull request Jul 21, 2025

Fix breaking change to behaviour in sprintf WordPress/gutenberg#70824

Open

2 tasks

github-actions bot added cherry pick to trunk Dev only - Part of CFE, PRR flows cherry pick to frozen release Dev only - Part of PRR flow labels Jul 21, 2025

louwie17 merged commit 26d18fd into release/10.0 Jul 23, 2025
28 checks passed

louwie17 deleted the wooa7s-313-analytics-crash-with-gutenberg-2120 branch July 23, 2025 06:50

github-actions bot removed the plugin: woocommerce Issues related to the WooCommerce Core plugin. label Jul 23, 2025

github-actions bot mentioned this pull request Jul 23, 2025

Cherry pick #59846 into trunk #59904

Merged

github-actions bot mentioned this pull request Jul 23, 2025

Cherry pick 59846 into frozen release: release/10.1 #59905

Merged

coderabbitai bot mentioned this pull request Jul 23, 2025

[Release] quality trend analysis for 10.0.0 milestone (CFEs and PRRs) #59925

Closed

	const totalLabel = itemsLabel
	const totalLabel = typeof itemsLabel === 'String' && itemsLabel?.length

Fix analytics crashes with gutenberg 21.2 #59846

Fix analytics crashes with gutenberg 21.2 #59846

Uh oh!

Conversation

louwie17 commented Jul 21, 2025

Submission Review Guidelines:

Changes proposed in this Pull Request:

Screenshots or screen recordings:

How to test the changes in this Pull Request:

Testing that has already taken place:

Changelog entry

Significance

Type

Message

Comment

Uh oh!

coderabbitai bot commented Jul 21, 2025

Review skipped

Chat

Support

CodeRabbit Commands (Invoked using PR comments)

Other keywords and placeholders

CodeRabbit Configuration File (.coderabbit.yaml)

Documentation and Community

Uh oh!

github-actions bot commented Jul 21, 2025

Testing Guidelines

Uh oh!

github-actions bot commented Jul 21, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Jul 21, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Test using WordPress Playground

Uh oh!

retrofox left a comment

Choose a reason for hiding this comment

Uh oh!

retrofox Jul 21, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

retrofox Jul 21, 2025

Choose a reason for hiding this comment

Uh oh!

louwie17 Jul 21, 2025

Choose a reason for hiding this comment

Uh oh!

retrofox Jul 21, 2025

Choose a reason for hiding this comment

Uh oh!

nerrad Jul 21, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

louwie17 Jul 21, 2025

Choose a reason for hiding this comment

Uh oh!

nerrad commented Jul 21, 2025

Uh oh!

louwie17 commented Jul 21, 2025

Uh oh!

Uh oh!

github-actions bot commented Jul 23, 2025

Uh oh!

github-actions bot commented Jul 23, 2025

Uh oh!

Uh oh!

CodeRabbit Configuration File (`.coderabbit.yaml`)

github-actions bot commented Jul 21, 2025 •

edited

Loading

github-actions bot commented Jul 21, 2025 •

edited

Loading

retrofox Jul 21, 2025 •

edited

Loading

nerrad Jul 21, 2025 •

edited

Loading