generated from storybookjs/addon-kit
-
Notifications
You must be signed in to change notification settings - Fork 63
/
hooks.ts
82 lines (74 loc) 路 2.88 KB
/
hooks.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
import type { BrowserContext, Page } from 'playwright';
import type { StoryContext } from '@storybook/csf';
export type TestContext = {
id: string;
title: string;
name: string;
};
export type PrepareContext = {
page: Page;
browserContext: BrowserContext;
testRunnerConfig: TestRunnerConfig;
};
export type TestHook = (page: Page, context: TestContext) => Promise<void>;
export type HttpHeaderSetter = (url: string) => Promise<Record<string, any>>;
export type PrepareSetter = (context: PrepareContext) => Promise<void>;
export interface TestRunnerConfig {
setup?: () => void;
/**
* @deprecated Use `preVisit` instead.
*/
preRender?: TestHook;
/**
* @deprecated Use `postVisit` instead.
*/
postRender?: TestHook;
/**
* Runs before each story is visited. By this point, the story is not rendered in the browser.
* This is useful for preparing the browser environment such as setting viewport size, etc.
* @see https://github.com/storybookjs/test-runner#previsit
*/
preVisit?: TestHook;
/**
* Runs after each story is visited. This means the story has finished rendering and running its play function.
* This is useful for taking screenshots, snapshots, accessibility tests, etc.
* @see https://github.com/storybookjs/test-runner#postvisit
*/
postVisit?: TestHook;
/**
* Adds http headers to the test-runner's requests. This is useful if you need to set headers such as `Authorization` for your Storybook instance.
*/
getHttpHeaders?: HttpHeaderSetter;
/**
* Overrides the default prepare behavior of the test-runner. Good for customizing the environment before testing, such as authentication etc.
*
* If you override the default prepare behavior, even though this is powerful, you will be responsible for properly preparing the browser. Future changes to the default prepare function will not get included in your project, so you will have to keep an eye out for changes in upcoming releases.
*/
prepare?: PrepareSetter;
/**
* Tags to include, exclude, or skip. These tags are defined as annotations in your story or meta.
* @see https://github.com/storybookjs/test-runner#filtering-tests-experimental
*/
tags?: {
include?: string[];
exclude?: string[];
skip?: string[];
};
}
export const setPreVisit = (preVisit: TestHook) => {
globalThis.__sbPreVisit = preVisit;
};
export const setPostVisit = (postVisit: TestHook) => {
globalThis.__sbPostVisit = postVisit;
};
export const getStoryContext = async (page: Page, context: TestContext): Promise<StoryContext> => {
return page.evaluate(({ storyId }) => globalThis.__getContext(storyId), {
storyId: context.id,
});
};
export const waitForPageReady = async (page: Page) => {
await page.waitForLoadState('domcontentloaded');
await page.waitForLoadState('load');
await page.waitForLoadState('networkidle');
await page.evaluate(() => document.fonts.ready);
};