TypeError: Cannot read property 'language' of undefined

Viewed 3781

I'm trying to run App-test.js file provided by react native in __test__ that is

import 'react-native';
import React from 'react';
import App from '../src/app';

// Note: test renderer must be required after react-native.
import renderer from 'react-test-renderer';

it('renders correctly', () => {
  renderer.create(<App />);
});

Jest in package.json looks like this

...
  "jest": {
    "preset": "react-native",
    "setupFiles": [
      "<rootDir>/node_modules/react-native-gesture-handler/jestSetup.js"
    ],
    "transformIgnorePatterns": [
      "node_modules/(?!react-native)/"
    ],
    "globals": {
      "__DEV__": true
    },
    "testEnvironment": "node"
  }
...

I'm using package react-native-localization that is working fine in app but giving error while running jest, that is:

__tests__/App-test.js
  ● Test suite failed to run

    TypeError: Cannot read property 'language' of undefined

       5 | import fr from './fr';
       6 | 
    >  7 | let localize = new LocalizedStrings({
         |                ^
       8 |     en: en,
       9 |     fr: fr
      10 | });

      at Object.customLanguageInterface (node_modules/react-native-localization/lib/LocalizedStrings.js:49:23)
      at LocalizedStrings.call (node_modules/localized-strings/lib/LocalizedStrings.js:67:42)
      at new LocalizedStrings (node_modules/react-native-localization/lib/LocalizedStrings.js:63:117)
      at Object.<anonymous> (src/common/language/localizeController.js:7:16)
      at Object.<anonymous> (src/containers/auth/launchScreen.js:25:1)

  console.error node_modules/fbjs/lib/warning.js:30

localizeController.js is

import LocalizedStrings from 'react-native-localization';

import en from './en';
import fr from './fr';

let localize = new LocalizedStrings({
    en: en,
    fr: fr
});

export default localize;

Using it like this in launchScreen

import localize from '@common/language/localizeController';

...

<Text style={styles.titleText}>{localize.Title}</Text>

...

As this localize is used in all components, I can't test any component.

3 Answers

Create jest-setup.js file (if already not exists) and add following lines in that

import { NativeModules } from 'react-native';

NativeModules.ReactLocalization = {
    language: 'en',
};

now add this to package.json, now JEST in package.json looks like this.

...
"jest": {
    "preset": "react-native",
    "transformIgnorePatterns": [
      "node_modules/(?!react-native|react)/"
    ],
    "setupFiles": [
      "<rootDir>/jest-setup.js"
    ],
    "globals": {
      "__DEV__": true
    },
    "testEnvironment": "node"
  }
...

Now this error is gone. Source

Are en and fr objects containing a Title property?

en.js should look something like:

export default {
   en: {
    Title: "some title in english"
   }
}

As Ghayoor ul Haq suggested, only the first step is enough for me. It solved the issue.

import { NativeModules } from 'react-native';

NativeModules.ReactLocalization = {
    language: 'en',
};
Related