💡 What: Optimized `LanguageProvider` to use lazy state initialization for `language` and removed `isInitialized` state. 🎯 Why: The previous implementation triggered a second render on mount because it initialized state to 'de' and then updated it in a `useEffect`. 📊 Impact: Reduces initial render count of the entire application by 50% (from 2 to 1). 🔬 Measurement: Verified with `src/i18n/__tests__/initialRender.test.tsx` which confirms the render count is now 1. Co-authored-by: ragusa-it <196988693+ragusa-it@users.noreply.github.com>
37 lines
1.1 KiB
TypeScript
37 lines
1.1 KiB
TypeScript
// @vitest-environment jsdom
|
|
import { render, act } from '@testing-library/react';
|
|
import { LanguageProvider, useTranslation } from '../index';
|
|
import { describe, it, expect } from 'vitest';
|
|
|
|
describe('LanguageProvider Initial Render', () => {
|
|
it('should verify initial render count', async () => {
|
|
let renderCount = 0;
|
|
|
|
const Consumer = () => {
|
|
useTranslation();
|
|
renderCount++;
|
|
return null;
|
|
};
|
|
|
|
render(
|
|
<LanguageProvider>
|
|
<Consumer />
|
|
</LanguageProvider>
|
|
);
|
|
|
|
// Wait for any effects to run
|
|
await act(async () => {
|
|
await new Promise(resolve => setTimeout(resolve, 10));
|
|
});
|
|
|
|
// After optimization, renderCount should be 1.
|
|
// Previously it was 2.
|
|
expect(renderCount).toBe(1);
|
|
|
|
// Verify lang attribute is set (getInitialLanguage defaults to 'de' in jsdom if window undefined,
|
|
// but in jsdom window IS defined. navigator.language usually defaults to en-US in jsdom)
|
|
// We just check it's set to something valid ('en' or 'de')
|
|
expect(['en', 'de']).toContain(document.documentElement.lang);
|
|
});
|
|
});
|