модульный тест реагирует на родную локализацию хука - PullRequest
0 голосов
/ 26 апреля 2020

Я использую библиотеку Reaction-native-Localization и использую этот фрагмент кода из здесь с небольшими изменениями. Он работает для моих нужд, но у меня возникают проблемы при написании модульных тестов, поскольку его нельзя развернуть, если к нему не прикреплен модульный тест.

По сути, я хочу по крайней мере проверить, что язык можно изменить и приблизиться это с фиктивным компонентом, показанным ниже:

Переводы. js

import AsyncStorage from '@react-native-community/async-storage'; // 1
import React, {createContext, useState} from 'react';
import LocalizedStrings from 'react-native-localization'; // 2
import * as RNLocalize from 'react-native-localize'; // 3
import en from '../localization/en.json';
import ru from '../localization/ru.json';

const DEFAULT_LANGUAGE = 'en';
const APP_LANGUAGE = 'appLanguage';

const languages = {en, ru};

const translations = new LocalizedStrings(languages); // 4

export const LocalizationContext = createContext({ // 5
  translations,
  setAppLanguage: () => {}, // 6
  appLanguage: DEFAULT_LANGUAGE, // 7
  initializeAppLanguage: () => {}, // 8
});

export const LocalizationProvider = ({children}) => { // 9
  const [appLanguage, setAppLanguage] = useState(DEFAULT_LANGUAGE);

  // 11
  const setLanguage = language => {
    translations.setLanguage(language);
    setAppLanguage(language);
    AsyncStorage.setItem(APP_LANGUAGE, language);
  };

  // 12
  const initializeAppLanguage = async () => {
    const currentLanguage = await AsyncStorage.getItem(APP_LANGUAGE);

    if (currentLanguage) {
      setLanguage(currentLanguage);
    } else {
      let localeCode = DEFAULT_LANGUAGE;
      const supportedLocaleCodes = translations.getAvailableLanguages();
      const phoneLocaleCodes = RNLocalize.getLocales().map(
        locale => locale.languageCode,
      );
      phoneLocaleCodes.some(code => {
        if (supportedLocaleCodes.includes(code)) {
          localeCode = code;
          return true;
        }
      });
      setLanguage(localeCode);
    }
  };

  return (
    <LocalizationContext.Provider
      value={{
        translations,
        setAppLanguage: setLanguage, // 10
        appLanguage,
        initializeAppLanguage,
      }}>
      {children}
    </LocalizationContext.Provider>
  );
};

Translations.test. js

import 'react-native';
import React, {useContext} from 'react';
import {View, Text} from 'react-native';
import {renderHook, act} from '@testing-library/react-hooks';
import {LocalizationProvider, LocalizationContext} from '../localization';

import renderer from 'react-test-renderer';

describe('Localizaion', () => {
  const DummyComponent: () => React$Node = () => {
    return (
      <>
        <View>
          <LocalizationProvider>
            <Text>Dummy</Text>
          </LocalizationProvider>
        </View>
      </>
    );
  };

  renderer.create(<DummyComponent />);

  const {result} = renderHook(() => useContext(LocalizationContext));

  const definition = result.current;
  // definition.initializeAppLanguage()

  test('should change language', () => {
    act(() => {
      definition.setAppLanguage('german');
    });
    expect(definition.translations.getLanguage()).toBe("german")
  });


});

Тест не пройден, говоря ожидаемый немецкий но получил "ан". Он всегда возвращает то, что находится первым в словаре языков в хуке. Чего мне не хватает?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...