shinokada/svelte-utterances

svelte-utterances's Issues

Use localStorage to keep the theme preference

After changing to another page, the theme goes back to the default theme. This can be fixed by using localStorage or Svelte/Stores?

Some feedback

Hey there, was looking through your package and noticed a few things that could be potentially improved:

1. Usage of $app/env - The $app alias is SvelteKit-specific and thus means that this component will not work properly on non-SvelteKit projects. This can be fixed by manually implementing your own browser check by reassigning a local browser variable in an onMount to be true.
2. Usage of element IDs - The usage of the utterances id (as well as document.getElementById) means that only once instance of the component can properly be mounted per page, since all IDs must be unique. Rather than using an ID, it might be more suitable to use the bind:this directive on the div to obtain an instance-specific reference to the node.
3. getElementsByTagName usage - In the theme switcher code, the call to document.getElementsByTagName('iframe')[0] will retrieve the first <iframe /> element throughout the entire page, meaning that the iFrame.contentWindow.postMessage call will fail if the website has any iframe elements placed before the component in the document.

[BUG]: Currently released NPM package does not work

Description of the bug

The currently released NPM package is out of date, and you cannot set a theme with it.

Steps To Reproduce

1. Install currently released NPM package (0.2.2)
2. Attempt to add theme="github-dark"
3. See that no theme has been applied.

Additional Information

Could you please post a new release that has the latest code? Thanks!

index

https://svelte-utterances.vercel.app/

err TypeError: Cannot read properties of undefined (reading 'contentWindow')

The following code returns error:

...
const iFrame = document.getElementsByTagName("iframe")[0];
        iFrame.contentWindow.postMessage(
...

err TypeError: Cannot read properties of undefined (reading 'contentWindow')
at Object.u.$$.update (doc.svelte-98be7cc1.js:1:1097)
at ve (vendor-60873d7e.js:1:7294)
at new be (doc.svelte-98be7cc1.js:1:1258)
at de (doc.svelte-98be7cc1.js:1:3349)
at ve (vendor-60873d7e.js:1:7340)
at new $e (doc.svelte-98be7cc1.js:1:5518)
at zt (index.md-070d2b67.js:18:3876)
at ve (vendor-60873d7e.js:1:7340)
at new Kt (index.md-070d2b67.js:18:4295)
at Array.Ve (start-7fe98c40.js:1:2515)

[BUG]: Cross Site Origin Error

Description of the bug

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('https://utteranc.es') does not match the recipient window's origin ('https://www.timsmith.tech').

Steps To Reproduce

Go to https://www.timsmith.tech/blog/converting-a-qwik-ai-app-to-sveltekit

At the bottom, try to login to comment

Additional Information

I am on the latest version of SvelteKit

Using index.svelte to showcase this package instead of using another app?

Maybe the web app should exist in this package to add a demo of all features upon they are implemented.

This should make it easier to review new features, enhancement in each pull request.