Cannot read property 'environment' of null - ionic native google maps - google-maps

When running my ionic project with ionic serve -c
Everytime, I get an this error :
ERROR TypeError: Cannot read property 'environment' of null
at Function.Environment.setEnv (index.js:1980)
at HomePage.webpackJsonp.194.HomePage.loadMap (home.ts:98)
at HomePage.webpackJsonp.194.HomePage.ionViewDidLoad (home.ts:45)
at ViewController._lifecycle (view-controller.js:486)
at ViewController._didLoad (view-controller.js:369)
at NavControllerBase._didLoad (nav-controller-base.js:768)
at t.invoke (polyfills.js:3)
at Object.onInvoke (core.js:4760)
at t.invoke (polyfills.js:3)
at r.run (polyfills.js:3)
There is the loadMap method :
loadMap() {
Environment.setEnv({
'API_KEY_FOR_BROWSER_DEBUG' : '',
'API_KEY_FOR_BROWSER_RELEASE' : ''
})
this.geoLocation.getCurrentPosition().then((resp) => {
this.latitude = resp.coords.latitude;
this.longitude = resp.coords.longitude;
console.log(this.latitude);
console.log(this.longitude);
let CurrentPosition : LatLng = new LatLng(this.latitude,this.longitude);
let CameraPosition : CameraPosition<ILatLng> = {
target : CurrentPosition,
zoom : 18
};
this.addMarker();
this.map.moveCamera(CameraPosition);
}).catch((error) => {
console.log('Error getting location', error);
});
this.map = GoogleMaps.create('map_canvas');
}
I don't understand. I only launch my component after the device.isReady() is fired, so it should not be a lifecycle problem.
Do you have any idea as to where does this come from?
Thank you!
EDIT : When using the ionic cordova run browser -l command, the map is loaded without error the first time then on some refresh of the webpage, the error appears again, without me changing anything to the code...

I had the same problem I found the solution on this thread https://stackoverflow.com/a/52681481/6560704
You need to build your platforms to create that 'environment' variable, by using CLI for example :
ionic cordova build browser -l
Hope this will help

Problem solved !
It was in fact a lifecycle problem. I was attributing the HomePage to the rootPage in app.components.ts before the device was ready.

Related

Problem launching Forge Viewer locally instead of through Design Automation/OSS

