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

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

Open Datpt2508 opened this issue 2 years ago • 7 comments

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?

  • [X] My project is 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

Datpt2508 avatar Oct 11 '23 08:10 Datpt2508

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?

dylancom avatar Oct 11 '23 11:10 dylancom

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 Nov 09 '23 02:11 github-actions[bot]

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

ng-ha avatar Jul 10 '24 08:07 ng-ha

any update ? ..

ng-ha avatar Jul 22 '24 02:07 ng-ha

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

dylancom avatar Jul 22 '24 07:07 dylancom

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.)

DoctorJohn avatar Jul 22 '24 13:07 DoctorJohn

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 Aug 19 '24 13:08 github-actions[bot]