Getting started is a little confusing

[justingolden21]

I'm experienced with web dev, but not with vitetest, vite, or testing frameworks. I'm using vitest because I'm using svelte kit, and svelte uses vite under the hood.

I was following the getting started guide (https://vitest.dev/guide/) and tried my best to get a simple "hello world" test going.

I installed vitest as a dev dependency and tried my best at copying from your guide:

My package.json has

"test": "vitest",
"coverage": "vitest run --coverage"

my vitest.config.js has

import { defineConfig } from 'vitest/config';

export default defineConfig({
	test: {
		// ...
	}
});

(assuming I need to replace the comment)
and I made a test directory and in test/firsttest.js I have

import { assert, describe, it } from 'vitest';

describe('suite', () => {
	it('test', () => {
		assert.equal(2, 2);
	});
});

But I have no idea if the test directory should be in src or in the top level, if the test file should be a js file or something special, if I hook up the firsttest file to vite.config.js or in the command in package.json to tell it where the file is, etc.

I saw the example had it as a typescript file but I'm not using typescript.

I think I'll figure this out soon enough by checking other peoples' code, but it would be nice to just set up the user with a working "hello world" out of the box (I don't mean like a CLI utility for starting a boilerplate project that creates the files itself, I just mean in the tutorial, simpler example code and instructions to run your first test, before going into timeouts and skipping docs.

[justingolden21]

It seems like coverage isn't necessary and depends on a missing dependency c8, so I've removed that.

It seems like

import { test, expect } from 'vitest';

test('first test', async () => {
	expect(true);
});

might be better as a first test, but I still can't get it to work. I installed vitest-svelte-kit since I'm running svelte kit, and they recommend

import { extractFromSvelteConfig } from 'vitest-svelte-kit';

export default extractFromSvelteConfig();

as the vitest.config.js file, but that doesn't have my firsttest file hooked up, which I would've guessed would be:

/// <reference types="vitest" />

import { defineConfig } from 'vitest/config';

export default defineConfig({
	test: {
        firsttest: './test/firsttest.js'
	}
});

I changed my config to:

import { defineConfig } from 'vite';
import { extractFromSvelteConfig } from 'vitest-svelte-kit';

export default async function () {
	const extract = await extractFromSvelteConfig();
	return defineConfig({
		plugins: extract['plugins'],
		test: {
			firsttest: './test/firsttest.js'
		}
	});
}

but it still says no test files found.

[justingolden21]

[justingolden21]

Is jsdom necessary? In this article https://www.eternaldev.com/blog/how-to-write-tests-in-sveltekit-and-vitest/ it points to the config in your docs: https://github.com/vitest-dev/vitest/blob/main/examples/svelte/vitest.config.ts which includes jsdom. When I go to run the code, I don't have jsdom and am prompted to install. If I just remove it, my config looks like:

import { defineConfig } from 'vite';
import { svelte } from '@sveltejs/vite-plugin-svelte';

export default defineConfig({
	plugins: [svelte({ hot: !process.env.VITEST })],
	test: {
		firsttest: './test/firsttest.js'
	}
});

and still doesn't find tests and fails.

[sheremet-va]

By default your test should have a "spec" or "test" in a suffix like that: "firsttest.spec.js". Extension doesn't matter, it can be either js or ts.

If tests are not found you should see all filters applied to find your tests.

To test svelte, you need jsdom. We don't ship it, because it's a large dependency and you might not need it (if you are testing node code, you don't need it). To install it, just type "y" when we ask you.

[sheremet-va]

Also, I don't know what you are trying to do with this "firsttest" in your config. We dont have that field. Please, refer to documentation for available options.