invertase / react-native-google-mobile-ads

React Native Google Mobile Ads enables you to monetize your app with AdMob.
https://docs.page/invertase/react-native-google-mobile-ads
Other
710 stars 148 forks source link

[🐛] Bug InterstitialAd auto close when app change state to Background #468

Closed Datpt2508 closed 2 months ago

Datpt2508 commented 1 year ago

What happened?

I get the error InterstitialAd closes automatically when I retract the app to the background and reopen it. This does not happen for the Foreground state. Can anyone help me keep InterstitialAd when the app is in the background?.

https://github.com/invertase/react-native-google-mobile-ads/assets/107094515/b8f6b3f9-6767-4520-9069-3f13191709b5

Platforms

Android

React Native Info

System:
  OS: macOS 13.2.1
  CPU: (8) x64 Intel(R) Core(TM) i7-8569U CPU @ 2.80GHz
  Memory: 56.30 MB / 16.00 GB
  Shell:
    version: 5.8.1
    path: /bin/zsh
Binaries:
  Node:
    version: 16.19.1
    path: ~/.nvm/versions/node/v16.19.1/bin/node
  Yarn:
    version: 1.22.19
    path: ~/.nvm/versions/node/v16.19.1/bin/yarn
  npm:
    version: 9.6.0
    path: ~/.nvm/versions/node/v16.19.1/bin/npm
  Watchman:
    version: 2023.07.03.00
    path: /usr/local/bin/watchman
Managers:
  CocoaPods:
    version: 1.12.1
    path: /Users/datpt/.rvm/gems/ruby-2.7.6/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 22.4
      - iOS 16.4
      - macOS 13.3
      - tvOS 16.4
      - watchOS 9.4
  Android SDK:
    API Levels:
      - "22"
      - "25"
      - "27"
      - "28"
      - "29"
      - "30"
      - "31"
      - "32"
      - "33"
      - "33"
    Build Tools:
      - 25.0.3
      - 28.0.2
      - 29.0.2
      - 30.0.2
      - 30.0.3
      - 31.0.0
      - 33.0.0
      - 33.0.1
      - 33.0.2
    System Images:
      - android-29 | Intel x86 Atom_64
      - android-29 | Google APIs Intel x86 Atom_64
      - android-29 | Google Play Intel x86 Atom_64
      - android-33 | Google APIs Intel x86_64 Atom
      - android-33 | Google Play Intel x86 Atom_64
    Android NDK: Not Found
IDEs:
  Android Studio: 2022.2 AI-222.4459.24.2221.10121639
  Xcode:
    version: 14.3.1/14E300c
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 11.0.18
    path: /Users/datpt/.jenv/shims/javac
  Ruby:
    version: 2.7.6
    path: /Users/datpt/.rvm/rubies/ruby-2.7.6/bin/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.2.0
    wanted: 18.2.0
  react-native:
    installed: 0.71.11
    wanted: 0.71.11
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: true
  newArchEnabled: false

Are your using Typescript?

package.json

