Skip to content

Introduce react-intl auto-mock to simplify test maintenance#5935

Merged
lkostrowski merged 26 commits intomainfrom
intl-automock
Oct 3, 2025
Merged

Introduce react-intl auto-mock to simplify test maintenance#5935
lkostrowski merged 26 commits intomainfrom
intl-automock

Conversation

@lkostrowski
Copy link
Member

@lkostrowski lkostrowski commented Oct 2, 2025

Summary

Introduces a centralized Jest mock for react-intl that automatically returns defaultMessage for all internationalization functions, eliminating the need for repetitive intl setup across test files.

Changes

  • Added __mocks__/react-intl.ts: Global mock that auto-returns defaultMessage for formatMessage, useIntl, and FormattedMessage components
  • Updated jest.config.js: Configured to use the centralized mock
  • Cleaned up 91 test files: Removed manual intl wrapper setup, mock implementations, and simplified test expectations

Benefits

  • Reduced boilerplate: Removed ~543 lines of repetitive intl setup code across tests
  • Easier maintenance: Changes to intl behavior now managed in one place instead of 90+ files
  • Simpler tests: Tests now expect placeholder text (e.g., {name}) instead of interpolated values, making assertions clearer - this is a pitfall in some cases
  • Consistent behavior: All tests use the same intl mock implementation

Example

Before:

const intl = createIntl({ locale: "en", messages: {} });
wrapper = ({ children }) => <IntlProvider {...intl}>{children}</IntlProvider>;

After:

// No setup needed - mock is applied globally

🤖 Generated with Claude Code

Copilot AI review requested due to automatic review settings October 2, 2025 15:22
@changeset-bot
Copy link

changeset-bot bot commented Oct 2, 2025

⚠️ No Changeset found

Latest commit: ed9e642

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@vercel
Copy link

vercel bot commented Oct 2, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment
Project Deployment Preview Comments Updated (UTC)
saleor-dashboard-storybook Ignored Ignored Preview Oct 3, 2025 6:15am

Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull Request Overview

This PR refactors the test setup for React Intl by creating a centralized mock configuration and removing duplicated mocks across test files. The main purpose is to simplify test maintenance by consolidating React Intl mocking in a single location.

Key changes:

  • Created a global react-intl mock file to replace individual test mocks
  • Updated the test utilities to export a pre-configured testIntlInstance
  • Removed individual jest.mock("react-intl") calls from 50+ test files

Reviewed Changes

Copilot reviewed 81 out of 82 changed files in this pull request and generated 3 comments.

File Description
__mocks__/react-intl.ts New global mock for react-intl package with comprehensive function mocking
testUtils/intl.ts Updated to export testIntlInstance instead of intlMock for consistency
Multiple test files Removed redundant react-intl mocks and updated imports to use centralized utilities

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

@lkostrowski lkostrowski added the skip changeset Use if your changes doesn't need entry in changelog label Oct 2, 2025
lkostrowski and others added 7 commits October 2, 2025 17:33
Updated test to expect {link} placeholder instead of actual gift card values.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
Updated test to expect {name} placeholder instead of interpolated value.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
Updated test to expect {name} placeholder instead of interpolated value.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
Updated test to expect {name} placeholder instead of interpolated value.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
Updated test to expect URL-encoded app ID and /app path suffix.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
Updated test to expect {country} and {configLink} placeholders instead of interpolated values.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
@codecov
Copy link

codecov bot commented Oct 3, 2025

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 40.06%. Comparing base (85a35c0) to head (ed9e642).
⚠️ Report is 1 commits behind head on main.

Additional details and impacted files
@@           Coverage Diff           @@
##             main    #5935   +/-   ##
=======================================
  Coverage   40.06%   40.06%           
=======================================
  Files        2473     2473           
  Lines       40170    40170           
  Branches     8821     8821           
=======================================
+ Hits        16093    16095    +2     
+ Misses      24050    24048    -2     
  Partials       27       27           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@lkostrowski lkostrowski marked this pull request as ready for review October 3, 2025 06:15
@lkostrowski lkostrowski requested a review from a team as a code owner October 3, 2025 06:15
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull Request Overview

Copilot reviewed 90 out of 91 changed files in this pull request and generated 1 comment.


Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

@lkostrowski lkostrowski changed the title Mock React-Intl package to simplify test maintenance Introduce react-intl auto-mock to simplify test maintenance Oct 3, 2025
@lkostrowski lkostrowski merged commit f7b8e2d into main Oct 3, 2025
23 checks passed
@lkostrowski lkostrowski deleted the intl-automock branch October 3, 2025 06:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

skip changeset Use if your changes doesn't need entry in changelog

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants