DEV Community

Discussion on: Setup Google Map In Angular App (The Pro Way) Part 1

Collapse
 
pam81 profile image
Pamela

Hi! great Tutorial!
But I run ng test but it has an error ReferenceError: google is not defined
Not sure how to mock google api or in which way to resolve this. Any clue?

Collapse
 
fyodorio profile image
Fyodor

The same issue, cannot make it work even using different tricks and workarounds

Collapse
 
devpato profile image
Pato

do you have a repo?

Have you tried this? and step 5 and 6 from the article
TS error for the google declaration, that you should add to your tsconfig.app.json and tsconfig.spec.json this line "types": ["googlemaps"]

Thread Thread
 
fyodorio profile image
Fyodor

yes, I'd tried that but without success. I'd reproduced the issue in this simplified setup - small Angular app with a single module with google maps, addressing global google maps object inside the component code. The error when running Jest suite is the same.

Thread Thread
 
devpato profile image
Pato

Hi bud! did yo have a chance to add what Pamela did by adding the mock file? Let me know if it works. i took a look to your app. I noticed you are using the angular google maps. I tried so many things and I can't resolve your issue. If what Pamela did doesn't work for you let me know. I will ask my friends who are GDEs on Google Maps and some other GDEs on Angular

Thread Thread
 
fyodorio profile image
Fyodor

Wow, that's really a gem 🔥 I mean the idea Pamela mentioned. As I use Jest, I've changed it a little bit, so I use basically the same mock object but put it into jest.config.js (and use another config property, correspondingly)

So Pato, thanks for getting into it, and big thanks to Pamela for providing this trick 👍

Collapse
 
devpato profile image
Pato • Edited

do you have a repo?
Have you tried steps 5 and 6?
Have you tried this?

TS error for the google declaration, that you should add to your tsconfig.app.json and tsconfig.spec.json this line "types": ["googlemaps"]

keep me posted

Collapse
 
pam81 profile image
Pamela

Hi Thanks for you reply. I had to mock the googlemap and I follow this github.com/ScottieR/angular-google...
and add in the karma file
files:[
"maps.googleapis.com/maps/api/js?ke...",
"src/app/test/google.api.mock.js"
],

Thread Thread
 
devpato profile image
Pato

so this solved your issue? correct?

Thread Thread
 
pam81 profile image
Pamela

yes!

Thread Thread
 
devpato profile image
Pato

cool! Thanks for sharing your solution