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

href attribute causes compiler error with component #114

Open
Zamiell opened this issue Aug 30, 2022 · 5 comments
Open

href attribute causes compiler error with component #114

Zamiell opened this issue Aug 30, 2022 · 5 comments

Comments

@Zamiell
Copy link

Zamiell commented Aug 30, 2022

Getting an error with the latest version of SvelteKit:

<script lang="ts">
  import { DisclosureButton } from "@rgossiaux/svelte-headlessui";
</script>

<DisclosureButton as="a" href="foo" />
Type '{ as: "a"; href: string; }' is not assignable to type 'IntrinsicAttributes & Omit<TRenderProps<{ open: boolean; close: (focusableElement: HTMLElement | null) => void; }, "a", "button">, TInternalProps | ... 2 more ... | "unmount"> & { ...; } & { ...; }'.
  Property 'href' does not exist on type 'IntrinsicAttributes & Omit<TRenderProps<{ open: boolean; close: (focusableElement: HTMLElement | null) => void; }, "a", "button">, TInternalProps | ... 2 more ... | "unmount"> & { ...; } & { ...; }'.

This error is confusing, as I'm pretty sure this code has been working just fine until recently.

Library version
1.0.2

@Zamiell
Copy link
Author

Zamiell commented Aug 30, 2022

For now, as a workaround, I just moved the tag outside of the component like this:

<a href="foo">
  <DisclosureButton />
</a>

@rgossiaux
Copy link
Owner

Thanks for the report. I've been busy lately but I'll have to look into this when I'm free next week--it sounds concerning.

What version of svelte2tsx are you using (ideally what versions before+after the breakage)? It'll be in package-lock.json as a dependency. It sounds like something could have changed in a release there that broke something in the typing in this library.

@rgossiaux
Copy link
Owner

From a very quick look, it looks like they've been reworking some of the typescript definitions recently (I found sveltejs/language-tools#1606 for example) and that might be responsible. It also looks like the 0.5.15 version was missing a file that has been corrected in 0.5.16, in case that happens to be causing this.

@Zamiell
Copy link
Author

Zamiell commented Aug 30, 2022

What version of svelte2tsx are you using (ideally what versions before+after the breakage)?

I tried doing git checkout [sha1 from last week], and then yarn, and then reloading vscode, but I still got the error. So I don't really know how to revert to a before-breakage-state.

For reference, this is my yarn.lock from last week: https://github.com/Zamiell/isaac-streaking/blob/b1b03d787508a21c89a6cce58387ab63e3981636/yarn.lock

@bradyisom
Copy link

@rgossiaux, I upgraded to svelte-check@2.9.0, which I believe has the missing file fix you referenced above. However, I am still getting errors for href and id attributes on MenuItem and MenuButton components. So, the issue is probably related to the reworked typescript definitions.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants