React-google-maps: withScriptjs does not check if google exists

[ZephD]

I have made two components - one GoogleMap and one StreetView.
Both use withScriptjs.
However, if both components are on the same page, the google maps script gets added twice.

I suggest that withScriptjs uses a global loading state, and checks if there is already a withScriptjs attempting to add before attempting to add it itself.

[ZephD]

Additional:
One uses the plane google map URL, the other uses the google map URL with &libraries=visulization.
Therefore, these are two different URLs, so scriptjs is working as expected.
Still, two versions of window.google.maps is loaded because of this.

[tomchentw]

You can

• move withScriptJs to the upper component.
• or implement your own withScriptJs that customized your loading logic

On Tue, 1 Aug 2017 at 9:23 PM ZephD [e-mail] wrote:

Additional:
One uses the plane google map URL, the other uses the google map URL with
&libraries=visulization.
Therefore, these are two different URLs, so scriptjs is working as
expected.
Still, two versions of window.google.maps is loaded because of this.

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/tomchentw/react-google-maps/issues/564#issuecomment-319368279,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AA4Seq90rto7qDIevN79SWMpcFKbw8aDks5sTyazgaJpZM4OphYc
.

[renatodeleao]

Same problem here using multiple maps on one page (plus some async loaded ones on dialog windows) which was throwing errors from google map API due multiple includes. Rolled back to inline html include with async flag since I couldn't find a workaround for this at the time of writing. Will post a snippet if I that changes in the meantime.

[oshalygin]

yeah the path here is to use withScripts in a HOC that wraps any other content. If the library was to support this we'd have to have a global loading state are you suggest though.

[tomchentw]

However, if both components are on the same page, the google maps script gets added twice.

withScriptjs only check if the URL is already loaded or not, so you have to use all the SAME URL for static/async script. See the new docs site for v8.0.0:

https://tomchentw.github.io/react-google-maps/