google-signin: Jest test case fails

I’m unable to figure out how to do I fix this jest error when using google sign in

Test suite failed to run

    TypeError: Cannot read property 'BUTTON_SIZE_ICON' of undefined
      
      at Object.<anonymous> (node_modules/react-native-google-signin/GoogleSignin.ios.js:34:20)
      at Object.<anonymous> (node_modules/react-native-google-signin/index.js:1:107)
      at Object.<anonymous> (app/components/screens/login/login.js:6:30)

can you look at it and tell me if there is something I can fix to resolve this issue.

About this issue

  • Original URL
  • State: closed
  • Created 8 years ago
  • Reactions: 10
  • Comments: 18

Most upvoted comments

jest.mock('react-native-google-signin', () => {});

works for me! You can run this code before each test using setupTestFrameworkScriptFile

For people still coming here from google searches, I just integrated this with the current version of ‘@react-native-community/google-signin’ and this mock (in __mocks__/@react-native-community/google-signin.ts so it was picked up automatically - no entry in jest.config.js) seemed to work for me:

import { NativeModules } from 'react-native';
jest.mock('@react-native-community/google-signin', () => {
  const mockGoogleSignin = require.requireActual('@react-native-community/google-signin');

  mockGoogleSignin.GoogleSignin.hasPlayServices = () => Promise.resolve(true);
  mockGoogleSignin.GoogleSignin.configure = () => Promise.resolve();
  mockGoogleSignin.GoogleSignin.currentUserAsync = () => {
    return Promise.resolve({
      name: 'name',
      email: 'test@example.com',
      // .... other user data
    });
  };

  // ... and other functions you want to mock

  return mockGoogleSignin;
});

NativeModules.RNGoogleSignin = {
  BUTTON_SIZE_ICON: 0,
  BUTTON_SIZE_STANDARD: 0,
  BUTTON_SIZE_WIDE: 0,
  BUTTON_COLOR_AUTO: 0,
  BUTTON_COLOR_LIGHT: 0,
  BUTTON_COLOR_DARK: 0,
  SIGN_IN_CANCELLED: '0',
  IN_PROGRESS: '1',
  PLAY_SERVICES_NOT_AVAILABLE: '2',
  SIGN_IN_REQUIRED: '3',
  configure: jest.fn(),
  currentUserAsync: jest.fn(),
};

export { NativeModules };

After some trial and error, I managed to make it work by adding an empty file named react-native-google-signin.js in my __mock__ folder. Not that I fully understand why this works…

I cant seem to find a solution for this error. mocking does not work anymore… I still get an error while running test.

` TypeError: Cannot read property ‘SIGN_IN_CANCELLED’ of undefined

   6 | } from 'react-native';
   7 | import PropTypes from 'prop-types';
>  8 | import { GoogleSigninButton } from 'react-native-google-signin';
     | ^
   9 | 
  10 | 
  11 | const Login = ({ onLogin }) => {`

How about mock like this?

// put these in jest setup file
import { NativeModules } from 'react-native';

jest.mock('react-native-google-signin', () => {
  const mockGoogleSignin = require.requireActual('react-native-google-signin');

  mockGoogleSignin.GoogleSignin.hasPlayServices = () => Promise.resolve(true);
  mockGoogleSignin.GoogleSignin.configure = () => Promise.resolve();
  mockGoogleSignin.GoogleSignin.currentUserAsync = () => {
    return Promise.resolve({
      name: 'name',
      email: 'test@email.com',
      // .... other user data
    });
  };

  // ... and other functions you want to mock

  return mockGoogleSignin;
});

NativeModules.RNGoogleSignin = {
  BUTTON_SIZE_ICON: 0,
  BUTTON_SIZE_STANDARD: 0,
  BUTTON_SIZE_WIDE: 0,
  BUTTON_COLOR_AUTO: 0,
  BUTTON_COLOR_LIGHT: 0,
  BUTTON_COLOR_DARK: 0,
  configure: jest.fn(),
  currentUserAsync: jest.fn(),
};

Getting a similar error in React Native Web. Going to try to find a workaround…

@sammysium @haveamission 👋 did you manage to find a workaround? 😄 I found that if I wrap the dependencies in my own file e.g. config/google_signin.ts then I can mock that more easily:

jest.mock('config/google_signin', () => ({
  GoogleSignin: jest.fn(),
  GoogleSigninButton: jest.requireActual(
    '@react-native-community/google-signin'
  ).GoogleSigninButton,
}))

along with test/__mocks__/react-native_modules.ts:

import { NativeModules } from 'react-native'

NativeModules.RNGoogleSignin = {
  SIGN_IN_CANCELLED: '0',
  IN_PROGRESS: '1',
  PLAY_SERVICES_NOT_AVAILABLE: '2',
  SIGN_IN_REQUIRED: '3',
}

export { NativeModules }

which is loaded from package.json:

    "setupFiles": [
      "./test/__mocks__/react-native-modules.ts",
      "./test/setup.ts"
    ],

Now in my components, I just load the components from config/google_signin instead, which is the file that calls configure() in the first place.

@mikehardy had to import __mocks__/@react-native-community/google-signin.ts in my jest.setup.js which is one of the setup files mentioned in jest.config.js. But it’s working now, thanks.

Having same problem still any fix ?

Should this be closed if it isn’t actually fixed? Adding ‘react-native-google-signin.js’ into my mock folder was working but it has suddenly breaking again.