I’m starting by telling the viewer to launch with the document specified as the bubble.json file:
Helpers.launchViewer('viewerDiv', 'urn:' + '/resources/41bbc339-294e-4eb1-b5ee-f4f303df46bbviewable/bubble.json');//this.props.modelPath);
function launchViewer(div, urn) {
getToken.accessToken.then((token) => {
var options = {
'document': urn,
'env': 'Local',
};
Autodesk.Viewing.Initializer(options, () => {
viewer = new Autodesk.Viewing.GuiViewer3D(document.getElementById(div));
viewer.start(options.document, options);
Autodesk.Viewing.Document.load(urn, options, onDocumentLoadSuccess, onDocumentLoadFailure);
viewer.loadExtension('Autodesk.ModelStructure');
});
});
}
I then get the following errors:
Xhr.js:940 POST http://localhost:3000/oss-ext/v2/acmsessions 404 (Not
Found)
Otg.js:198 Uncaught TypeError: Cannot read property 'manifest' of null
at Otg.js:198
at Function. (Otg.js:143)
at l (Xhr.js:564)
at XMLHttpRequest.u (Xhr.js:668)
I wonder if maybe when I'm returning the files from my server if there's information I'm not including that's needed, or if I'm doing something else incorrecty. Thanks!
EDIT:
I've also tried loading the result.svf instead of the bubble and get the following error:
Error while processing SVF:
{"url":"/derivativeservice/v2/derivatives/urn%3Aresources%2F0d3f37ff-d195-451b-9a3c-35402f326f4dviewable%2Foutput%2F1%2Fresult.svf","exception":"SyntaxError:
Failed to execute 'open' on 'XMLHttpRequest': Invalid
URL","stack":"Error: Failed to execute 'open' on 'XMLHttpRequest':
Invalid URL\n at Object.g._rawGet
(blob:http://localhost:3000/a2115ade-285d-4398-8b8b-ae7704e9cc25:1:60485)\n
at
blob:http://localhost:3000/a2115ade-285d-4398-8b8b-ae7704e9cc25:1:59206\n
at n
...
I solved the problem myself - the Autodesk documentation specifies that 'urn:' has to come before the urn when loading a document. Loading the document locally, the relative file path should be used without the 'urn:' affix.
you dont need to add urn prefix in offline viewer
viewer only supports http/https url as document
refer to 0.svf file to render
for more infomation check this question.

Getting error messages trying to play MP3 of podcast episode with a Media Response Fulfillment

I’m trying to play an mp3 episode of my podcast, and include the graphic per the instructions on this page regarding Media Responses.
https://developers.google.com/actions/assistant/responses#media_responses
The errors have to do with the Cloud Function, per below.
The deployment of your Cloud Function failed:
Function load error: Code in file index.js can't be loaded.
Is there a syntax error in your code?
Detailed stack trace: ReferenceError: conv is not defined
at Object.<anonymous> (/user_code/index.js:8:6)
at Module._compile (module.js:577:32)
at Object.Module._extensions..js (module.js:586:10)
at Module.load (module.js:494:32)
at tryModuleLoad (module.js:453:12)
at Function.Module._load (module.js:445:3)
at Module.require (module.js:504:17)
at require (internal/module.js:20:19)
at getUserFunction (/var/tmp/worker/worker.js:391:24)
at loadUserCode (/var/tmp/worker/worker.js:447:18)
I’m new to Actions on Google, and am not sure where to begin troubleshooting this. It’s my understanding that I can call and play this file using the Inline Editor in Fulfillment.
Below is the code I current have in the Inline Editor.
Greatly appreciate any input on where to go from here.
thanks
doug
'use strict';
const {dialogflow} = require('actions-on-google');
const functions = require('firebase-functions');
const app = dialogflow({debug: true});
if (!conv.surface.capabilities.has('actions.capability.MEDIA_RESPONSE_AUDIO')) {
conv.ask('Sorry, this device does not support audio playback.');
return;
}
conv.ask(new MediaObject({
name: 'The Wiggins Personality Model',
url: 'https://storage.googleapis.com/voicemarketing-assets02/v01/media/Ep001-VoiceMarketing-WigginsPersonalityModel.mp3',
description: 'How Clifford Nass used the Wiggins Personality Model for voice.',
icon: new Image({
url: 'https://storage.googleapis.com/voicemarketing-assets02/v01/media/Ep001-VoiceMarketing-EpKeyart-1400x933-brain.png',
alt: 'Media icon',
}),
}));
app.intent('play.episode', (conv) => {
const mediaStatus = conv.arguments.get('MEDIA_STATUS');
let response = 'Unknown media status received.';
if (mediaStatus && mediaStatus.status === 'FINISHED') {
response = 'Hope you enjoyed the tunes!';
}
conv.ask(response);
});
exports.dialogflowFirebaseFulfillment = functions.https.onRequest(app);
As shown in the stacktrace:
Detailed stack trace: ReferenceError: conv is not defined
conv as an object only exists within the scope of your app.intent, as an object that is part of the callback.
You're making calls to conv.ask outside of that scope, as part of the initial webhook setup. Any conversational bits should be encapsulated within app.intent so that they only run if a given intent is triggered. Here, you can see that your snippet has been moved to within an intent handler.
app.intent('play-media', conv => {
if (!conv.surface.capabilities.has('actions.capability.MEDIA_RESPONSE_AUDIO')) {
conv.ask('Sorry, this device does not support audio playback.');
return;
}
conv.ask(new MediaObject({
name: 'The Wiggins Personality Model',
url: 'https://storage.googleapis.com/voicemarketing-assets02/v01/media/Ep001-VoiceMarketing-WigginsPersonalityModel.mp3',
description: 'How Clifford Nass used the Wiggins Personality Model for voice.',
icon: new Image({
url: 'https://storage.googleapis.com/voicemarketing-assets02/v01/media/Ep001-VoiceMarketing-EpKeyart-1400x933-brain.png',
alt: 'Media icon',
}),
}));
})

Cannot read property on of undefined. Electron BrowserWindow object

I am trying to learn Electron, but am running into an issue with the Pluralsight tutorial I am using. I installed the 'electron-prebuilt' module. I get an error everytime I run "npm start". The window opens as expected, but the error message that pops up in a dialog box kind of ruins the whole thing. Here is the error:
Uncaught Exception:
TypeError: Cannot read property 'on' of undefined at Object.
There's more to the long error message but it won't let me copy and paste, and the rest of the error just refers to the location of the supposed problem on line 14 of my main.js code. Here is my main.js file:
const electron = require('electron')
const app = electron.app
const BrowserWindow = electron.BrowserWindow
let mainWindow
app.on('ready', _ => {
mainWindow = new BrowserWindow({
height: 400,
width: 400
})
})
mainWindow.on('closed', _ => {
console.log('closed')
mainWindow = null
})
It's indicating that the BrowserWindow object I created doesn't have an "on" method, but I know this to be false per the Electron documentation:
https://electronjs.org/docs/api/browser-window
So I'm thinking that the value of mainWindow just isn't being set. I could try instantiating mainWindow with a new BrowserWindow object at the time I declare it, but I get an error message if I try that indicating that I can only instantiate BrowserWindow objects in ready functions.
you have to understand how callbacks work in node.js, callbacks are executed asynchronously, before app.onready fires, mainWindow is still undefined hence the declaration of let mainWindow assigns undefined to mainWindow, take mainWindow.on("closed", ....) into the app.on("ready") event handler. Do this
const electron = require('electron')
const app = electron.app
const BrowserWindow = electron.BrowserWindow
let mainWindow
app.on('ready', _ => {
mainWindow = new BrowserWindow({
height: 400,
width: 400
})
mainWindow.on('closed', _ => {
console.log('closed')
mainWindow = null
})
})
This error also occurs if you are just calling node on your electron script instead of electron. Your npm start script should be calling npx electron . instead, so try running npx electron . or npx electron main.js first. See this relevant issue here:
https://github.com/electron/electron/issues/7475

Protractor tests getting stuck in between while resolving promises when executing in Chrome

My protractor tests were working perfectly fine yesterday on Chrome Browser.
Today, it started failing consistently at a point where in I resolve a Promise. On debugging further, I found that if I commented this promise statement then it would hang at the next promise resolution statement.
There has been no change in the protractor scripts between yesterday and today. There has been some changes made by the developers in the Angular app under test but not major ones.
Can anyone help me point out what might be going wrong here?
Following is the code snippet. Its hanging at the promise resolution statement template.getTemplatesCount().then :-
mainMenu.clickTemplatesMenuOption();
templatePage.getTemplatesCount().then(count => {
console.log("Count of template card is:-"+count.toString());
templateCountBeforeInsert = count;
});
templatePage.openCreateTemplatePanel();
createTemplatePage.createTemplateWithoutDocument(templateName);
My protractor conf.json looks like this:-
exports.config = {
allScriptsTimeout: 30000000,
specs: [
'./e2e/TestPlan/*.ts'
],
capabilities: {
'browserName': 'chrome'
},
directConnect: true,
baseUrl: 'http://10.37.1.86:81/',
getPageTimeout: 120000,
framework: 'jasmine2',
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 120000,
print: function () { }
}
Following are the versions of Tools I am using:-
Protractor:- 5.1.2
ChromeDriver:- `2.32
Chrome Browser :- 61.x
You should be passing a function to your .then() block, it should be this:
templatePage.getTemplatesCount().then((count) => {
console.log("Count of template card is:-"+count.toString());
templateCountBeforeInsert = count;
});
A simple way is add catch() as below:
templatePage.getTemplatesCount().then(count => {
console.log("Count of template card is:-"+count.toString());
templateCountBeforeInsert = count;
})
.catch(function(err){
console.log('getTemplatesCount error: ' + err);
});
If you get the error log, please check getTemplatesCount() inside.

Nativescript navigation, ngrx, and maps(google, MapBox) having subscriber/navigation issues

EDIT: It appears my change detection and lifecycle breaks entirely after navigation to a different component. Why?
I'm having some strange problems with#ngrx/store on nativescript and nativescript map based plugins for google maps and mapbox. Code is correct, maps load perfect with data(markers set) but having issues with subscribing or navigating.
I'ved tried both and they work perfect until I attempt navigation;
With google maps:
Navigation and subscribing to data in other pages works perfect until I try to navigate back/forward again to the maps. I always get an error on google map's onReady method.
With MapBox:
navigation works fine including going back to maps. However, my async pipe fails to actually populate other page data until I navigate back to the original map component!!! I assume the subscriber don't get triggered upon navigating. I managed to get it almost working if I don't unsubscribe with ngOnDestroy() but this sends old or wrong data obviously.
Here is code
Map page(first component):
ngOnDestroy() {
this.subscription.unsubscribe();
}
this is the mapbox code but it's similar for googlemaps, executes with map is loaded and add markers(no problems here on both googlemaps or mapbox).
onMapReady(args) {
let mapMarkers = [];
this.subscription = this.store
.select('mainData')
.subscribe((data: any) => {
if (data !== null) {
this.markers = data.markers.map((mark) => {
return {
lat: mark.venue.lat,
lng: mark.venue.lon,
iconPath: this.iconMaker(mark.group, mark.sport),
userData: mark,
onTap: (marker) => {
let urlExt = "/event/" + mark.id; this.routerExtensions.navigate([urlExt]);
},
}
});
args.map.addMarkers(this.markers);
}
});
When I tap on a map marker, it navigates to this second page(event/:id) that displays the event data related to the map marker.
Event Component
Html:
<StackLayout *ngFor=" let model of models |async" orientation="vertical">
<StackLayout orientation="horizontal" style="padding: 3">
<Label class="h2" textWrap="true" text="Venue: "></Label>
<Label class="h2" textWrap="true" [text]="model.venue.name"></Label>
</StackLayout>
...
Component:
ngOnInit() {
this.route.params
.forEach((params) => {
this.id = +params['id'];
console.dir("Found match" + this.id);
if (params['id']) {
used async pipe to send data to html. In google maps this works perfect, in mapbox it doesn't trigger until I attempt to navigate away. I also attempted to just subscribe to the returned Observable but still same outcome in MapBox;Html not waiting for async loads fine.
this.models = this.mapService.getEvent(this.id);
});
}
});
}
This all works 100% perfect in google maps except I can't navigate back to my map component without it instantly crashing.
I would love for either to work.
I do get lots of errors
for unlinking rxjs module leading me to believe that might be an issue:
02-07 14:29:59.523 24939 24939 W System.err: remove failed: EACCES (Permission denied) : /data/local/tmp/org.nativescript.pickn/sync/tns_modules/rxjs/src/MiscJSDoc.ts
02-07 14:29:59.543 5475 5475 E audit : type=1400 msg=audit(1486499399.523:327875): avc: denied { unlink } for pid=24939 comm="ivescript.pickn" name="MiscJSDoc.ts" dev="sda17" ino=463318 scontext=u:r:untrusted_app:s0:c512,c768 tcontext=u:object_r:shell_data_file:s0 tclass=file permissive=0
02-07 14:29:59.573 24939 24939 W System.err: remove failed: EACCES (Permission denied) : /data/local/tmp/org.nativescript.pickn/sync/tns_modules/rxjs/src/observable/dom/MiscJSDoc.ts
02-07 14:29:59.593 5475 5475 E audit : type=1400 msg=audit(1486499399.573:328068): avc: denied { unlink } for pid=24939 comm="ivescript.pickn" name="MiscJSDoc.ts" dev="sda17" ino=463540 scontext=u:r:untrusted_app:s0:c512,c768 tcontext=u:object_r:shell_data_file:s0 tclass=file permissive=0
AFAIK, with ngrx, the subscription to your store should probably only happen once in your component, instead of every time the onMapReady(args) method is fired, which maybe happening when you navigate back to the map - verify this first by adding a console.log to the onMapReady(args) method.
From what I've seen (now) ngrx subscriptions belong in the constructor method and console.log has helped me understand the life-cycle of numerous components now... :-)
One suggestion might be to:
add a component flag called isMapboxReady
toggle it in the onMapReady method
move the subscription out into the constructor and add a check inside the subscription for if the isMapboxReadyflag is true before adding markers.