ng2-ui / map

Angular Google Maps Directives
https://ng2-ui.github.io/map
260 stars 98 forks source link

You have included the Google Maps JavaScript API multiple times on this page. This may cause unexpected errors. #299

Open DzmVasileusky opened 3 years ago

DzmVasileusky commented 3 years ago

Steps to reproduce and a minimal demo

The problem happens when you may need to load google maps API for other library purpose before the ngui-map will add it. ngui-map doesn't check if the API is already added and add it second time. Which results to You have included the Google Maps JavaScript API multiple times on this page. This may cause unexpected errors.

To reproduce just add google maps API manually in the head of the page. UPD This is happening from time to time and only with NgMapAsyncCallbackApiLoader. If NgMapAsyncApiLoader is adding the script it is ok. I found out the culprit: isMapsApiLoaded are checking only already loaded google API but it isn't checkin loading one. So if another library will add script dynamically - it may be not ready in the time isMapsApiLoaded is called.

Current behavior

You have included the Google Maps JavaScript API multiple times on this page. This may cause unexpected errors.

Expected/desired behavior

Library is checking for the google maps API to be already added and loaded and not add it again. We are using this code to check if it is ready

export const googleMapsApiAdded = () => {

    return document.querySelectorAll('script[src*="maps.google.com/maps/api/js"]').length > 0;

};

export const googleMapsApiLoaded = () => {

    return typeof google === 'object' && typeof google.maps === 'object';

};
DzmVasileusky commented 3 years ago

I had to wait for google maps to be loaded by another lib and show ngui-map after that But it will be good if will be fixed in the lib