Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Describe the document.navigator security caveats in the docs #56

Open
nasirkhan opened this issue Jun 19, 2023 · 6 comments
Open

Describe the document.navigator security caveats in the docs #56

nasirkhan opened this issue Jun 19, 2023 · 6 comments
Labels
docs Improvements or additions to documentation

Comments

@nasirkhan
Copy link

Thanks for building this awesome tool.

I was trying to use it in one of my projects, I am using Vite to build the project.

I added the CSS and used the following code for JS.

<script type="module">
  import { init } from "https://cdn.jsdelivr.net/npm/shareon@2/dist/shareon.es.js";
  // do something
  init();
</script>

After that all the buttons worked, but copy-url throws an error when I click on that button. Even after initialization, it shows a warning ReferenceError: temp0 is not defined. The error

TypeError: navigator.clipboard is undefined
    u https://cdn.jsdelivr.net/npm/shareon@2/dist/shareon.es.js:27
    u https://cdn.jsdelivr.net/npm/shareon@2/dist/shareon.es.js:25
    <anonymous> http://localhost/products/123:417

I am testing from Firefox, I would like to mention that your demo at shareon.js.org/ works fine from the same browser.

Can you please help me to find and fix the issue?

@kytta
Copy link
Owner

kytta commented Jun 19, 2023

Now that's weird! I'll take a look at it during this week

@kytta
Copy link
Owner

kytta commented Jun 19, 2023

Although, take a look at this:

https://stackoverflow.com/a/51823007/4735420

Can it be that you just open the HTML file in the browser without actually serving it? If so, this will not work.

Try using vite dev or vite preview to run it on a localhost server. If you publish your website online, it should also work

@nasirkhan
Copy link
Author

I was using yarn dev and even used yarn build to build my project. everything else is working fine with this approach. Even other share buttons are working as well. The issue is only with the copy url

@kytta
Copy link
Owner

kytta commented Jun 19, 2023

Can you provide an example of your setup? Here's my attempt at a MRE: https://stackblitz.com/edit/vitejs-vite-37ttzf?file=index.html,package.json&terminal=dev and the button works here.

Again, if you do not have HTTPS on your website or open it by double-clicking the HTML file (that is, the protocol is file:///), the button will not work. It only works for https:// websites, with the only exception being https://localhost

This works for me when developing Shareon. If you clone the repo and run pnpm dev, it will launch my dev server (on localhost), and the button will work there, too

@nasirkhan
Copy link
Author

thanks for looking into the issue. I was running the site from a local virtual host without https. That might be the reason for getting that error. I opened the site via a https URL and it worked perfectly.

You may add this to the doc.

@kytta
Copy link
Owner

kytta commented Jun 19, 2023

Glad I was able to resolve this! I'll reopen this issue until I've appended to the documentation

@kytta kytta added the docs Improvements or additions to documentation label Jun 19, 2023
@kytta kytta reopened this Jun 19, 2023
@kytta kytta changed the title copy-url not working Describe the document.navigator security caveats in the docs Jun 19, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
docs Improvements or additions to documentation
Projects
None yet
Development

No branches or pull requests

2 participants