OrdnanceSurvey / os-data-hub-tutorials

Step-by-step guides to get your project up and running. Here you'll find out how we develop solutions with our APIs. You can follow our step-by-step guides to start building your own innovative projects. These tutorials are related to the Mapping and Data APIs available from our Data Hub (https://osdatahub.os.uk/).
Other
23 stars 7 forks source link

SyntaxError #2

Closed Impossiblue closed 3 years ago

Impossiblue commented 3 years ago

When I run the Scroll Story 'index.html' file (Path: os-data-hub-tutorials-master > web-development > scroll-story > code > index.html) I get an error message in Safari.

Quote start:

SyntaxError: Can't create duplicate variable that shadows a global property: 'map'

(anonymous function)

Quote end.

The only modification I did was to add my API key in 'tutorial.js'.

johnx25bd commented 3 years ago

Hi @Impossiblue - thanks for raising this. We can't replicate it on our end - what version of Safari are you using?

We found this stackoverflow thread - seems like it could be an issue when the code selects an HTML element where the id matches the variable name.

So one idea would be to change the <div id="map"> element to another id in index.html, and the corresponding string on line 12 in tutorial.js. We just pushed a branch with these adjustments, try this out: https://github.com/OrdnanceSurvey/os-data-hub-tutorials/commit/4882811bac3f281eb43c6ed3361edab6ee7967d6

If that doesn't work, can you share more details like your OS version, Safari version etc and we can see if we can help resolve?

Impossiblue commented 3 years ago

John IV,

Thank you for getting back to me.

My initial tests were carried out in Safari 10.1.2 on OS X Yosemite 10.10.5. (Yes, this is a geriatric combination.)

Following your suggestion, I renamed the 'div' in HTML and did likewise in CSS and 'tutorial.js'. The problem evaporated.

So, StackOverflow narrowing the problem down to Safari, seems to be correct. At least for older versions of the browser, because: I also tested in Safari 14.0.3 on macOS Mojave 10.14.6 WITHOUT modifications, and the error message did NOT show up.

Somewhere between Safari 10 and 14, Apple seems to have fixed the issue.

I guess it is time for me to finally leave the old 2010 PowerMac/Yosemite workhorse specifically for the few programmes I still need but will not upgrade. Oh, well.

Yours sincerely,

Bjorn Norway

On April 1, 2021 at 6:47 AM, John IV @.***> wrote:

Hi @Impossiblue - thanks for raising this. We can't replicate it on our end - what version of Safari are you using? We found this stackoverflow thread - seems like it could be an issue when the code selects an HTML element where the id matches the variable name. So one idea would be to change the

element to another id in index.html, and the corresponding string on line 12 in tutorial.js. We just pushed a branch with these adjustments, try this out: 4882811 If that doesn't work, can you share more details like your OS version, Safari version etc and we can see if we can help resolve? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or unsubscribe.

johnx25bd commented 3 years ago

Great, thanks Bjorn! Glad to hear the workaround was successful. I'm going to close this issue - if you have any more problems feel free to open a new one!!