Ionic runtime error cannot read property "toLowerCase" of null - ionic-framework

Question

I am trying to view an app via "ionic serve" but I get this error. I have looked at other subjects but have never seen a runtime error. I tried all of their solutions but I would still have the same error page. Here is what I see:
And to be honest, I am not the coder of this app, but I have bought it from a store. But, I know some here and there. If there is a simple solution to fix this, that would be amazing!
The first error link is pointing to here:
_this.initialData();
var operating_system = '';
var admob = {};
if (_this.device.platform.toLowerCase() == 'android') {
operating_system = 'android';
admob = {
banner: settings['admob_android_banner'],
interstitial: settings['admob_android_interstitial']
};
}
The second error link is pointing me to here:
SafeSubscriber.prototype.__tryOrUnsub = function (fn, value) {
try {
fn.call(this._context, value);
}
catch (err) {
this.unsubscribe();
throw err;
}
};
The third error is pointing to here:
SafeSubscriber.prototype.next = function (value) {
if (!this.isStopped && this._next) {
var _parentSubscriber = this._parentSubscriber;
if (!_parentSubscriber.syncErrorThrowable) {
this.__tryOrUnsub(this._next, value);
}
else if (this.__tryOrSetError(_parentSubscriber, this._next, value)) {
this.unsubscribe();
}
}
The fourth error is pointing to here:
Subscriber.prototype._next = function (value) {
this.destination.next(value);
};
The fifth error is pointing to here:
var /** #type {?} */ response = new Response(responseOptions);
response.ok = isSuccess(status);
if (response.ok) {
responseObserver.next(response);
// TODO(gdi2290): defer complete if array buffer until done
responseObserver.complete();
return;
}
Here is the code I get in cmd:
C:\Users\xx-nj\Desktop\DukhanApp\DukhanColor>ionic serve
Starting app-scripts server: --address 0.0.0.0 --port 8100 --livereload-port 35729 --dev-logger-port 53703 --nobrowser -
Ctrl+C to cancel
[20:02:52] watch started ...
[20:02:52] build dev started ...
[20:02:53] clean started ...
[20:02:53] clean finished in 3 ms
[20:02:53] copy started ...
[20:02:53] deeplinks started ...
[20:02:53] deeplinks finished in 573 ms
[20:02:53] transpile started ...
[20:03:01] transpile finished in 7.70 s
[20:03:01] preprocess started ...
[20:03:01] preprocess finished in 1 ms
[20:03:01] webpack started ...
[20:03:01] copy finished in 8.80 s
[20:03:09] webpack finished in 8.01 s
[20:03:09] sass started ...
Without `from` option PostCSS could generate wrong source map and will not find Browserslist config. Set it to CSS file path or to `undefined` to prevent this warning.
[20:03:13] sass finished in 3.39 s
[20:03:13] postprocess started ...
[20:03:13] postprocess finished in 14 ms
[20:03:13] lint started ...
[20:03:13] build dev finished in 20.14 s
[20:03:13] watch ready in 20.44 s
[20:03:13] dev server running: http://localhost:8100/
[OK] Development server running!
Local: http://localhost:8100
External: http://192.168.8.111:8100
DevApp: celltore_ionic3#8100 on NajmLaptop
[20:03:23] tslint: C:/Users/xx-nj/Desktop/DukhanApp/DukhanColor/src/pages/contactus/contactus.ts, line: 124
'marker' is declared but never used.
L123: let map = new google.maps.Map(element, mapOptions);
L124: let marker = new google.maps.Marker({
L125: title: this.textStatic['cellstore_contact_us_title'],
[20:03:23] tslint: ...s/xx-nj/Desktop/DukhanApp/DukhanColor/src/pages/detailcategory/detailcategory.ts, line: 138
Duplicate variable: 'filter'
L138: for (var filter in this.filter['valueCustom']) {
L139: let attr = this.filter['value'][filter];
[20:03:23] tslint: ...s/xx-nj/Desktop/DukhanApp/DukhanColor/src/pages/detailcategory/detailcategory.ts, line: 140
Duplicate variable: 'option'
L139: let attr = this.filter['value'][filter];
L140: if (attr && Object.keys(attr).length > 0) for (var option in attr) {
L141: if(option != 'select' && attr[option]) {
[20:03:23] tslint: C:/Users/xx-nj/Desktop/DukhanApp/DukhanColor/src/pages/brand/brand.ts, line: 121
Duplicate variable: 'filter'
L121: for (var filter in this.filter['valueCustom']) {
L122: let attr = this.filter['value'][filter];
[20:03:23] tslint: C:/Users/xx-nj/Desktop/DukhanApp/DukhanColor/src/pages/brand/brand.ts, line: 123
Duplicate variable: 'option'
L122: let attr = this.filter['value'][filter];
L123: if (attr && Object.keys(attr).length > 0) for (var option in attr) {
L124: if(option != 'select' && attr[option]) {
[20:03:23] tslint: C:/Users/xx-nj/Desktop/DukhanApp/DukhanColor/src/pages/home/home.ts, line: 300
Duplicate variable: 'diff'
L299: element[i]["due_date"] = false;
L300: var diff = (start.getTime() - today.getTime()) / 1000;
L301: element[i]['time_diff'] = Math.floor(diff);
[20:03:23] tslint: C:/Users/xx-nj/Desktop/DukhanApp/DukhanColor/src/pages/home/home.ts, line: 165
'remaining_time' is declared but never used.
L164: ngOnInit() {
L165: var remaining_time = setInterval(() => {
L166: if (this.navCtrl.getActive().component.name == "HomePage") {
[20:03:23] tslint: C:/Users/xx-nj/Desktop/DukhanApp/DukhanColor/src/pages/search/search.ts, line: 213
Duplicate variable: 'filter'
L213: for (var filter in this.filter['valueCustom']) {
L214: let attr = this.filter['value'][filter];
[20:03:23] tslint: C:/Users/xx-nj/Desktop/DukhanApp/DukhanColor/src/pages/search/search.ts, line: 215
Duplicate variable: 'option'
L214: let attr = this.filter['value'][filter];
L215: if (attr && Object.keys(attr).length > 0) for (var option in attr) {
L216: if(option != 'select' && attr[option]) {
[20:03:23] lint finished in 10.05 s

Answer 1

It seems that platform is not returned properly and that's why it's null.
You didn't include your constructor so i have no idea how your constructor looks like, but the following code snippet is returning platform name properly using the Device plugin you're using in your code.
import { Device } from '#ionic-native/device';
constructor(private device: Device) {}
......
if(this.device.platform.toLowerCase()=='android'){
// Your logic here
}

Answer 2

This happens because you're running ionic serve on web and the cordova platform isn't available there. Ionic Native returns {} when a property doesn't exist (when cordova isn't available), and it throws a console warning for developer assistance.
When one try to retrieve data from {} object then it will return null.
Please try adding below code:
import { Platform } from 'ionic-angular';
//add it in constructor as follows:
constructor( public platform: Platform){
}
//add platform check
if (this.platform.is('cordova')) {
//add your code here
}else{
console.log("Plugin not supported on web");
}