re-implement typescript-eslint's "no any" rules

[DetachHead]

many of the typescript eslint rules don't seem to recognize svelte-specific things.

examples

events

<input
    type="checkbox"
    on:change={(event) => {
        // error: Unsafe assignment of an `any` value. (@typescript-eslint/no-unsafe-assignment)
        const foo = event.currentTarget.checked
    }}
/>

here, event is typed as Event & { currentTarget: EventTarget & HTMLInputElement } but the typescript-eslint plugin thinks it's any

$$Generics

<script lang="ts">
    type T = $$Generic<number>

    export let foo: T

    // Unsafe member access .toString on an `any` value. (@typescript-eslint/no-unsafe-member-access)
    // Unsafe call of an `any` typed value. (@typescript-eslint/no-unsafe-call)
    foo.toString()
</script>

here, the typescript-eslint plugin does not seem to understand $$Generic, so it treats them as any. (originally raised sveltejs/language-tools#1780)

[ota-meshi]

Thank you for posting the issue.

About event types:
The parser needs to provide better typing when it emits virtual code, but I'm still not sure if I can do that 🤔
https://ota-meshi.github.io/svelte-eslint-parser/virtual-script-code/

About $$Generic:
The RFC about $$Generic don't seem to have been merged yet.
sveltejs/rfcs#38

I don't want to fully support it yet to avoid a lot of breaking changes.
If you want to support it, we can add it as an experimental feature, but I don't have time to do that.

[DetachHead]

About event types:
The parser needs to provide better typing when it emits virtual code, but I'm still not sure if I can do that 🤔
https://ota-meshi.github.io/svelte-eslint-parser/virtual-script-code/

would it be possible to use svelte2tsx instead of svelte-eslint-parser? from my understanding that's what svelte uses for its typescript support which would mean the code eslint checks would be the same as what the svelte compiler checks.

this is the output of svelte2tsx on my example above:

/// <reference types="svelte" />
function render() {
    ;async () => {
        {
            svelteHTML.createElement('input', {
                type: 'checkbox',
                'on:change': (event) => {
                    const foo = event.currentTarget.checked
                },
            })
        }
    }
    return { props: /** @type {Record<string, never>} */ {}, slots: {}, events: {} }
}

export default class extends __sveltets_2_createSvelte2TsxComponent(
    __sveltets_2_partial(__sveltets_2_with_any_event(render())),
) {}

here, the svelteHTML.createElement function correctly infers the type of event as Event & { currentTarget: EventTarget & HTMLInputElement }

[ota-meshi]

would it be possible to use svelte2tsx instead of svelte-eslint-parser?

I think it is very difficult.

[DetachHead]

i found another example where a type is incorrectly considered to be any - importing types from other .svelte files:

<!-- Foo.svelte -->
<script lang="ts" context="module">
    export type Foo = number
</script>

<!-- Bar.svelte -->
<script lang="ts">
    import type { Foo } from './Foo.svelte'

    const asdf: Foo = 1

    // Unsafe member access .fdsa on an `any` value. (@typescript-eslint/no-unsafe-member-access)
    // Unsafe call of an `any` typed value. (@typescript-eslint/no-unsafe-call)
    asdf.toString()
</script>

[ota-meshi]

I know it. #298

[DetachHead]

another example is the sveltekit API route types that are automatically inferred, but not recognised by typescript-eslint:

export const GET = async ({ request }) => {
    // request is not any, since it's inferred as Request by sveltekit
    request.headers // error: @typescript-eslint/no-unsafe-member-access
}

[ota-meshi]

Could you please open another issue to better manage those issues?

[DetachHead]

done #413

[ota-meshi]

As for currentTarget, I think it has been improved.
As for $$Generic, I think there is more discussion at sveltejs/svelte-eslint-parser#306, so please follow that.