diff --git a/.eslintrc.cjs b/.eslintrc.cjs index f862385..19c1908 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -16,6 +16,13 @@ module.exports = { 'simple-import-sort/imports': 'error', }, overrides: [ + { + files: ['*.svelte'], + parser: 'svelte-eslint-parser', + parserOptions: { + parser: '@typescript-eslint/parser', + }, + }, { files: ['*.ts'], parser: '@typescript-eslint/parser', diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index 0761056..e218a53 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -36,9 +36,13 @@ jobs: npm install --no-package-lock npm install --no-save svelte@${{ matrix.svelte }} - - name: ▶️ Run validate script + - name: ▶️ Run tests run: npm run test:${{ matrix.test-runner }} + - name: ▶️ Run type-checks + if: ${{ matrix.node == '20' && matrix.svelte == '4' }} + run: npm run types + - name: ⬆️ Upload coverage report uses: codecov/codecov-action@v3 diff --git a/package.json b/package.json index 1f3afc5..d6a153d 100644 --- a/package.json +++ b/package.json @@ -52,13 +52,14 @@ "format:delta": "npm-run-all format:prettier:delta format:eslint:delta", "format:prettier:delta": "prettier --write `./scripts/changed-files`", "format:eslint:delta": "eslint --fix `./scripts/changed-files`", + "setup": "npm install && npm run validate", "test": "vitest run --coverage", "test:watch": "vitest", "test:update": "vitest run --update", "test:vitest:jsdom": "vitest run --coverage --environment jsdom", "test:vitest:happy-dom": "vitest run --coverage --environment happy-dom", - "setup": "npm install && npm run validate", - "validate": "npm-run-all test:vitest:*", + "types": "svelte-check", + "validate": "npm-run-all test:vitest:* types", "contributors:add": "all-contributors add", "contributors:generate": "all-contributors generate" }, @@ -86,12 +87,14 @@ "eslint-plugin-simple-import-sort": "10.0.0", "eslint-plugin-svelte": "2.35.1", "eslint-plugin-vitest-globals": "1.4.0", + "expect-type": "^0.17.3", "happy-dom": "^13.3.1", "jsdom": "^22.1.0", "npm-run-all": "^4.1.5", "prettier": "3.2.4", "prettier-plugin-svelte": "3.1.2", "svelte": "^3 || ^4", + "svelte-check": "^3.6.3", "svelte-jester": "^3.0.0", "typescript": "^5.3.3", "vite": "^4.3.9", diff --git a/src/__tests__/fixtures/Simple.svelte b/src/__tests__/fixtures/Simple.svelte new file mode 100644 index 0000000..3fa20ce --- /dev/null +++ b/src/__tests__/fixtures/Simple.svelte @@ -0,0 +1,5 @@ + + +

hello {name}

diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..504b256 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,10 @@ +{ + "compilerOptions": { + "module": "node16", + "noEmit": true, + "skipLibCheck": true, + "strict": true, + "types": ["svelte", "vite/client", "vitest", "vitest/globals"], + }, + "include": ["src", "types"], +} diff --git a/types/types.test-d.ts b/types/types.test-d.ts new file mode 100644 index 0000000..bfb8f85 --- /dev/null +++ b/types/types.test-d.ts @@ -0,0 +1,58 @@ +import { expectTypeOf } from 'expect-type' +import type { ComponentProps, SvelteComponent } from 'svelte' +import { describe, test } from 'vitest' + +import Simple from '../src/__tests__/fixtures/Simple.svelte' +import * as subject from './index.js' + +describe('types', () => { + test('render is a function that accepts a Svelte component', () => { + subject.render(Simple, { name: 'Alice' }) + subject.render(Simple, { props: { name: 'Alice' } }) + }) + + test('invalid prop types are rejected', () => { + // @ts-expect-error: name should be a string + subject.render(Simple, { name: 42 }) + + // @ts-expect-error: name should be a string + subject.render(Simple, { props: { name: 42 } }) + }) + + test('render result has container and component', () => { + const result = subject.render(Simple, { name: 'Alice' }) + + expectTypeOf(result).toMatchTypeOf<{ + container: HTMLElement + component: SvelteComponent<{ name: string }> + debug: (el?: HTMLElement) => void + rerender: (options: ComponentProps) => void + unmount: () => void + }>() + }) + + test('render result has default queries', () => { + const result = subject.render(Simple, { name: 'Alice' }) + + expectTypeOf(result.getByRole).parameters.toMatchTypeOf< + [role: subject.ByRoleMatcher, options?: subject.ByRoleOptions] + >() + }) + + test('render result can have custom queries', () => { + const [getByVibes] = subject.buildQueries( + (_container: HTMLElement, vibes: string) => { + throw new Error(`unimplemented ${vibes}`) + }, + () => '', + () => '' + ) + const result = subject.render( + Simple, + { name: 'Alice' }, + { queries: { getByVibes } } + ) + + expectTypeOf(result.getByVibes).parameters.toMatchTypeOf<[vibes: string]>() + }) +})