react-native-google-mobile-ads icon indicating copy to clipboard operation
react-native-google-mobile-ads copied to clipboard

[🔥] Unable to test with Jest

Open dawidvdh opened this issue 2 years ago • 6 comments

Issue

I am unable to test with jest, when I attempt to test with jest using the default react-native jest test config:

module.exports = {
  preset: 'react-native',
  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
};

I get the following error:

    /path/node_modules/@invertase/react-native-google-ads/lib/index.js:18
    import version from './version';
    ^^^^^^

    SyntaxError: Cannot use import statement outside a module

    > 1 | import {AdsConsentStatus} from '@invertase/react-native-google-ads';
        | ^
      2 | import {renderHook} from '@testing-library/react-hooks';
      3 | import useAdmobConsent from '../useAdmobConsent';
      4 |

Project Files

Javascript

Click To Expand

package.json:

# N/A

admob.json:

# N/A

iOS

Click To Expand

ios/Podfile:

# N/A

Android

Click To Expand

android/build.gradle:

// N/A

android/app/build.gradle:

// N/A

android/settings.gradle:

// N/A

AndroidManifest.xml:

<!-- N/A -->

Environment

Click To Expand

react-native info output:

System:
    OS: macOS 12.2
    CPU: (8) arm64 Apple M1
    Memory: 101.30 MB / 16.00 GB
    Shell: 5.8 - /opt/homebrew/bin/zsh
  Binaries:
    Node: 16.3.0 - ~/.nvm/versions/node/v16.3.0/bin/node
    Yarn: 1.22.17 - ~/.nvm/versions/node/v16.3.0/bin/yarn
    npm: 8.4.1 - ~/.nvm/versions/node/v16.3.0/bin/npm
    Watchman: 2022.01.31.00 - /opt/homebrew/bin/watchman
  Managers:
    CocoaPods: Not Found
  SDKs:
    iOS SDK:
      Platforms: DriverKit 21.2, iOS 15.2, macOS 12.1, tvOS 15.2, watchOS 8.3
    Android SDK:
      API Levels: 28, 29, 30, 31
      Build Tools: 29.0.2, 29.0.3, 30.0.2, 30.0.3, 31.0.0, 32.0.0
      System Images: android-30 | Google APIs Intel x86 Atom, android-30 | Google Play ARM 64 v8a
      Android NDK: Not Found
  IDEs:
    Android Studio: 4.2 AI-202.7660.26.42.7351085
    Xcode: 13.2.1/13C100 - /usr/bin/xcodebuild
  Languages:
    Java: 1.8.0_292 - /usr/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: 17.0.2 => 17.0.2
    react-native: 0.67.2 => 0.67.2
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found
  • Platform that you're experiencing the issue on:
    • [ ] iOS
    • [ ] Android
    • [ ] iOS but have not tested behavior on Android
    • [ ] Android but have not tested behavior on iOS
    • [x] Both
  • Are you using TypeScript?
    • Y & 4.4.4

  • 👉 Check out Invertase on Twitter for updates on the library.

dawidvdh avatar Feb 08 '22 18:02 dawidvdh

According to the documentation AdsConsentStatus should be imported like this import { AdsConsent, AdsConsentStatus } from 'react-native-google-mobile-ads';

jossifelefteriadis avatar Feb 08 '22 18:02 jossifelefteriadis

@dawidvdh please switch from the old module: @invertase/react-native-google-ads to the new react-native-google-mobile-ads. Probably related to #64 which was been fixed in the new module.

dylancom avatar Feb 09 '22 09:02 dylancom

@dylancom and @jossifelefteriadis you are both correct, some how I seem to have installed the old module, however even with the new module I am still unable to test with a different error this time:

  ● Test suite failed to run

    Invariant Violation: `new NativeEventEmitter()` requires a non-null argument.

      at invariant (node_modules/invariant/invariant.js:40:15)
      at new NativeEventEmitter (node_modules/react-native/Libraries/EventEmitter/NativeEventEmitter.js:44:7)
      at new GANativeEventEmitter (node_modules/react-native-google-mobile-ads/lib/commonjs/internal/GoogleMobileAdsNativeEventEmitter.ts:26:5)
      at Object.<anonymous> (node_modules/react-native-google-mobile-ads/lib/commonjs/internal/GoogleMobileAdsNativeEventEmitter.ts:81:50)
      at Object.<anonymous> (node_modules/react-native-google-mobile-ads/lib/commonjs/internal/registry/nativeModule.ts:21:1)

The test is intentionally made really simple:

import {AdsConsentStatus} from 'react-native-google-mobile-ads';

it('will initially have a consent status of unknown', () => {
    expect(AdsConsentStatus.UNKNOWN).toBe(AdsConsentStatus.UNKNOWN);
});

I am able to get past this by adding the following to my jest-setup file:

jest.mock('react-native/Libraries/EventEmitter/NativeEventEmitter');

But I wonder if this is the correct approach?

dawidvdh avatar Feb 09 '22 11:02 dawidvdh

While searching for a solution I found that our maintainer @mikehardy recommends this approach! https://github.com/react-native-device-info/react-native-device-info/issues/1360

dylancom avatar Feb 09 '22 11:02 dylancom

Great! Should I open a PR to add this to the docs somewhere or is this a very unique issue? otherwise we can close this issue.

dawidvdh avatar Feb 09 '22 12:02 dawidvdh

Unfortunately it is not a unique issue in the sense that it is likely a problem for every single use of jest when testing react-native modules that have native code. However, the point of a "tips and tricks" page of documentation (which I am open to...) is not to be some gatekeeper of "this is unique to this module..." it's to reduce issue triage requirements for maintainers so they may focus on real development tasks instead of answering the same problem over and over. In other words - in a very practical sense: having this documented somewhere has utility. If you wanted to PR to the docs to make a new FAQ sidebar entry and start an FAQ page with an entry containing this, that could be a help to future integrators and maintainers

mikehardy avatar Feb 09 '22 13:02 mikehardy

Hello 👋, to help manage issues we automatically close stale issues.

This issue has been automatically marked as stale because it has not had activity for quite some time.Has this issue been fixed, or does it still require attention?

This issue will be closed in 15 days if no further activity occurs.

Thank you for your contributions.

github-actions[bot] avatar Dec 05 '22 20:12 github-actions[bot]