Skip to content

test: unify i18next mocks into centralized helpers - #42

Open
tomerqodo wants to merge 5 commits into
augment_combined_20260121_augment_sentry_coderabbit_1_base_test_unify_i18next_mocks_into_centralized_helpers_pr437from
augment_combined_20260121_augment_sentry_coderabbit_1_head_test_unify_i18next_mocks_into_centralized_helpers_pr437
Open

test: unify i18next mocks into centralized helpers#42
tomerqodo wants to merge 5 commits into
augment_combined_20260121_augment_sentry_coderabbit_1_base_test_unify_i18next_mocks_into_centralized_helpers_pr437from
augment_combined_20260121_augment_sentry_coderabbit_1_head_test_unify_i18next_mocks_into_centralized_helpers_pr437

Conversation

@tomerqodo

Copy link
Copy Markdown

Benchmark PR from qodo-benchmark#437

hyoban and others added 5 commits January 21, 2026 15:55
Consolidate scattered i18next mock implementations across test files into
a single source of truth. This reduces duplication and ensures consistent
mock behavior.

- Create test/i18n-mock.ts with reusable factory functions
- Update vitest.setup.ts to use the centralized helpers
- Remove redundant mock definitions from 8 test files
- Update testing.md documentation

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

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
…eateReactI18nextMock` and detail global mock provisions.
@augmentcode

augmentcode Bot commented Jan 22, 2026

Copy link
Copy Markdown
🤖 Augment PR Summary

Summary: This PR standardizes how i18n is mocked in frontend tests by centralizing react-i18next mocks and removing redundant per-test implementations.

Changes:

  • Introduced a reusable i18n mock helper at web/test/i18n-mock.ts (mock useTranslation, t, and Trans).
  • Updated the global Vitest setup (web/vitest.setup.ts) to use the centralized helper for the default react-i18next mock.
  • Removed repetitive inline vi.mock('react-i18next') blocks from multiple component tests, relying on the global mock where possible.
  • Updated tests that assert on rendered translation strings to match the global mock’s namespaced key behavior.
  • Refactored a few tests to use createReactI18nextMock when custom translations are required for assertions.
  • Updated internal testing docs/templates to document the preferred i18n mocking approach.

Technical Notes: The new helper centralizes key-formatting behavior (namespace prefixing + param serialization) to keep test output consistent and reduce maintenance across the test suite.

🤖 Was this summary useful? React with 👍 or 👎

@augmentcode augmentcode Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Review completed. 5 suggestions posted.

Fix All in Augment

Comment augment review to trigger a new review at any time.

Comment thread web/test/i18n-mock.ts

/**
* Create a t function with optional custom translations
* Checks translations[key] first, then translations[ns.key], then returns ns.key as fallback

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

The docstring says it checks translations[key] before translations[ns.key], but the implementation checks the namespaced key (fullKey) first. This mismatch can confuse test authors about which override will win when both forms are provided.

Fix This in Augment

🤖 Was this useful? React with 👍 or 👎

Comment thread web/test/i18n-mock.ts
* Checks translations[key] first, then translations[ns.key], then returns ns.key as fallback
*/
export function createTFunction(translations: TranslationMap, defaultNs?: string) {
return (key: string, options?: Record<string, unknown>) => {

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

createTFunction no longer has the special-case for options.returnObjects that the previous global mock had, so calls like t('x', { returnObjects: true }) will now return a string with a JSON suffix instead of an array. If any component under test expects an array from i18next for list-like translations, this can change rendering/assertions in subtle ways.

Fix This in Augment

🤖 Was this useful? React with 👍 or 👎

Comment thread web/test/i18n-mock.ts
*/
export function createUseTranslationMock(translations: TranslationMap = {}) {
return {
useTranslation: () => ({

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

createUseTranslationMock's useTranslation mock ignores the namespace argument (useTranslation('someNs')) even though createTFunction accepts defaultNs. If any code relies on useTranslation(ns) to set the default namespace and then calls t() without { ns: ... }, the mock output will diverge from real behavior.

Fix This in Augment

🤖 Was this useful? React with 👍 or 👎

Comment thread web/test/i18n-mock.ts
*/
export function createTransMock(translations: TranslationMap = {}) {
return {
Trans: ({ i18nKey, children }: {

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

createTransMock ignores common Trans props like components/values and always renders only children ?? i18nKey. Components that rely on <Trans ... components={{...}} /> (e.g., to render embedded links) may not render the expected nodes in tests, reducing assertion fidelity.

Fix This in Augment

🤖 Was this useful? React with 👍 or 👎

Comment thread web/testing/testing.md

- `useTranslation` - returns translation keys with namespace prefix
- `Trans` component - renders i18nKey and components
- `useMixedTranslation` (from `@/app/components/plugins/marketplace/hooks`)

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

This section attributes useMixedTranslation/useGetLanguage (and Trans component rendering) to the global mock in web/vitest.setup.ts, but that setup only mocks react-i18next and the current Trans mock doesn’t render components. Consider rewording to avoid implying these hooks/components are provided by the global mock when they come from their own modules / aren’t fully simulated.

Other Locations
  • .claude/skills/frontend-testing/references/mocking.md:56
  • .claude/skills/frontend-testing/assets/component-test.template.tsx:31

Fix This in Augment

🤖 Was this useful? React with 👍 or 👎

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants