Skip to content

fix: stop false-positive "Missing records in staticData" SSR warning#3524

Open
Anty0 wants to merge 1 commit into
mainfrom
jirikuchynka/fix-ssr-missing-records-warning
Open

fix: stop false-positive "Missing records in staticData" SSR warning#3524
Anty0 wants to merge 1 commit into
mainfrom
jirikuchynka/fix-ssr-missing-records-warning

Conversation

@Anty0
Copy link
Copy Markdown
Member

@Anty0 Anty0 commented Jun 3, 2026

Problem

useTolgeeSSR (React) and TolgeeProvider (Vue) log

Tolgee: Missing records in "staticData" for proper SSR functionality: "<ns>:<lang>"

even when the required records are present in staticData. SSR works correctly — the warning is simply wrong, which sends users debugging a non-existent problem.

The two sites built the comparison key inline as `${namespace}:${language}`, but every cache key in @tolgee/core is produced by encodeCacheKey as `${language}:${namespace}`. Because the orders are inverted, the lookup never matched and every record was reported missing.

This duplicated, hand-rolled encoding is the root cause: the format rule lived in three independent copies, and the two SSR copies silently drifted from the canonical one.

Solution

  • Export encodeCacheKey from @tolgee/core (it already flows to @tolgee/web via export *) and reuse it at both SSR sites instead of re-deriving the key format. This removes the duplication so the orders can no longer drift apart.
  • Emit the warning only when records are actually missing — a sufficient staticData set previously still logged an empty …functionality: message (reachable in Vue via lazy/function-valued static data).
  • Add regression tests: both packages cover the false-positive (a provided namespaced record must not be reported missing), and Vue additionally covers the empty-list guard via function-valued static data. The expected key is derived from encodeCacheKey so the tests catch any future drift on either side.

Out of scope

In React the missing-records check compares against the cache (getAllRecords()), which never stores function-valued (lazy) static data, so a React app that supplies all required namespaces as lazy loaders would still see a false warning. This is pre-existing behaviour on a different axis (lazy vs. eager) and is left for a separate change; the React empty-records guard here is therefore defensive only, since missing-records and the loaded check derive from the same cache.

Supersedes #3518 (external PR; reuses the canonical encoder rather than only correcting the literals, and adds tests).

Summary by CodeRabbit

  • New Features

    • Exposed encodeCacheKey in the core package API.
  • Bug Fixes

    • Improved SSR missing-records detection consistency by standardizing cache key encoding across React and Vue.
  • Tests

    • Added integration tests covering SSR missing-records warning behavior in React and Vue.

@coderabbitai
Copy link
Copy Markdown

coderabbitai Bot commented Jun 3, 2026

Review Change Stack

Walkthrough

Core now publicly re-exports encodeCacheKey. React and Vue SSR code paths use encodeCacheKey(descriptor) to compute missing-record cache keys, and new integration tests for both frameworks assert the updated warning behavior.

Changes

SSR Cache Key Standardization

Layer / File(s) Summary
Core API export
packages/core/src/index.ts
encodeCacheKey is re-exported from the core package's public entry point.
React SSR cache key standardization
packages/react/src/useTolgeeSSR.ts, packages/react/src/__integration/useTolgeeSSR.spec.tsx
useTolgeeSSR computes missingRecords using encodeCacheKey(descriptor); integration test validates warnings reference canonical encoded cache keys and only appear when records are truly missing.
Vue SSR cache key standardization
packages/vue/src/TolgeeProvider.ts, packages/vue/src/__integration/TolgeeProviderSsr.spec.ts
TolgeeProvider derives missing-record keys via encodeCacheKey(descriptor); integration tests assert the presence/absence of the “Missing records” warning depending on provided SSR static data.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

🐰 I hopped through keys both new and old,
encoders shared so stories told.
React and Vue now sing the same,
SSR warnings call one name.
A tiny hop — the cache is bold.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 50.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title directly and accurately describes the main fix: addressing false-positive SSR warnings for missing records, which is the core objective and primary change across all modified files.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch jirikuchynka/fix-ssr-missing-records-warning

Comment @coderabbitai help to get the list of available commands and usage tips.

useTolgeeSSR (React) and TolgeeProvider (Vue) built the comparison key
inline as `${namespace}:${language}`, the inverse of core's encodeCacheKey
(`${language}:${namespace}`), so every present record was reported missing.

Both sites now reuse the now-exported encodeCacheKey instead of re-deriving
the format, removing the duplication that allowed the drift. The warning is
also emitted only when records are actually missing, so a sufficient
staticData set no longer logs an empty warning.

Adds regression tests in both packages for the false-positive, plus a Vue
test for the empty-list guard (reachable there via function-valued static
data; in React the guard is defensive only, since missing records and the
loaded check derive from the same cache).
@Anty0 Anty0 force-pushed the jirikuchynka/fix-ssr-missing-records-warning branch from 0e6f170 to 92eff3d Compare June 3, 2026 12:04
Copy link
Copy Markdown

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@packages/react/src/__integration/useTolgeeSSR.spec.tsx`:
- Around line 34-50: Add a new test that asserts no warning is emitted when all
required SSR records are present: render SsrComponent with data containing both
keys created via encodeCacheKey({ language: 'en', namespace: 'common' }) and
encodeCacheKey({ language: 'en', namespace: 'extra' }) (use enCommon and a
simple { extra: 'Extra' } object), then expect warnSpy.not.toHaveBeenCalled();
place this alongside the existing "warns only..." spec so it validates the
empty-list/no-warning scenario.
- Line 1: Add a second SSR test alongside the existing missing-records test that
supplies all required translation keys so missingRecords is empty and assert
that warnSpy was not called; locate the existing test suite (the one importing
act) and add a new test (e.g., "does not warn when all required records are
provided (SSR)") which sets up the SSR Tolgee provider with the full set of
required keys, renders/executes the same SSR path used by the existing test,
then expect(warnSpy).not.toHaveBeenCalled(); optionally, if you prefer
consistency, import act from `@testing-library/react` instead of react (this is
not necessary for correctness).
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: bb95342d-2efd-4b60-9d83-1dda6d5c6d15

📥 Commits

Reviewing files that changed from the base of the PR and between 0e6f170 and 92eff3d.

📒 Files selected for processing (5)
  • packages/core/src/index.ts
  • packages/react/src/__integration/useTolgeeSSR.spec.tsx
  • packages/react/src/useTolgeeSSR.ts
  • packages/vue/src/TolgeeProvider.ts
  • packages/vue/src/__integration/TolgeeProviderSsr.spec.ts
🚧 Files skipped from review as they are similar to previous changes (4)
  • packages/core/src/index.ts
  • packages/react/src/useTolgeeSSR.ts
  • packages/vue/src/TolgeeProvider.ts
  • packages/vue/src/__integration/TolgeeProviderSsr.spec.ts

Comment thread packages/react/src/__integration/useTolgeeSSR.spec.tsx
Comment thread packages/react/src/__integration/useTolgeeSSR.spec.tsx
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.

1 participant