{
  "name": "Phone_Tracker",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "setDevelopment": "ENVFILE=.env.dev",
    "setStaging": "ENVFILE=.env.stg",
    "setProduction": "ENVFILE=.env",
    "android:dev": "yarn setDevelopment react-native run-android --variant=devDebug --appIdSuffix=dev",
    "android:devRelease": "yarn setDevelopment react-native run-android --variant=devRelease",
    "android:stg": "yarn setStaging react-native run-android --variant=stgDebug",
    "android:stgRelease": "yarn setStaging react-native run-android --variant=stgRelease",
    "android:prod": "yarn setProduction react-native run-android --variant=prodDebug",
    "android:prodRelease": "yarn setProduction react-native run-android --variant=prodRelease",
    "ios": "react-native run-ios",
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint .",
    "format": "prettier . --write",
    "run-clear": "rm -rf node_modules; watchman watch-del-all; rm -rf /tmp/metro-*; yarn && npx pod-install; yarn start --reset-cache",
    "clean": "react-native clean-project",
    "postinstall": "patch-package",
    "extract-translation": "node scripts/extract-translation"
  },
  "reactNativePermissionsIOS": [
    "AppTrackingTransparency",
    "LocationAccuracy",
    "LocationAlways",
    "LocationWhenInUse"
  ],
  "dependencies": {
    "@gorhom/bottom-sheet": "^4.4.6",
    "@quan2nd/react-native-activity-state": "^0.1.1",
    "@react-native-async-storage/async-storage": "^1.18.2",
    "@react-native-community/art": "^1.2.0",
    "@react-native-community/blur": "^4.3.2",
    "@react-native-community/geolocation": "^3.0.6",
    "@react-native-community/hooks": "^3.0.0",
    "@react-native-community/netinfo": "^9.4.1",
    "@react-native-firebase/analytics": "^18.5.0",
    "@react-native-firebase/app": "^18.5.0",
    "@react-native-firebase/auth": "^18.5.0",
    "@react-native-firebase/database": "^18.5.0",
    "@react-native-firebase/firestore": "^18.5.0",
    "@react-native-firebase/remote-config": "^18.5.0",
    "@react-native-firebase/storage": "^18.5.0",
    "@react-native-masked-view/masked-view": "^0.2.9",
    "@react-navigation/bottom-tabs": "^6.5.7",
    "@react-navigation/material-top-tabs": "^6.6.2",
    "@react-navigation/native": "^6.1.6",
    "@react-navigation/stack": "^6.3.16",
    "@shopify/flash-list": "^1.4.3",
    "@vlzh/react-modal-manager": "^2.0.0-alpha.4",
    "axios": "^1.4.0",
    "deprecated-react-native-prop-types": "^4.2.1",
    "i18next": "^22.5.0",
    "install": "^0.13.0",
    "lottie-ios": "3.4.0",
    "lottie-react-native": "^5.1.6",
    "moment": "^2.29.4",
    "p-memoize": "^7.1.1",
    "postinstall-postinstall": "^2.1.0",
    "react": "18.2.0",
    "react-i18next": "^13.0.2",
    "react-native": "0.71.11",
    "react-native-admob-native-ads": "^0.6.6",
    "react-native-camera": "^4.2.1",
    "react-native-config": "^1.5.1",
    "react-native-confirmation-code-field": "^7.3.1",
    "react-native-contacts": "^7.0.7",
    "react-native-device-info": "^10.6.0",
    "react-native-dotenv": "^3.4.8",
    "react-native-exit-app": "^2.0.0",
    "react-native-fast-image": "^8.6.3",
    "react-native-fs": "^2.20.0",
    "react-native-geolocation-service": "^5.3.1",
    "react-native-gesture-handler": "^2.12.0",
    "react-native-google-mobile-ads": "^12.2.0",
    "react-native-google-places-autocomplete": "^2.5.1",
    "react-native-iap": "^12.10.5",
    "react-native-image-crop-picker": "^0.40.0",
    "react-native-image-picker": "^5.6.0",
    "react-native-in-app-review": "^4.3.3",
    "react-native-inappbrowser-reborn": "^3.7.0",
    "react-native-indicators": "^0.17.0",
    "react-native-keyboard-aware-scroll-view": "^0.9.5",
    "react-native-linear-gradient": "^2.7.3",
    "react-native-maps": "^1.7.1",
    "react-native-modal": "^13.0.1",
    "react-native-pager-view": "^6.2.0",
    "react-native-paper": "^5.8.0",
    "react-native-paper-dropdown": "^1.0.7",
    "react-native-permissions": "3.6.1",
    "react-native-phone-number-input": "^2.1.0",
    "react-native-progress": "^5.0.0",
    "react-native-qrcode-scanner": "^1.5.5",
    "react-native-qrcode-svg": "^6.2.0",
    "react-native-reanimated": "^3.1.0",
    "react-native-safe-area-context": "^4.5.3",
    "react-native-screens": "^3.20.0",
    "react-native-share": "^7.9.0",
    "react-native-shimmer-placeholder": "^2.0.9",
    "react-native-star-rating-widget": "^1.7.2",
    "react-native-svg": "^13.13.0",
    "react-native-swiper": "^1.6.0",
    "react-native-tab-view": "^3.5.1",
    "react-native-toast-message": "^2.1.6",
    "react-native-uuid": "^2.0.1",
    "react-native-vector-icons": "^9.2.0",
    "react-native-webview": "^13.6.0",
    "react-string-replace": "^1.1.1",
    "rn-fetch-blob": "^0.12.0",
    "uuid": "^9.0.0",
    "yup": "^1.2.0"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0",
    "@babel/plugin-proposal-optional-chaining": "^7.21.0",
    "@babel/preset-env": "^7.20.0",
    "@babel/runtime": "^7.20.0",
    "@react-native-community/eslint-config": "^3.2.0",
    "@trivago/prettier-plugin-sort-imports": "^4.1.1",
    "@tsconfig/react-native": "^2.0.2",
    "@types/jest": "^29.2.1",
    "@types/react": "^18.0.24",
    "@types/react-native-dotenv": "^0.2.0",
    "@types/react-native-indicators": "^0.16.2",
    "@types/react-native-vector-icons": "^6.4.14",
    "@types/react-test-renderer": "^18.0.0",
    "@typescript-eslint/eslint-plugin": "^5.59.6",
    "@typescript-eslint/parser": "^5.59.6",
    "babel-jest": "^29.2.1",
    "babel-plugin-root-import": "^6.6.0",
    "babel-plugin-transform-remove-console": "^6.9.4",
    "eslint": "^8.19.0",
    "eslint-plugin-prettier": "^4.2.1",
    "husky": "^8.0.3",
    "i18next-scanner": "^4.2.0",
    "jest": "^29.2.1",
    "lint-staged": "^13.2.2",
    "metro-react-native-babel-preset": "0.73.9",
    "patch-package": "^8.0.0",
    "prettier": "^2.7.1",
    "prettier-eslint-cli": "^7.1.0",
    "react-native-clean-project": "^4.0.1",
    "react-native-rename": "^3.2.13",
    "react-test-renderer": "18.2.0",
    "typescript": "4.8.4"
  },
  "jest": {
    "preset": "react-native"
  }
}

