Type error when using context API

[Hagendorn]

Hi,

I got a type error when using the context API.

Component:

<script lang="ts">
  import { getContext } from "svelte";

  const foo = getContext("foo");

  console.log({ foo });
</script>

{foo}

Test:

import { render } from "@testing-library/svelte";

import Comp from "./Component.svelte";

it("gets context", () => {
  render(Comp, { context: new Map([["foo", "bar"]]) });
});

Running svelte-check reports this type error:

▶ npm run check 

> [email protected] check
> svelte-check --tsconfig ./tsconfig.json


====================================
Loading svelte-check in workspace: /Users/user/workspace/vite-svelte-context-type-issue
Getting Svelte diagnostics...

/Users/user/workspace/vite-svelte-context-type-issue/src/Component.test.ts:6:18
Error: No overload matches this call.
  Overload 1 of 2, '(component: Constructor<Component__SvelteComponent_>, componentOptions?: SvelteComponentOptions<Component__SvelteComponent_>, renderOptions?: Omit<...>): RenderResult<...>', gave the following error.
    Type 'Map<string, string>' is not assignable to type 'never'.
  Overload 2 of 2, '(component: Constructor<Component__SvelteComponent_>, componentOptions?: SvelteComponentOptions<Component__SvelteComponent_>, renderOptions?: RenderOptions<...>): RenderResult<...>', gave the following error.
    Type 'Map<string, string>' is not assignable to type 'never'. 
it("gets context", () => {
  render(Comp, { context: new Map([["foo", "bar"]]) });
});


====================================
svelte-check found 1 error, 0 warnings, and 0 hints

I created a sample repository to reproduce this issue:
https://github.com/Hagendorn/vite-svelte-context-type-issue

To reproduce it checkout the repository and run:

> npm i
> npm run check

[sebastianrothe]

I think the typing in https://github.com/testing-library/svelte-testing-library/blob/main/types/index.d.ts is wrong.

A workaround is to cast the options object to any: render(Comp, { context: new Map([["foo", "bar"]]) } as any);

[Hagendorn]

@sebastianrothe thanks for mentioning a workaround. This is the workaround I am currently using.

[Hagendorn]

I think this type should be correct:

type SvelteComponentOptions<C extends SvelteComponent> = ComponentProps<C> | Pick<ComponentConstructorOptions<ComponentProps<C>>, "anchor" | "props" | "hydrate" | "intro" | "context">

I think ComponentConstructorOptions<ComponentProps<C>> should be used instead of {props: ComponentProps<C>} and not all probs form ComponentConstructorOptions are supported. If I saw it correctly only 'anchor', 'props', 'hydrate', 'intro', 'context' is supported, thats why I used Pick.

But I am not 100% sure. I tested it locally and it worked for me.

If desired I can provide a PR for that.

[github-actions]

🎉 This issue has been resolved in version 4.0.4 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