feat: expose takeSnapshot() as public API

[AriPerkkio]

Issue: Related to #295

Stacks on #296.

What Changed

Finalize takeSnapshot() API and expose it as part of public API

takeSnapshot()

Users can generate snapshots in the middle of test run using takeSnapshot() API. This allows users to take multiple snapshots in a single test case. It’s also very useful when global disableAutoSnapshot is used.

import { takeSnapshot } from "@chromatic-com/vitest";

test("accordion open", async () => {
	const screen = await render(<Accordion />);
	await takeSnapshot();

	await screen.getByRole('button', { name: 'Open' }).click();
	await takeSnapshot("Accordion open");
});

If user calls takeSnapshot inside a test case that was not registered by the plugin, we will throw an informative error message:

export default defineConfig({
  plugins: [chromaticPlugin({ tags: ["visual-regression"] })],
})

import { takeSnapshot } from "@chromatic-com/vitest";

test("accordion", { tags: ["visual-regression"] }, async () => {
	await render(<Accordion />);

  // Works fine as test matches tags ✅
	await takeSnapshot();
});

test("accordion open", async () => {
	const screen = await render(<Accordion />);

	await screen.getByRole('button', { name: 'Open' }).click();

  // Throws error as test wasn't registered by the plugin due to missing tag ❌
  await takeSnapshot("Accordion open");
});

AssertionError: takeSnapshot() cannot be called in a test that is not registered for Chromatic plugin

 ❯ test/accordion.test.tsx:6:9
      4|   await screen.getByRole('button', { name: 'Open' }).click();
      5|
      6|   await takeSnapshot("Accordion open");
       |         ^
      7| });	

How to test

$ cd <project-root>
$ yarn test:unit
$ yarn test:vitest
$ yarn archive-storybook:vitest

[changeset-bot]

⚠️ No Changeset found

Latest commit: a558e76

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[codecov]

Codecov Report

❌ Patch coverage is 79.16667% with 5 lines in your changes missing coverage. Please review.
✅ Project coverage is 94.43%. Comparing base (35ded1d) to head (a558e76).
⚠️ Report is 1 commits behind head on main.

Files with missing lines	Patch %	Lines
packages/vitest/src/browser/public/takeSnapshot.ts	86.36%	3 Missing ⚠️
packages/vitest/src/node/commands.ts	0.00%	1 Missing and 1 partial ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main     #300      +/-   ##
==========================================
+ Coverage   93.02%   94.43%   +1.40%     
==========================================
  Files          19       19              
  Lines         502      521      +19     
  Branches       86       92       +6     
==========================================
+ Hits          467      492      +25     
+ Misses         33       27       -6     
  Partials        2        2              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.