diff --git a/docs/plugins/testplane-storybook.mdx b/docs/plugins/testplane-storybook.mdx
index 53bfd0e..0a1c075 100644
--- a/docs/plugins/testplane-storybook.mdx
+++ b/docs/plugins/testplane-storybook.mdx
@@ -85,6 +85,18 @@ With this minimal config, you will be able to run `npx testplane --storybook` to
true |
Enable / disable auto-screenshot tests |
+
+ autoscreenshotSelector |
+ `String` |
+ "" |
+ Custom selector, which will be used in auto-screenshot tests |
+
+
+ autoScreenshotStorybookGlobals |
+ `Record>` |
+ {} |
+ Run multiple auto-screenshot tests with different [storybook globals](https://storybook.js.org/docs/7/essentials/toolbars-and-globals#globals) |
+
localport |
`Number` |
@@ -113,6 +125,28 @@ With this minimal config, you will be able to run `npx testplane --storybook` to
unconditionally.
+#### autoScreenshotStorybookGlobals
+
+For example, with `autoScreenshotStorybookGlobals` set to:
+
+```json
+{
+ "default": {},
+ "light theme": {
+ "theme": "light"
+ },
+ "dark theme": {
+ "theme": "dark"
+ }
+}
+```
+
+3 autoscreenshot tests will be generated for each story, each test having its corresponding storybook globals value:
+
+- `... Autoscreenshot default`
+- `... Autoscreenshot light theme`
+- `... Autoscreenshot dark theme`
+
## Advanced usage
If you have `ts-node` in your project, you can write your Testplane tests right inside of storybook story files:
@@ -151,11 +185,16 @@ const meta: WithTestplane> = {
title: "Example/Button",
component: Button,
testplane: {
- skip: false, // if true, skips all Testplane tests from this story file
- autoscreenshotSelector: ".my-selector", // Custom selector to auto-screenshot elements
- browserIds: ["chrome"], // Testplane browsers to run tests from this story file
+ // If true, skips all Testplane tests from this story file
+ skip: false,
+ // Overrides default autoscreenshotSelector from plugin config
+ autoscreenshotSelector: ".my-selector",
+ // Extends default autoScreenshotStorybookGlobals from plugin config
+ autoScreenshotStorybookGlobals: { "dark theme": { theme: "dark" } },
+ // Testplane browsers to run tests from this story file
+ browserIds: ["chrome"],
+ // Overrides default assertView options for tests from this file
assertViewOpts: {
- // override default assertView options for tests from this file
ignoreDiffPixelCount: 5,
},
},
diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/plugins/testplane-storybook.mdx b/i18n/ru/docusaurus-plugin-content-docs/current/plugins/testplane-storybook.mdx
index 5d9f187..5b2c9b1 100644
--- a/i18n/ru/docusaurus-plugin-content-docs/current/plugins/testplane-storybook.mdx
+++ b/i18n/ru/docusaurus-plugin-content-docs/current/plugins/testplane-storybook.mdx
@@ -83,7 +83,19 @@ export default {
autoScreenshots |
`Boolean` |
true |
- Включить / отключить авто матическое скриншотное тестирование (будут выполняться только вручную описанные tetplane-тесты) |
+ Включить / отключить автоматическое скриншотное тестирование |
+
+
+ autoscreenshotSelector |
+ `String` |
+ "" |
+ Кастомный селектор, используемый в автоматических скриншотных тестах |
+
+
+ autoScreenshotStorybookGlobals |
+ `Record>` |
+ {} |
+ Комплекты [глобальных параметров storybook](https://storybook.js.org/docs/7/essentials/toolbars-and-globals#globals), для каждого из которых следует генерировать автоматические скриншотные тесты |
localport |
@@ -114,6 +126,28 @@ export default {
будет отключена принудительно для оптимизации скорости прохождения тестов.
+#### autoScreenshotStorybookGlobals
+
+К примеру, с `autoScreenshotStorybookGlobals` со значением:
+
+```json
+{
+ "default": {},
+ "light theme": {
+ "theme": "light"
+ },
+ "dark theme": {
+ "theme": "dark"
+ }
+}
+```
+
+Для каждой стори будут сгенерированы 3 автоскриншотных теста, каждый из которых устанавливает соответствующие глобальные параметры сторибука:
+
+- `... Autoscreenshot default`
+- `... Autoscreenshot light theme`
+- `... Autoscreenshot dark theme`
+
## Продвинутое использование
Если на Вашем проекте используется `ts-node`, то Вы можете писать testplane-тесты прямо внутри истории:
@@ -152,11 +186,16 @@ const meta: WithTestplane> = {
title: "Example/Button",
component: Button,
testplane: {
- skip: false, // если true, все testplane-тесты этого файла будут отключены
- autoscreenshotSelector: ".my-selector", // переопределение селектора для скриншота (например, если нужно сделать скриншот не всего элемента)
- browserIds: ["chrome"], // названия браузеров testplane, в которых нужно запустить тест
+ // Если true, все testplane-тесты этого файла будут отключены
+ skip: false,
+ // Переопределяет autoscreenshotSelector, описанный в конфиге плагина
+ autoscreenshotSelector: ".my-selector",
+ // Расширяет autoScreenshotStorybookGlobals, описанные в конфиге плагина
+ autoScreenshotStorybookGlobals: { "dark theme": { theme: "dark" } },
+ // Список Testplane браузеров, в которых нужно запустить тест
+ browserIds: ["chrome"],
+ // Переопределяет опции команды assertView для тестов конкретного файла
assertViewOpts: {
- // секция для переопределения опций команды assertView для конкретного файла
ignoreDiffPixelCount: 5,
},
},