Calling the Loader twice when the API fails causes it falsely resolve the older promise #90
Description
Calling the Loader twice when the API fails or is blocked causes it to falsely resolve the older promise
This is common if you open another map in the same page.
For example, two map components calling the Loader shouldn't falsely trigger one of the promises to resolve, it must ideally throw an error.
To work around it, you could check if window.google in present in the .then
On a side note, this does not happen with https://www.npmjs.com/package/google-maps package, which from the README this library takes inspiration from and is what I'm currently using.
Environment details
- Specify the API at the beginning of the title (for example, "Places: ...")
- OS type and version : Linux
- Library version and other environment information: React
Steps to reproduce
- Block the
maps.googleapis.comdomain in your browser network tab. - Call the loader twice or one after another with sufficient time in between
- One of the
.thenclauses will trigger.
Code example
new Loader({ apiKey: process.env.GOOGLE_MAPS_API_KEY })
.load()
.then(() => {
console.log('1 THEN');
})
.catch(() => {
console.log('1 CATCH');
});
new Loader({ apiKey: process.env.GOOGLE_MAPS_API_KEY })
.load()
.then(() => {
console.log('2 THEN');
})
.catch(() => {
console.log('2 CATCH');
});
This is especially noticeable when using it with React as fast-refresh or live-reload will remount the component during development and not rerender the page, triggering this bug even when you have a single map component