SolidJS•2mo ago

All of a sudden `classList` is typed as string | undefined

I am using SolidJS with Astro and at one point I duplicated a component file to extract logic into it and now class and classList have unexpected types:

src/Wes95/components/Window.tsx:159:14 - error ts(2322): Type '{ children: Element[]; class: string; }' is not assignable to type 'HTMLAttributes<HTMLDivElement>'.
  Property 'class' does not exist on type 'HTMLAttributes<HTMLDivElement>'.

159         <div class="WindowTitleButtons">

src/Wes95/components/Window.tsx:159:14 - error ts(2322): Type '{ children: Element[]; class: string; }' is not assignable to type 'HTMLAttributes<HTMLDivElement>'.
  Property 'class' does not exist on type 'HTMLAttributes<HTMLDivElement>'.

159         <div class="WindowTitleButtons">

src/Wes95/components/Window.tsx:128:7 - error ts(2322): Type '{ Window: true; '-active': boolean; '-maximized': boolean | undefined; '-minimized': boolean | undefined; }' is not assignable to type 'string'.

128       classList={{
          ~~~~~~~~~

src/Wes95/components/Window.tsx:128:7 - error ts(2322): Type '{ Window: true; '-active': boolean; '-maximized': boolean | undefined; '-minimized': boolean | undefined; }' is not assignable to type 'string'.

128       classList={{
          ~~~~~~~~~

The reference is node_modules/.pnpm/[email protected]/node_modules/solid-js/types/jsx.d.ts and it does only contain:

  interface HTMLAttributes<T> extends AriaAttributes, DOMAttributes<T> {
    // ...
    classList?: string | undefined;

  interface HTMLAttributes<T> extends AriaAttributes, DOMAttributes<T> {
    // ...
    classList?: string | undefined;

What's going on?!

31 Replies

Jasmin•2mo ago

where do you try to apply classList on?

WesOP•2mo ago

HTML:

    <section
      classList={{

    <section
      classList={{

Jasmin•2mo ago

weird

Jasmin•2mo ago

I'm also on 1.9.3 I think your typescript server is confusing stuff. Do you use the solid jsx in tsconfig?

WesOP•2mo ago

Do you mean "jsxImportSource": "solid-js",?

Jasmin•2mo ago

yeah and "jsx": "preserve",

WesOP•2mo ago

Yeah The code is on GitHub: https://github.com/WesSouza/wes.dev/blob/wes95/src/Wes95/components/Window.tsx#L126

Jasmin•2mo ago

and a restart didn't work? ok lemme test

WesOP•2mo ago

no, and running tsc --noEmit shows the same errors

Jasmin•2mo ago

tsc works for me too rm -rf node_modules maybe that helps (gives other errors but none related to that)

WesOP•2mo ago

what the heck, that worked?!

Jasmin•2mo ago

silly node modules

WesOP•2mo ago

I thought we were done with nuking node modules 😦

Jasmin•2mo ago

my muscle memory always puts a rm -rf before anything that I do haha, I'm trusting nothing nope, never

WesOP•2mo ago

so like, a vite cache issue maybe?

Jasmin•2mo ago

probably not tsc doesn't do anything with vite I literally have this script in every package.json

"clean": "rm -rf .turbo dist node_modules"

"clean": "rm -rf .turbo dist node_modules"

and I always to pnpm clean && pnpm install && pnpm build if I'm having issues or am about to push just to double check that it works on not only my machine

WesOP•2mo ago

I didn't reinstall anything so it must be some sort of cache shenanigans Anyway... thanks 😛

Jasmin•2mo ago

hm could be, caching do be annyoing sometimes :D np! :zzz_flushedfroge:

Neto•2mo ago

the whole editor <-> tsc <-> eslint combo is just iffy when shits gets bad editor acuses an issue, tsc not, eslint is just slow

Jasmin•2mo ago

eslint is just slow haha yeah sounds about right I tried biome for a few new projects now and it's like day and night. sadly it doesn't support everything I need yet but I'm looking forward to it it has partial support for .astro, but not yet formatting them :/

WesOP•2mo ago

I'm excited for voidzero, last time I tried Rome it was a bunch of petty rules, and it drove me insane it also crashed a lot, which I'm sure is better nowadays

Neto•2mo ago

the rome disaster

Jasmin•2mo ago

who is rome?

WesOP•2mo ago

Biome's previous incarnation

Jasmin•2mo ago

ohh

Neto•2mo ago

rome was voidzero before the whole vc thingy rome got some millions to "fix the js ecosystem" or at least part of it as you don't know them can you guess what happened? :ryan:

Jasmin•2mo ago

:deepseacreature: the js ecosystem can never be "fixed"

Neto•2mo ago

everyone has opinions about everything and if you have strong enough opinions, you create your own formatter xD

WesOP•2mo ago

the people behind voidzero are not the same, so there's some hope

Neto•2mo ago

yeah

Gaming

Programming

All of a sudden `classList` is typed as string | undefined