app.json

{
  "name": "Phone_Tracker",
  "displayName": "Phone_Tracker",
  "react-native-google-mobile-ads": {
    "android_app_id": "xxxx",
    "ios_app_id": "xxxx"
  },
  "ios": {
    "useFrameworks": "static"
  }
}

ios/Podfile

No response

android/build.gradle

No response

android/app/build.gradle

No response

android/settings.gradle

No response

AndroidManifest.xml

No response

dylancom commented 1 year ago

Has been reported before #393 and #411. No one has submitted a fix yet...

Why not dig into the Android code and try to find a fix / submit a PR?

github-actions[bot] commented 1 year ago

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.

ng-ha commented 4 months ago

I have the same issue. @Datpt2508 Have you found the solution ? @dylancom Can you take a look again at this issue, please!

ng-ha commented 4 months ago

any update ? ..

dylancom commented 4 months ago

I did some research and found it is caused by <activity android:launchMode=”singleTask” /> inside '/android/app/src/main/AndroidManifest.xml'. When I removed the line (which is the same as setting it to standard) the modal didn't close anymore.

A user in #411 suggested setting it to <activity android:launchMode=”singleTop” />. But I don't know if you can safely remove / change this without other stuff being affected.

Maybe some other Android experts have some more knowledge on this? @DoctorJohn @mikehardy Do we need to advise a different launchMode for using this package?

Edit: It was introduced to React-Native by this commit https://github.com/facebook/react-native/commit/7a42596438018129d52ff04899ab4ddabd27cdcb, to make sure that the application is resumed when pressing the app icon. So it seems not safe to remove / change this line.

Maybe some learnings from other packages can be used? https://github.com/bitpay/bitpay-app/pull/160, https://github.com/auth0/react-native-auth0/pull/350

DoctorJohn commented 4 months ago

Here's another useful resource I'm currently reading while looking into this issue:

I checked what the Flutter package is using since technically they have similar requirements to RN. They use singleTop and it looks like none reported this issue in their repository.

(However, I stumbled across an issue there that suggest that showing interstitials in the background might result in a warning. I assume that means opening them in the background is not allowed, but this might be something to keep in mind.)

github-actions[bot] commented 3 months ago

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.