Develop Reference

Admob failed to load with error "at nativeToJSError" - React Native

Issue
I have apps currently running in the product version of my app but for some reason without making any changes to my code I now get the following error when testing my React Native on Android. I've tried both in the android emulator on my computer and on an android device connected to my computer.
It's working perfectly for iOS and worked perfectly for Android before today.
I enabled my ads weeks ago so its not an issue of a lack of inventory, which would show in my debugger as a lack of inventory if that was the case
If anyone has suggestions that would be great! This is preventing me from pushing an important update for my users.
Error
result at nativeToJSError (blob:http://localhost:8081/6fcdf141-5854-4a90-ba10-5e5c347584ab:105783:17)
at AdMobComponent._this.onBannerEvent (blob:http://localhost:8081/6fcdf141-5854-4a90-ba10-5e5c347584ab:106684:64)
at Object.invokeGuardedCallbackImpl (blob:http://localhost:8081/6fcdf141-5854-4a90-ba10-5e5c347584ab:7899:16)
at invokeGuardedCallback (blob:http://localhost:8081/6fcdf141-5854-4a90-ba10-5e5c347584ab:7990:37)
at invokeGuardedCallbackAndCatchFirstError (blob:http://localhost:8081/6fcdf141-5854-4a90-ba10-5e5c347584ab:7994:31)
at executeDispatch (blob:http://localhost:8081/6fcdf141-5854-4a90-ba10-5e5c347584ab:8188:9)
at executeDispatchesInOrder (blob:http://localhost:8081/6fcdf141-5854-4a90-ba10-5e5c347584ab:8208:11)
at executeDispatchesAndRelease (blob:http://localhost:8081/6fcdf141-5854-4a90-ba10-5e5c347584ab:8303:11)
at executeDispatchesAndReleaseTopLevel (blob:http://localhost:8081/6fcdf141-5854-4a90-ba10-5e5c347584ab:8312:16)
at forEachAccumulated (blob:http://localhost:8081/6fcdf141-5854-4a90-ba10-5e5c347584ab:8295:14)
Arguments passed back by error
Arguments [callee: ƒ, Symbol(Symbol.iterator): ƒ]
callee: ƒ render()
arguments: null
caller: null
length: 0
name: "render"
prototype: {constructor: ƒ}
__proto__: ƒ ()
[[FunctionLocation]]: Admob.js:33
[[Scopes]]: Scopes[3]
length: 0
Symbol(Symbol.iterator): ƒ values()
arguments: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.invokeGetter (<anonymous>:2:14)]
caller: [Exception: TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them at Function.invokeGetter (<anonymous>:2:14)]
length: 0
name: "values"
__proto__: ƒ ()
[[Scopes]]: Scopes[0]
__proto__: Object
Admob Component Code
The code is exactly as it is from the react-native app, the only change I've made is removing the app & unit Ids. I've checked to ensure they are correct through.
import React, {Component} from 'react';
import {
StyleSheet,
View,
Text,
Dimensions,
Image,
TouchableWithoutFeedback
} from 'react-native';
import firebase from 'react-native-firebase';
const Analytics = firebase.analytics()
const Admob = firebase.admob()
const Banner = firebase.admob.Banner;
const AdRequest = firebase.admob.AdRequest;
const request = new AdRequest().addTestDevice()
export default class AdmobComponent extends React.Component{
constructor(props){
super(props);
Admob.initialize('Removed for privacy')
this.state = {};
}
onBannerPress() {
console.log('add button butotn pushed')
Analytics.logEvent('banner_click')
}
render(){
return(
<View>
<TouchableWithoutFeedback
style={styles.adMobTouch}
onPress={() => this.onBannerPress()}
>
<Banner
size={"SMART_BANNER"}
unitId={'Removed for private'}
request={request.build()}
onAdLoaded={() => {
console.log('Advert loaded');
}}
onAdFailedToLoad={(result) => {
console.log('result', result)
console.log('Ad failed to load', arguments)
}}
/>
</TouchableWithoutFeedback>
</View>
)
}
}

For development purposes unitId need to be one of the predefined values https://developers.google.com/admob/android/test-ads?hl=en-GB
Banner:
ca-app-pub-3940256099942544/6300978111
Interstitial:
ca-app-pub-3940256099942544/1033173712
Interstitial Video:
ca-app-pub-3940256099942544/8691691433
Rewarded Video:
ca-app-pub-3940256099942544/5224354917
Native Advanced:
ca-app-pub-3940256099942544/2247696110
Native Advanced Video:
ca-app-pub-3940256099942544/1044960115

I also had the same error, it is actually not an error, you just have to make a production release apk, when there will be so many hits to admob from your users then admob will start showing real ads, meanwhile you will still see this error on the development mode but will work fine in the production mode of your apk, just make the release apk and the ads will start with in 24 Hours when there are too many request for ads from your app!..
More information ===> https://github.com/invertase/react-native-firebase/issues/2054

React native android undefined is not a function works in IOS

Works in IOS and works in Android when the debugger is running, but doesn't work via Android Simulator. I get this message via react-native log-android and basically I am just having nothing returned to the screen:
12-02 10:39:58.511 22502 24204 W ReactNativeJS: TypeError: undefined is not a function (near '...}).flat()
Android Picture
IOS Picture
Here is the fetch function I am using:
import axios from 'axios';
export const getData = async url => {
try {
const response = await axios.get(url);
const data = response.data;
return data;
} catch (error) {
console.log(error);
}
};
export default getData;
Inside of my componentDidMount, where I call the endpoint using the GetData function above:
componentDidMount() {
const teamsAPI = 'https://statsapi.web.nhl.com/api/v1/teams';
getData(teamsAPI).then(teams => {
const teamData = teams.teams
.map(({ id, name }) => ({
teamId: id,
teamName: name
}))
.flat()
this.setState({
teams: teamData
});
});
}
Everything has since been moved to REDUX, but I looked back at one of my branches today with the more basic code shared above and had the issue back then with this code as well. Unfortunately didn't realize all the differences with code compilations till now. Understand that the issue is probably because of 2 compilers, but have no idea how to approach the issue/ why there would be a type error in one and not the other.
It works with debugger I think due to what was mentioned here:
React Native behavior different in simulator / on device / with or without Chrome debugging
Edit: wanted to mention I've already done a cache reset and deleted the build folder and rebuilt

I tried out your code and the promise rejecting is happing for me in both Android and iOS. It is being caused by the .flat() removing it stops the promise rejection from occurring.
Looking at the data that you are mapping there there doesn't seem to be a need to flatten the data as it comes back as a array of objects with no other arrays inside it.
Could removing the .flat() be a possible solution for you?
You can see here for more information about .flat() and how it is still experimental array.prototype.flat is undefined in nodejs
I would also consider returning something from your getData function when it makes an error or perhaps use a promise with it that way you can handle an error.

Ionic Force App Update crashes when calling the function to update the App

I have an Ionic 3 App that needs to use Force Update to all users of the App. I used this package called Ionic App Update. I created an small express server that will just serve the client for an updates.
Here is my code in my update.xml in the server or backend
<update>
<version>0.0.2</version>
<name>MyApp</name>
<url>http://192.168.214.27:3346/public/android-debug.apk</url>
</update>
and in my server.js
const express = require('express')
const app = express()
app.use('/public', express.static('public'))
app.get('/', (req, res) => {
shell.exec('./update.sh')
})
app.listen(3336, () => {})
The server is working fine there is no errors
But when I try to call the function of the App Update plugin the device crashes every time.
Here is my code in my app.component.ts
constructor() {
this.update()
}
update() {
console.log('Update check')
const updateUrl = 'http://192.168.214.27:3346/public/update.xml';
this.appUpdate.checkAppUpdate(updateUrl).then(() => { console.log('Update available') }).catch(err => {
console.log(err)
console.log('No update')
});
}
I am calling the update function every time the app component constructor is initialize.
But when I call the function the app crashes
Is this more of an android version issue or what?
Appreciate if someone could help.
Thanks in advance.

This line <version>0.0.2</version> seems to be the problem. This isn't the format for android version numbers. As per cordova's documentation it is
Expressed in major/minor/patch notation.
For example version 30.20.48 would be written as 302048.
Read More:
config.xml - https://cordova.apache.org/docs/en/latest/config_ref/
Android Platform Guide - https://cordova.apache.org/docs/en/latest/guide/platforms/android/index.html#setting-the-version-code

How to set an Alarm with React Native IOS and Android devices

I'm looking to make an app to set alarms/reminders and then you can manually stop/snooze.
I found some libraries for instance:
react-native-alarm I followed the instructions of how to setting up with Android and IOS but it failed when I tried to set an alarm, example code:
RNAlarm.setAlarm(
Date.parse("2018-01-01T18:40:24Z").toString(),
'Meeting with customer',
'',
'',
() => {
console.log("Event triggered");
},
() => {
console.log("Event trigger Failed");
});
It didn't trigger the event. it looks the library is not working base in the issues section .
react-native-calendar-events it didn't work as I expected since it used the calendar set reminders in the device . Does somebody know how to accomplies this in a react native application?

How to properly use iOS only components in React Native without error in Android

I'm new to React Native and testing out PushNotificationIOS. But the checkpermission call is giving me error on Android.
ExceptionsManager.js:61 Cannot read property 'checkPermissions' of undefined
I'm guessing this is because I need to only use the component on iOS. How do I add a check of the OS to make the call only on iOS?
Here's my code:
componentWillMount: function() {
//-- need an OS check here??
PushNotificationIOS.checkPermissions((data)=> {
console.log("in comp will mount: checking for permission")
console.log(data.alert)
console.log(data.badge)

What I would suggest is splitting that platform specific code in separate files.
React Native will detect when a file has a .ios. or .android.
extension and load the relevant platform file when required from other
components.
MyFile.ios.js
MyFile.android.js
You can then require the component as follows:
const MyFile= require('./MyFile');
and use it like this
componentWillMount: function() {
//-- it would call the logic of what ever platform was detected automatically
MyFile.CallWhatEver();
And it will run the platform specific code.
Another way is the
Platform Module
React Native provides a module that detects the platform in which the
app is running. You can use the detection logic to implement
platform-specific code. Use this option when only small parts of a
component are platform-specific.
if(Platform.OS === 'ios')
There is also a platform.select that can accept any value
const Component = Platform.select({
ios: () => //function goes here,
android: () => require('ComponentAndroid'),
})();
link
https://facebook.github.io/react-native/docs/platform-specific-code.html