Request for clarification of instructions

[tserkov]

Request for clarification of instructions

[NiallTracey]

Thanks for your response -- that's very helpful and far more elegant than prefixing every call with window. .

"Unless I've misunderstood something, I don't see this as an issue with this
library or it's documentation, but rather your understanding of scope and
linters."

Well, think of it this way. Your library is incredibly useful, as it enables coders to do things they previously were unable to do. That means many of us have never been in a position to need that level of familiarity with linters or scoping rules. Globals are deliberately avoided in many tutorials on Vue for reasons of design philosophy. I discovered this module was via a suggestion on StackOverflow, and one comment in response to it (that went unanswered) was "How to call a function from the loaded script?" so I'm not the only one who got confused.

Adding a brief note in the instructions for the aid of such people will make your library easier for people to use.

Here's my suggestion, based on what you've just told me, continuing your example of the Google Maps API, and using an example from Google's API docs:

Once imported, javascript libraries can be accessed by their usual name, eg

  this.map = new google.maps.Map(document.getElementById("map") as HTMLElement, {
    center: { lat: -34.397, lng: 150.644 },
    zoom: 8,
   });

However, if you are using a linter to check your code, this may report as an undefined variable. You will need to instruct your linter to ignore this variable or function. Instructions for ESlint here

If you are unable to resolve this in your linter, adding window. before the name of the variable or function you are attempting to access will also correct this problem, e.g.:

  this.map = new window.google.maps.Map(document.getElementById("map") as HTMLElement, {
    center: { lat: -34.397, lng: 150.644 },
    zoom: 8,
   });

So no, there's nothing wrong with your instructions, and again thanks for making this incredibly useful library available. I'm just suggesting a small usability improvement.

[NiallTracey]

And obviously the answer is that I just need to qualify the scope as window.JitsiMeetExternalAPI and everything works fine.

I think it's worth including a note in the instructions to that effect:

To access a function from the loaded script, you may need to prefix the function name with window. to access the full browser scope and ensure compatibility across devices.

[Psychokiller1888]

Well, I must say it also took me a while to understand what to do with this plugin, I event uninstalled it because it basically does nothing. Until I understood it loads the scripts in the global scope. So maybe a line or two about that fact wouldn't hurt, linter or not, scope understanding or not

[tserkov]

As you've hinted at, this is a linter issue. In browser environments, `window` is the global scope. But linters in IDEs safely assume no global scope except what it has been explicitly told in config. Referencing `window.*` objects directly are explicit enough for linters to calm down. If you're using ESLint, insert the following into your component: ```javascript /* global JitsiMeetExternalAPI */ ``` And you can use it without the window prefix without complaints from ESLint. You'll also have to do this if you use other third party libraries, like moment or jquery. Unless I've misunderstood something, I don't see this as an issue with this library or it's documentation, but rather your understanding of scope and linters.