Skip to content

Add tests for LocaleProvider persistence and rehydration in src/shared/i18n/LocaleProvider.tsx #581

Description

@Jagadeeshftw

📌 Description

LocaleProvider.tsx and its exported readStoredLocale() helper have no dedicated test file. The logic includes several untested branches: readStoredLocale() falls back to DEFAULT_LOCALE for a window === undefined (SSR) environment, for a missing/invalid localStorage value, and for a localStorage.getItem call that throws (private browsing mode); setLocale() re-validates its input via isLocale() before applying it (guarding against a caller passing an unsupported code); and a useEffect persists the current locale to localStorage and sets document.documentElement.lang, silently swallowing any storage write failure. None of these fallback/guard paths are exercised anywhere.

🧩 Requirements and context

  • Add unit tests for readStoredLocale() covering: no stored value (returns DEFAULT_LOCALE), a valid stored locale (returned as-is), an invalid/unsupported stored value (falls back to DEFAULT_LOCALE), and localStorage.getItem throwing (falls back to DEFAULT_LOCALE without throwing).
  • Add component tests for LocaleProvider/useLocale covering: initialLocale override taking precedence over any stored value, setLocale persisting the new value to localStorage and updating document.documentElement.lang, setLocale called with an invalid locale falling back to DEFAULT_LOCALE rather than applying it, and useLocale() throwing when called outside a LocaleProvider.
  • Add a test confirming a localStorage.setItem failure during the persistence effect doesn't crash the provider (the locale state still updates in memory).

Non-functional requirements

  • Must be secure, tested, and documented.
  • Should be efficient and easy to review.

🛠️ Suggested execution

1. Fork the repo and create a branch

git checkout -b test/locale-provider-persistence-coverage

2. Implement changes

  • Add test: new src/shared/i18n/LocaleProvider.test.tsx covering readStoredLocale(), LocaleProvider, and useLocale() as described above.

3. Test and commit

  • Run tests:
npm test -- run LocaleProvider
  • Cover edge cases: private-mode localStorage access throwing on both read and write, an initialLocale prop combined with a different stored value, switching locale twice in a row and confirming the final persisted value is the latest one.
  • Include test output and details in the PR description.

Example commit message

test: cover LocaleProvider storage fallback and rehydration behavior

✅ Acceptance criteria

  • readStoredLocale() is covered for missing, valid, invalid, and throwing localStorage cases, verified by test.
  • setLocale rejects an unsupported locale and falls back to DEFAULT_LOCALE, verified by test.
  • useLocale() throws a clear error when used outside LocaleProvider, verified by test.

🔒 Security notes

Confirming setLocale's runtime isLocale() guard actually rejects unsupported values (rather than only the type system enforcing it) prevents a crafted/stale localStorage value from ever driving an unsupported locale into I18nProvider.

📋 Guidelines

  • Minimum 95% test coverage
  • Clear documentation
  • Timeframe: 96 hours

Metadata

Metadata

Assignees

Labels

GrantFox OSSGrantFox open-source programMaybe RewardedGrantFox: potentially rewarded contributionOfficial Campaign | FWC26GrantFox official campaign issuefrontendFrontend / UI worktestingTests and coverage

Type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions