From 2f38426222be714d837bda207c17dac7015e4540 Mon Sep 17 00:00:00 2001 From: Michael Cousins Date: Mon, 29 Jan 2024 13:12:30 +1100 Subject: [PATCH 1/3] test: add simple typing tests --- .eslintrc.cjs | 7 ++++ .github/workflows/release.yml | 10 ++++- package.json | 5 ++- src/__tests__/fixtures/Simple.svelte | 5 +++ tsconfig.json | 10 +++++ types/types.test-d.ts | 58 ++++++++++++++++++++++++++++ 6 files changed, 92 insertions(+), 3 deletions(-) create mode 100644 src/__tests__/fixtures/Simple.svelte create mode 100644 tsconfig.json create mode 100644 types/types.test-d.ts diff --git a/.eslintrc.cjs b/.eslintrc.cjs index 0bd04ba..5a18bf8 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 3c799e3..ac0300b 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -34,8 +34,14 @@ jobs: npm install --no-package-lock npm install --no-save svelte@${{ matrix.svelte }} - - name: ▶️ Run validate script - run: npm run validate + - name: ▶️ Test + run: npm test + + - name: ▶️ Lint and type-check + if: ${{ matrix.node == '20' && matrix.svelte == '4' }} + run: | + npm run lint + npm run types - name: ⬆️ Upload coverage report uses: codecov/codecov-action@v3 diff --git a/package.json b/package.json index b0a9ea7..622c985 100644 --- a/package.json +++ b/package.json @@ -49,8 +49,9 @@ "test": "vitest run --coverage", "test:watch": "vitest", "test:update": "vitest run --update", + "types": "svelte-check", "setup": "npm install && npm run validate", - "validate": "npm-run-all lint test", + "validate": "npm-run-all lint test types", "contributors:add": "all-contributors add", "contributors:generate": "all-contributors generate" }, @@ -77,11 +78,13 @@ "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", "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]>() + }) +}) From 6187605dadd0040885570405e95038829cac6991 Mon Sep 17 00:00:00 2001 From: Michael Cousins Date: Wed, 31 Jan 2024 07:51:13 +1100 Subject: [PATCH 2/3] fixup: remove linting from CI --- .github/workflows/release.yml | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index ac0300b..ab3e6fb 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -34,14 +34,12 @@ jobs: npm install --no-package-lock npm install --no-save svelte@${{ matrix.svelte }} - - name: ▶️ Test + - name: ▶️ Run tests run: npm test - - name: ▶️ Lint and type-check + - name: ▶️ Run type-checks if: ${{ matrix.node == '20' && matrix.svelte == '4' }} - run: | - npm run lint - npm run types + run: npm run types - name: ⬆️ Upload coverage report uses: codecov/codecov-action@v3 From b5fb3d0b69377b356af820e6baff9dc53bb15101 Mon Sep 17 00:00:00 2001 From: Michael Cousins Date: Thu, 1 Feb 2024 17:31:39 +1100 Subject: [PATCH 3/3] fixup: oops --- package.json | 4 ---- 1 file changed, 4 deletions(-) diff --git a/package.json b/package.json index 4c7df4f..d6a153d 100644 --- a/package.json +++ b/package.json @@ -87,12 +87,8 @@ "eslint-plugin-simple-import-sort": "10.0.0", "eslint-plugin-svelte": "2.35.1", "eslint-plugin-vitest-globals": "1.4.0", -<<<<<<< HEAD "expect-type": "^0.17.3", -||||||| c568b5d -======= "happy-dom": "^13.3.1", ->>>>>>> main "jsdom": "^22.1.0", "npm-run-all": "^4.1.5", "prettier": "3.2.4",