Exported LoadingScreen testId and language Storage item key in order to be used in unit tests

This commit is contained in:
gianantoniopini
2021-01-22 06:36:11 +01:00
parent 0bab0d01d1
commit 16ed433705
4 changed files with 15 additions and 9 deletions

View File

@ -3,8 +3,10 @@ import React, { memo } from 'react';
import { getRandomTip } from '../../data/tips'; import { getRandomTip } from '../../data/tips';
import Logo from '../shared/Logo'; import Logo from '../shared/Logo';
const dataTestId = 'loading-screen';
const LoadingScreen = () => ( const LoadingScreen = () => (
<Modal open hideBackdrop> <Modal data-testid={dataTestId} open hideBackdrop>
<Fade in> <Fade in>
<div className="w-screen h-screen flex justify-center items-center outline-none"> <div className="w-screen h-screen flex justify-center items-center outline-none">
<div className="flex flex-col items-center"> <div className="flex flex-col items-center">
@ -17,3 +19,4 @@ const LoadingScreen = () => (
); );
export default memo(LoadingScreen); export default memo(LoadingScreen);
export { dataTestId };

View File

@ -2,6 +2,8 @@ import i18next from 'i18next';
import React, { createContext, memo, useEffect, useState } from 'react'; import React, { createContext, memo, useEffect, useState } from 'react';
import themeConfig from '../data/themeConfig'; import themeConfig from '../data/themeConfig';
const languageStorageItemKey = 'language';
const defaultState = { const defaultState = {
theme: 'Dark', theme: 'Dark',
setTheme: () => {}, setTheme: () => {},
@ -18,7 +20,7 @@ const SettingsProvider = ({ children }) => {
useEffect(() => { useEffect(() => {
const prefTheme = localStorage.getItem('theme') || defaultState.theme; const prefTheme = localStorage.getItem('theme') || defaultState.theme;
const prefLanguage = const prefLanguage =
localStorage.getItem('language') || defaultState.language; localStorage.getItem(languageStorageItemKey) || defaultState.language;
setTheme(prefTheme); setTheme(prefTheme);
setLanguage(prefLanguage); setLanguage(prefLanguage);
}, []); }, []);
@ -32,7 +34,7 @@ const SettingsProvider = ({ children }) => {
}, [theme]); }, [theme]);
useEffect(() => { useEffect(() => {
localStorage.setItem('language', language); localStorage.setItem(languageStorageItemKey, language);
i18next.changeLanguage(language); i18next.changeLanguage(language);
}, [language]); }, [language]);
@ -54,4 +56,4 @@ export default SettingsContext;
const memoizedProvider = memo(SettingsProvider); const memoizedProvider = memo(SettingsProvider);
export { memoizedProvider as SettingsProvider }; export { memoizedProvider as SettingsProvider, languageStorageItemKey };

View File

@ -10,7 +10,11 @@ import {
import FirebaseStub, { DatabaseConstants } from 'gatsby-plugin-firebase'; import FirebaseStub, { DatabaseConstants } from 'gatsby-plugin-firebase';
import { SettingsProvider } from '../../../contexts/SettingsContext'; import { dataTestId as loadingScreenTestId } from '../../../components/router/LoadingScreen';
import {
SettingsProvider,
languageStorageItemKey,
} from '../../../contexts/SettingsContext';
import { ModalProvider } from '../../../contexts/ModalContext'; import { ModalProvider } from '../../../contexts/ModalContext';
import { UserProvider } from '../../../contexts/UserContext'; import { UserProvider } from '../../../contexts/UserContext';
import { import {
@ -25,7 +29,6 @@ describe('Builder', () => {
let resumeId = null; let resumeId = null;
let resume = null; let resume = null;
let mockDatabaseUpdateFunction = null; let mockDatabaseUpdateFunction = null;
const loadingScreenTestId = 'loading-screen';
async function setup( async function setup(
resumeIdParameter, resumeIdParameter,
@ -118,8 +121,6 @@ describe('Builder', () => {
}); });
describe('settings', () => { describe('settings', () => {
const languageStorageItemKey = 'language';
beforeEach(async () => { beforeEach(async () => {
await setup(DatabaseConstants.demoStateResume1Id); await setup(DatabaseConstants.demoStateResume1Id);
}); });

View File

@ -9,6 +9,7 @@ import FirebaseStub, { DatabaseConstants } from 'gatsby-plugin-firebase';
import '../../../i18n/index'; import '../../../i18n/index';
import '../../../utils/dayjs'; import '../../../utils/dayjs';
import { dataTestId as loadingScreenTestId } from '../../../components/router/LoadingScreen';
import { SettingsProvider } from '../../../contexts/SettingsContext'; import { SettingsProvider } from '../../../contexts/SettingsContext';
import { ModalProvider } from '../../../contexts/ModalContext'; import { ModalProvider } from '../../../contexts/ModalContext';
import { UserProvider } from '../../../contexts/UserContext'; import { UserProvider } from '../../../contexts/UserContext';
@ -20,7 +21,6 @@ import Dashboard from '../dashboard';
describe('Dashboard', () => { describe('Dashboard', () => {
let resumes = null; let resumes = null;
const user = DatabaseConstants.user1; const user = DatabaseConstants.user1;
const loadingScreenTestId = 'loading-screen';
async function setup(waitForLoadingScreenToDisappear = true) { async function setup(waitForLoadingScreenToDisappear = true) {
FirebaseStub.database().initializeData(); FirebaseStub.database().initializeData();