creevey 0.9.0-beta.2 → 0.9.0-non-webpack.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/AUTHORS +15 -15
- package/CHANGELOG.md +1275 -1275
- package/LICENSE +21 -21
- package/README.md +7 -0
- package/addon/README.md +3 -0
- package/addon/package.json +4 -0
- package/docs/config.md +212 -212
- package/docs/grid.md +10 -10
- package/docs/tests.md +63 -63
- package/jest.config.js +6 -0
- package/lib/cjs/client/addon/Manager.js +123 -271
- package/lib/cjs/client/addon/components/Addon.js +17 -38
- package/lib/cjs/client/addon/components/Icons.js +12 -8
- package/lib/cjs/client/addon/components/Panel.js +17 -13
- package/lib/cjs/client/addon/components/TestSelect.js +11 -9
- package/lib/cjs/client/addon/components/Tools.js +21 -40
- package/lib/cjs/client/addon/decorator.js +1 -1
- package/lib/cjs/client/addon/index.js +31 -0
- package/lib/cjs/client/addon/preset.js +13 -32
- package/lib/cjs/client/addon/register.js +46 -70
- package/lib/cjs/client/addon/utils.js +1 -1
- package/lib/cjs/client/addon/withCreevey.js +164 -344
- package/lib/cjs/client/shared/components/ImagesView/BlendView.js +23 -21
- package/lib/cjs/client/shared/components/ImagesView/ImagesView.js +22 -18
- package/lib/cjs/client/shared/components/ImagesView/SideBySideView.js +42 -64
- package/lib/cjs/client/shared/components/ImagesView/SlideView.js +35 -48
- package/lib/cjs/client/shared/components/ImagesView/SwapView.js +24 -43
- package/lib/cjs/client/shared/components/ImagesView/index.js +9 -9
- package/lib/cjs/client/shared/components/PageFooter/PageFooter.js +12 -8
- package/lib/cjs/client/shared/components/PageFooter/Paging.js +14 -18
- package/lib/cjs/client/shared/components/PageHeader/ImagePreview.js +22 -18
- package/lib/cjs/client/shared/components/PageHeader/PageHeader.js +42 -67
- package/lib/cjs/client/shared/components/ResultsPage.js +39 -69
- package/lib/cjs/client/shared/creeveyClientApi.js +55 -82
- package/lib/cjs/client/shared/helpers.js +143 -214
- package/lib/cjs/client/shared/viewMode.js +5 -5
- package/lib/cjs/client/web/142.js +2 -0
- package/lib/cjs/client/web/142.js.LICENSE.txt +12 -0
- package/lib/cjs/client/web/32.js +1 -0
- package/lib/cjs/client/web/551.js +1 -0
- package/lib/cjs/client/web/566.js +2 -0
- package/lib/cjs/client/web/566.js.LICENSE.txt +31 -0
- package/lib/cjs/client/web/691.js +2 -0
- package/lib/cjs/client/web/691.js.LICENSE.txt +8 -0
- package/lib/cjs/client/web/725.js +1 -0
- package/lib/cjs/client/web/index.html +19 -19
- package/lib/cjs/client/web/main.js +2 -38
- package/lib/cjs/client/web/main.js.LICENSE.txt +49 -0
- package/lib/cjs/creevey.js +3 -5
- package/lib/cjs/index.js +4 -4
- package/lib/cjs/server/config.js +1 -1
- package/lib/cjs/server/docker.js +3 -7
- package/lib/cjs/server/index.js +1 -1
- package/lib/cjs/server/loaders/babel/creevey-plugin.js +1 -3
- package/lib/cjs/server/loaders/babel/helpers.js +13 -23
- package/lib/cjs/server/loaders/babel/register.js +1 -3
- package/lib/cjs/server/loaders/webpack/compile.js +31 -24
- package/lib/cjs/server/loaders/webpack/creevey-loader.js +10 -5
- package/lib/cjs/server/loaders/webpack/dummy-hmr.js +2 -7
- package/lib/cjs/server/loaders/webpack/mdx-loader.js +1 -1
- package/lib/cjs/server/loaders/webpack/start.js +1 -1
- package/lib/cjs/server/logger.js +2 -1
- package/lib/cjs/server/master/index.js +2 -2
- package/lib/cjs/server/master/pool.js +9 -18
- package/lib/cjs/server/master/runner.js +53 -66
- package/lib/cjs/server/master/server.js +2 -2
- package/lib/cjs/server/messages.js +8 -10
- package/lib/cjs/server/selenium/browser.js +23 -31
- package/lib/cjs/server/selenium/selenoid.js +5 -7
- package/lib/cjs/server/stories.js +9 -20
- package/lib/cjs/server/storybook/entry.js +5 -3
- package/lib/cjs/server/storybook/helpers.js +15 -21
- package/lib/cjs/server/storybook/providers/browser.js +5 -9
- package/lib/cjs/server/storybook/providers/nodejs.js +4 -4
- package/lib/cjs/server/update.js +1 -5
- package/lib/cjs/server/utils.js +13 -15
- package/lib/cjs/server/worker/reporter.js +8 -20
- package/lib/cjs/server/worker/worker.js +6 -16
- package/lib/cjs/shared/index.js +101 -0
- package/lib/cjs/shared/serializeRegExp.js +42 -0
- package/lib/cjs/types.js +6 -6
- package/lib/esm/client/addon/Manager.js +123 -271
- package/lib/esm/client/addon/components/Addon.js +15 -34
- package/lib/esm/client/addon/components/Icons.js +11 -7
- package/lib/esm/client/addon/components/Panel.js +17 -13
- package/lib/esm/client/addon/components/TestSelect.js +11 -9
- package/lib/esm/client/addon/components/Tools.js +19 -36
- package/lib/esm/client/addon/decorator.js +1 -1
- package/lib/esm/client/addon/index.js +2 -0
- package/lib/esm/client/addon/preset.js +10 -25
- package/lib/esm/client/addon/register.js +42 -66
- package/lib/esm/client/addon/utils.js +1 -1
- package/lib/esm/client/addon/withCreevey.js +157 -341
- package/lib/esm/client/shared/components/ImagesView/BlendView.js +21 -17
- package/lib/esm/client/shared/components/ImagesView/ImagesView.js +21 -17
- package/lib/esm/client/shared/components/ImagesView/SideBySideView.js +40 -60
- package/lib/esm/client/shared/components/ImagesView/SlideView.js +33 -44
- package/lib/esm/client/shared/components/ImagesView/SwapView.js +22 -39
- package/lib/esm/client/shared/components/PageFooter/PageFooter.js +12 -8
- package/lib/esm/client/shared/components/PageFooter/Paging.js +14 -18
- package/lib/esm/client/shared/components/PageHeader/ImagePreview.js +22 -18
- package/lib/esm/client/shared/components/PageHeader/PageHeader.js +37 -60
- package/lib/esm/client/shared/components/ResultsPage.js +36 -64
- package/lib/esm/client/shared/creeveyClientApi.js +57 -84
- package/lib/esm/client/shared/helpers.js +127 -198
- package/lib/esm/client/shared/viewMode.js +4 -4
- package/lib/esm/creevey.js +3 -5
- package/lib/esm/index.js +1 -3
- package/lib/esm/server/docker.js +2 -2
- package/lib/esm/server/index.js +1 -1
- package/lib/esm/server/loaders/babel/creevey-plugin.js +1 -3
- package/lib/esm/server/loaders/babel/helpers.js +12 -22
- package/lib/esm/server/loaders/babel/register.js +1 -3
- package/lib/esm/server/loaders/webpack/compile.js +31 -24
- package/lib/esm/server/loaders/webpack/creevey-loader.js +9 -4
- package/lib/esm/server/loaders/webpack/dummy-hmr.js +2 -6
- package/lib/esm/server/loaders/webpack/start.js +1 -1
- package/lib/esm/server/master/index.js +2 -2
- package/lib/esm/server/master/pool.js +7 -18
- package/lib/esm/server/master/runner.js +53 -66
- package/lib/esm/server/master/server.js +2 -2
- package/lib/esm/server/messages.js +3 -5
- package/lib/esm/server/selenium/browser.js +20 -28
- package/lib/esm/server/selenium/selenoid.js +4 -6
- package/lib/esm/server/stories.js +9 -20
- package/lib/esm/server/storybook/entry.js +4 -2
- package/lib/esm/server/storybook/helpers.js +7 -15
- package/lib/esm/server/storybook/providers/browser.js +4 -5
- package/lib/esm/server/storybook/providers/nodejs.js +3 -3
- package/lib/esm/server/update.js +1 -5
- package/lib/esm/server/utils.js +5 -9
- package/lib/esm/server/worker/reporter.js +8 -20
- package/lib/esm/server/worker/worker.js +6 -16
- package/lib/esm/shared/index.js +78 -0
- package/lib/esm/shared/serializeRegExp.js +24 -0
- package/lib/types/cli.d.ts +1 -1
- package/lib/types/client/addon/Manager.d.ts +37 -37
- package/lib/types/client/addon/components/Addon.d.ts +8 -8
- package/lib/types/client/addon/components/Icons.d.ts +7 -7
- package/lib/types/client/addon/components/Panel.d.ts +9 -9
- package/lib/types/client/addon/components/TestSelect.d.ts +8 -9
- package/lib/types/client/addon/components/Tools.d.ts +6 -6
- package/lib/types/client/addon/decorator.d.ts +1 -1
- package/lib/types/client/addon/index.d.ts +2 -0
- package/lib/types/client/addon/preset.d.ts +23 -24
- package/lib/types/client/addon/readyForCapture.d.ts +6 -6
- package/lib/types/client/addon/register.d.ts +3 -3
- package/lib/types/client/addon/utils.d.ts +2 -2
- package/lib/types/client/addon/withCreevey.d.ts +24 -24
- package/lib/types/client/shared/components/ImagesView/BlendView.d.ts +3 -3
- package/lib/types/client/shared/components/ImagesView/ImagesView.d.ts +24 -25
- package/lib/types/client/shared/components/ImagesView/SideBySideView.d.ts +3 -3
- package/lib/types/client/shared/components/ImagesView/SlideView.d.ts +3 -3
- package/lib/types/client/shared/components/ImagesView/SwapView.d.ts +3 -3
- package/lib/types/client/shared/components/ImagesView/index.d.ts +5 -5
- package/lib/types/client/shared/components/PageFooter/PageFooter.d.ts +8 -9
- package/lib/types/client/shared/components/PageFooter/Paging.d.ts +7 -8
- package/lib/types/client/shared/components/PageHeader/ImagePreview.d.ts +12 -12
- package/lib/types/client/shared/components/PageHeader/PageHeader.d.ts +16 -17
- package/lib/types/client/shared/components/ResultsPage.d.ts +18 -18
- package/lib/types/client/shared/creeveyClientApi.d.ts +9 -9
- package/lib/types/client/shared/helpers.d.ts +46 -46
- package/lib/types/client/shared/viewMode.d.ts +4 -4
- package/lib/types/client/web/CreeveyApp.d.ts +11 -12
- package/lib/types/client/web/CreeveyContext.d.ts +11 -11
- package/lib/types/client/web/CreeveyLoader.d.ts +2 -3
- package/lib/types/client/web/CreeveyView/SideBar/Checkbox.d.ts +19 -19
- package/lib/types/client/web/CreeveyView/SideBar/Search.d.ts +6 -6
- package/lib/types/client/web/CreeveyView/SideBar/SideBar.d.ts +14 -14
- package/lib/types/client/web/CreeveyView/SideBar/SideBarHeader.d.ts +12 -13
- package/lib/types/client/web/CreeveyView/SideBar/SuiteLink.d.ts +33 -33
- package/lib/types/client/web/CreeveyView/SideBar/TestLink.d.ts +7 -8
- package/lib/types/client/web/CreeveyView/SideBar/TestStatusIcon.d.ts +10 -10
- package/lib/types/client/web/CreeveyView/SideBar/TestsStatus.d.ts +9 -9
- package/lib/types/client/web/CreeveyView/SideBar/Toggle.d.ts +6 -6
- package/lib/types/client/web/CreeveyView/SideBar/index.d.ts +1 -1
- package/lib/types/client/web/KeyboardEventsContext.d.ts +13 -13
- package/lib/types/client/web/index.d.ts +4 -4
- package/lib/types/creevey.d.ts +1 -1
- package/lib/types/index.d.ts +0 -1
- package/lib/types/server/config.d.ts +4 -4
- package/lib/types/server/docker.d.ts +7 -7
- package/lib/types/server/extract.d.ts +2 -2
- package/lib/types/server/index.d.ts +2 -2
- package/lib/types/server/loaders/babel/creevey-plugin.d.ts +1 -1
- package/lib/types/server/loaders/babel/helpers.d.ts +19 -19
- package/lib/types/server/loaders/babel/register.d.ts +5 -5
- package/lib/types/server/loaders/hooks/mdx.d.ts +1 -1
- package/lib/types/server/loaders/hooks/svelte.d.ts +1 -1
- package/lib/types/server/loaders/webpack/compile.d.ts +2 -2
- package/lib/types/server/loaders/webpack/creevey-loader.d.ts +4 -2
- package/lib/types/server/loaders/webpack/dummy-hmr.d.ts +10 -10
- package/lib/types/server/loaders/webpack/mdx-loader.d.ts +6 -6
- package/lib/types/server/loaders/webpack/start.d.ts +1 -1
- package/lib/types/server/logger.d.ts +10 -6
- package/lib/types/server/master/api.d.ts +7 -7
- package/lib/types/server/master/index.d.ts +3 -3
- package/lib/types/server/master/master.d.ts +7 -7
- package/lib/types/server/master/pool.d.ts +31 -31
- package/lib/types/server/master/runner.d.ts +26 -26
- package/lib/types/server/master/server.d.ts +2 -2
- package/lib/types/server/messages.d.ts +27 -27
- package/lib/types/server/selenium/browser.d.ts +17 -17
- package/lib/types/server/selenium/index.d.ts +2 -2
- package/lib/types/server/selenium/selenoid.d.ts +3 -3
- package/lib/types/server/stories.d.ts +8 -8
- package/lib/types/server/storybook/entry.d.ts +18 -18
- package/lib/types/server/storybook/helpers.d.ts +24 -24
- package/lib/types/server/storybook/providers/browser.d.ts +4 -4
- package/lib/types/server/storybook/providers/hybrid.d.ts +4 -4
- package/lib/types/server/storybook/providers/nodejs.d.ts +9 -9
- package/lib/types/server/testsFiles/parser.d.ts +12 -12
- package/lib/types/server/testsFiles/register.d.ts +2 -2
- package/lib/types/server/update.d.ts +2 -2
- package/lib/types/server/utils.d.ts +20 -20
- package/lib/types/server/worker/chai-image.d.ts +6 -6
- package/lib/types/server/worker/helpers.d.ts +8 -8
- package/lib/types/server/worker/index.d.ts +1 -1
- package/lib/types/server/worker/reporter.d.ts +8 -8
- package/lib/types/server/worker/worker.d.ts +4 -4
- package/lib/types/{shared.d.ts → shared/index.d.ts} +7 -16
- package/lib/types/shared/serializeRegExp.d.ts +9 -0
- package/lib/types/types.d.ts +490 -489
- package/package.json +115 -102
- package/preset.js +9 -9
- package/types/babel__register.d.ts +1 -1
- package/types/chai.d.ts +12 -12
- package/types/event-source-polyfill.d.ts +6 -6
- package/types/mdx.d.ts +3 -2
- package/types/mocha.d.ts +20 -20
- package/types/png.d.ts +4 -4
- package/lib/cjs/client/web/1.js +0 -13
- package/lib/cjs/client/web/2.js +0 -1
- package/lib/cjs/shared.js +0 -124
- package/lib/esm/shared.js +0 -93
- package/storybook-static/stories.json +0 -21
@@ -1,82 +1,44 @@
|
|
1
|
-
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
2
|
-
|
3
|
-
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
4
|
-
|
5
|
-
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
6
|
-
|
7
|
-
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
8
|
-
|
9
|
-
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
10
|
-
|
11
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
12
|
-
|
13
|
-
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
|
14
|
-
|
15
|
-
function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
|
16
|
-
|
17
|
-
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
18
|
-
|
19
1
|
import * as Events from '@storybook/core-events';
|
20
2
|
import * as polyfill from 'event-source-polyfill';
|
21
|
-
|
3
|
+
import { buildQueries, within } from '@storybook/testing-library';
|
22
4
|
import { addons, makeDecorator } from '@storybook/addons';
|
23
5
|
import { isObject, noop } from '../../types';
|
24
6
|
import { denormalizeStoryParameters, serializeRawStories } from '../../shared';
|
25
7
|
import { getConnectionUrl } from '../shared/helpers';
|
26
8
|
|
27
|
-
if (
|
9
|
+
if (typeof process != 'object' || typeof process.version != 'string') {
|
28
10
|
// NOTE If you don't use babel-polyfill or any other polyfills that add EventSource for IE11
|
29
11
|
// You don't get hot reload in IE11. So put polyfill for that to better UX
|
30
12
|
// Don't load in nodejs environment
|
31
13
|
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
|
32
|
-
|
33
|
-
|
14
|
+
const {
|
15
|
+
NativeEventSource,
|
16
|
+
EventSourcePolyfill
|
17
|
+
} = polyfill; // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
|
34
18
|
|
35
19
|
window.EventSource = NativeEventSource || EventSourcePolyfill;
|
36
20
|
}
|
37
21
|
|
38
|
-
|
22
|
+
const disableAnimationsStyles = "\n*,\n*:hover,\n*::before,\n*::after {\n animation-delay: -0.0001ms !important;\n animation-duration: 0s !important;\n animation-play-state: paused !important;\n cursor: none !important;\n caret-color: transparent !important;\n transition: 0s !important;\n}\n";
|
39
23
|
|
40
|
-
function resetCurrentStory(
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
while (1) {
|
48
|
-
switch (_context4.prev = _context4.next) {
|
49
|
-
case 0:
|
50
|
-
setTimeout(function () {
|
51
|
-
return channel.emit(Events.SET_CURRENT_STORY, {
|
52
|
-
storyId: true,
|
53
|
-
name: '',
|
54
|
-
kind: ''
|
55
|
-
});
|
56
|
-
}, 0);
|
57
|
-
return _context4.abrupt("return", new Promise(function (resolve) {
|
58
|
-
return channel.once(Events.STORY_MISSING, resolve);
|
59
|
-
}));
|
60
|
-
|
61
|
-
case 2:
|
62
|
-
case "end":
|
63
|
-
return _context4.stop();
|
64
|
-
}
|
65
|
-
}
|
66
|
-
}, _callee4);
|
67
|
-
}));
|
68
|
-
return _resetCurrentStory.apply(this, arguments);
|
24
|
+
async function resetCurrentStory(channel) {
|
25
|
+
setTimeout(() => channel.emit(Events.SET_CURRENT_STORY, {
|
26
|
+
storyId: true,
|
27
|
+
name: '',
|
28
|
+
kind: ''
|
29
|
+
}), 0);
|
30
|
+
return new Promise(resolve => channel.once(Events.STORY_MISSING, resolve));
|
69
31
|
}
|
70
32
|
|
71
33
|
function catchRenderError(channel) {
|
72
|
-
|
73
|
-
|
74
|
-
return rejectCallback = reject;
|
75
|
-
});
|
34
|
+
let rejectCallback;
|
35
|
+
const promise = new Promise((_resolve, reject) => rejectCallback = reject);
|
76
36
|
|
77
37
|
function errorHandler(_ref) {
|
78
|
-
|
79
|
-
|
38
|
+
let {
|
39
|
+
title,
|
40
|
+
description
|
41
|
+
} = _ref;
|
80
42
|
rejectCallback({
|
81
43
|
message: title,
|
82
44
|
stack: description
|
@@ -100,10 +62,8 @@ function catchRenderError(channel) {
|
|
100
62
|
}
|
101
63
|
|
102
64
|
function waitForStoryRendered(channel) {
|
103
|
-
|
104
|
-
|
105
|
-
return resolveCallback = resolve;
|
106
|
-
});
|
65
|
+
let resolveCallback;
|
66
|
+
const promise = new Promise(resolve => resolveCallback = resolve);
|
107
67
|
|
108
68
|
function renderHandler() {
|
109
69
|
resolveCallback();
|
@@ -121,13 +81,11 @@ function waitForStoryRendered(channel) {
|
|
121
81
|
|
122
82
|
function waitForFontsLoaded() {
|
123
83
|
if (!document.fonts) return;
|
124
|
-
|
125
|
-
return font.status == 'loading';
|
126
|
-
});
|
84
|
+
const areFontsLoading = Array.from(document.fonts).some(font => font.status == 'loading');
|
127
85
|
|
128
86
|
if (areFontsLoading) {
|
129
|
-
return new Promise(
|
130
|
-
|
87
|
+
return new Promise(resolve => {
|
88
|
+
const fontsLoadedHandler = () => {
|
131
89
|
document.fonts.removeEventListener('loadingdone', fontsLoadedHandler);
|
132
90
|
resolve();
|
133
91
|
};
|
@@ -138,244 +96,132 @@ function waitForFontsLoaded() {
|
|
138
96
|
}
|
139
97
|
|
140
98
|
function waitForCaptureCall() {
|
141
|
-
return new Promise(
|
142
|
-
return captureResolver = resolve;
|
143
|
-
});
|
99
|
+
return new Promise(resolve => captureResolver = resolve);
|
144
100
|
}
|
145
101
|
|
146
102
|
function initCreeveyState() {
|
147
103
|
var _window$localStorage$;
|
148
104
|
|
149
|
-
|
105
|
+
const prevState = JSON.parse((_window$localStorage$ = window.localStorage.getItem('Creevey_Tests')) !== null && _window$localStorage$ !== void 0 ? _window$localStorage$ : '{}');
|
150
106
|
if (prevState.creeveyHost) window.__CREEVEY_SERVER_HOST__ = prevState.creeveyHost;
|
151
107
|
if (prevState.creeveyPort) window.__CREEVEY_SERVER_PORT__ = prevState.creeveyPort;
|
152
108
|
if (prevState.setStoriesCounter) setStoriesCounter = prevState.setStoriesCounter;
|
153
109
|
if (prevState.isTestBrowser) isTestBrowser = prevState.isTestBrowser;
|
154
|
-
window.addEventListener('beforeunload',
|
110
|
+
window.addEventListener('beforeunload', () => {
|
155
111
|
window.localStorage.setItem('Creevey_Tests', JSON.stringify({
|
156
112
|
creeveyHost: window.__CREEVEY_SERVER_HOST__,
|
157
113
|
creeveyPort: window.__CREEVEY_SERVER_PORT__,
|
158
|
-
setStoriesCounter
|
159
|
-
isTestBrowser
|
114
|
+
setStoriesCounter,
|
115
|
+
isTestBrowser
|
160
116
|
}));
|
161
117
|
});
|
162
118
|
}
|
163
119
|
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
120
|
+
let isTestBrowser = false;
|
121
|
+
let captureResolver;
|
122
|
+
let waitForCreevey;
|
123
|
+
let creeveyReady;
|
124
|
+
let setStoriesCounter = 0;
|
169
125
|
export function withCreevey() {
|
170
|
-
|
171
|
-
|
126
|
+
let currentStory = '';
|
127
|
+
let isAnimationDisabled = false;
|
172
128
|
initCreeveyState();
|
173
129
|
|
174
130
|
function disableAnimation() {
|
175
131
|
isAnimationDisabled = true;
|
176
|
-
|
177
|
-
|
132
|
+
const style = document.createElement('style');
|
133
|
+
const textNode = document.createTextNode(disableAnimationsStyles);
|
178
134
|
style.setAttribute('type', 'text/css');
|
179
135
|
style.appendChild(textNode);
|
180
136
|
document.head.appendChild(style);
|
181
137
|
}
|
182
138
|
|
183
|
-
function getStories() {
|
184
|
-
|
185
|
-
|
186
|
-
|
187
|
-
|
188
|
-
|
189
|
-
|
190
|
-
|
191
|
-
|
192
|
-
|
193
|
-
|
194
|
-
|
195
|
-
|
196
|
-
|
197
|
-
|
198
|
-
|
199
|
-
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
204
|
-
|
205
|
-
|
206
|
-
|
207
|
-
|
208
|
-
|
209
|
-
|
210
|
-
|
211
|
-
|
212
|
-
|
213
|
-
|
214
|
-
|
215
|
-
|
216
|
-
|
217
|
-
|
218
|
-
|
219
|
-
|
220
|
-
_context.next = 9;
|
221
|
-
return store.cacheAllCSFFiles();
|
222
|
-
|
223
|
-
case 9:
|
224
|
-
addons.getChannel().emit(Events.SET_STORIES, store.getSetStoriesPayload());
|
225
|
-
_context.next = 13;
|
226
|
-
break;
|
227
|
-
|
228
|
-
case 12:
|
229
|
-
return _context.abrupt("return");
|
230
|
-
|
231
|
-
case 13:
|
232
|
-
addons.getChannel().on(Events.SET_STORIES, function (data) {
|
233
|
-
// TODO Figure out how to get only updated stories
|
234
|
-
// TODO Subscribe on hmr? like use dummy-hmr
|
235
|
-
setStoriesCounter += 1;
|
236
|
-
var stories = serializeRawStories(denormalizeStoryParameters(data));
|
237
|
-
var storiesByFiles = new Map();
|
238
|
-
Object.values(stories).forEach(function (story) {
|
239
|
-
var storiesFromFile = storiesByFiles.get(story.parameters.fileName);
|
240
|
-
if (storiesFromFile) storiesFromFile.push(story);else storiesByFiles.set(story.parameters.fileName, [story]);
|
241
|
-
});
|
242
|
-
void fetch("http://".concat(getConnectionUrl(), "/stories"), {
|
243
|
-
method: 'POST',
|
244
|
-
headers: {
|
245
|
-
'Content-Type': 'application/json'
|
246
|
-
},
|
247
|
-
body: JSON.stringify({
|
248
|
-
setStoriesCounter: setStoriesCounter,
|
249
|
-
stories: _toConsumableArray(storiesByFiles.entries())
|
250
|
-
})
|
251
|
-
});
|
252
|
-
});
|
253
|
-
return _context.abrupt("return", storiesPromise);
|
254
|
-
|
255
|
-
case 15:
|
256
|
-
case "end":
|
257
|
-
return _context.stop();
|
258
|
-
}
|
259
|
-
}
|
260
|
-
}, _callee);
|
261
|
-
}));
|
262
|
-
return _getStories.apply(this, arguments);
|
263
|
-
}
|
264
|
-
|
265
|
-
function selectStory(_x2, _x3, _x4, _x5, _x6) {
|
266
|
-
return _selectStory.apply(this, arguments);
|
139
|
+
async function getStories() {
|
140
|
+
var _window$__STORYBOOK_S;
|
141
|
+
|
142
|
+
const storiesPromise = new Promise(resolve => addons.getChannel().once(Events.SET_STORIES, data => resolve(serializeRawStories(denormalizeStoryParameters(data)))));
|
143
|
+
const store = (_window$__STORYBOOK_S = window.__STORYBOOK_STORY_STORE__) !== null && _window$__STORYBOOK_S !== void 0 ? _window$__STORYBOOK_S : {}; // @ts-expect-error `pushToManager` exists only in Storybook 6.0 - 6.3
|
144
|
+
|
145
|
+
if (store.pushToManager) {
|
146
|
+
// @ts-expect-error `pushToManager` exists only in Storybook 6.0 - 6.3
|
147
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-call
|
148
|
+
store.pushToManager();
|
149
|
+
} else if (store.cacheAllCSFFiles) {
|
150
|
+
await store.cacheAllCSFFiles();
|
151
|
+
addons.getChannel().emit(Events.SET_STORIES, store.getSetStoriesPayload());
|
152
|
+
} else return;
|
153
|
+
|
154
|
+
addons.getChannel().on(Events.SET_STORIES, data => {
|
155
|
+
// TODO Figure out how to get only updated stories
|
156
|
+
// TODO Subscribe on hmr? like use dummy-hmr
|
157
|
+
setStoriesCounter += 1;
|
158
|
+
const stories = serializeRawStories(denormalizeStoryParameters(data));
|
159
|
+
const storiesByFiles = new Map();
|
160
|
+
Object.values(stories).forEach(story => {
|
161
|
+
const storiesFromFile = storiesByFiles.get(story.parameters.fileName);
|
162
|
+
if (storiesFromFile) storiesFromFile.push(story);else storiesByFiles.set(story.parameters.fileName, [story]);
|
163
|
+
});
|
164
|
+
void fetch("http://".concat(getConnectionUrl(), "/stories"), {
|
165
|
+
method: 'POST',
|
166
|
+
headers: {
|
167
|
+
'Content-Type': 'application/json'
|
168
|
+
},
|
169
|
+
body: JSON.stringify({
|
170
|
+
setStoriesCounter,
|
171
|
+
stories: [...storiesByFiles.entries()]
|
172
|
+
})
|
173
|
+
});
|
174
|
+
});
|
175
|
+
return storiesPromise;
|
267
176
|
}
|
268
177
|
|
269
|
-
function
|
270
|
-
|
271
|
-
|
272
|
-
|
273
|
-
|
274
|
-
|
275
|
-
|
276
|
-
|
277
|
-
|
278
|
-
|
279
|
-
|
280
|
-
|
281
|
-
|
282
|
-
|
283
|
-
|
284
|
-
|
285
|
-
|
286
|
-
|
287
|
-
|
288
|
-
|
289
|
-
|
290
|
-
|
291
|
-
|
292
|
-
|
293
|
-
|
294
|
-
|
295
|
-
|
296
|
-
|
297
|
-
|
298
|
-
|
299
|
-
|
300
|
-
|
301
|
-
|
302
|
-
|
303
|
-
capturePromise = waitForCaptureCall().then(function () {
|
304
|
-
return isCaptureCalled = true;
|
305
|
-
});
|
306
|
-
setTimeout(function () {
|
307
|
-
return channel.emit(Events.SET_CURRENT_STORY, {
|
308
|
-
storyId: storyId,
|
309
|
-
name: name,
|
310
|
-
kind: kind
|
311
|
-
});
|
312
|
-
}, 0);
|
313
|
-
_context3.prev = 15;
|
314
|
-
_context3.next = 18;
|
315
|
-
return Promise.race([_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
|
316
|
-
return regeneratorRuntime.wrap(function _callee2$(_context2) {
|
317
|
-
while (1) {
|
318
|
-
switch (_context2.prev = _context2.next) {
|
319
|
-
case 0:
|
320
|
-
_context2.next = 2;
|
321
|
-
return Promise.race([renderPromise, capturePromise]);
|
322
|
-
|
323
|
-
case 2:
|
324
|
-
_context2.next = 4;
|
325
|
-
return waitForFontsLoaded();
|
326
|
-
|
327
|
-
case 4:
|
328
|
-
_context2.next = 6;
|
329
|
-
return waitForReady;
|
330
|
-
|
331
|
-
case 6:
|
332
|
-
case "end":
|
333
|
-
return _context2.stop();
|
334
|
-
}
|
335
|
-
}
|
336
|
-
}, _callee2);
|
337
|
-
}))(), errorPromise]);
|
338
|
-
|
339
|
-
case 18:
|
340
|
-
callback([null, isCaptureCalled]);
|
341
|
-
_context3.next = 25;
|
342
|
-
break;
|
343
|
-
|
344
|
-
case 21:
|
345
|
-
_context3.prev = 21;
|
346
|
-
_context3.t0 = _context3["catch"](15);
|
347
|
-
// NOTE Event `STORY_THREW_EXCEPTION` triggered only in react and vue frameworks and return Error instance
|
348
|
-
// NOTE Event `STORY_ERRORED` return error-like object without `name` field
|
349
|
-
errorMessage = _context3.t0 instanceof Error ? (_reason$stack = _context3.t0.stack) !== null && _reason$stack !== void 0 ? _reason$stack : _context3.t0.message : isObject(_context3.t0) ? "".concat(_context3.t0.message, "\n ").concat(_context3.t0.stack) : _context3.t0;
|
350
|
-
callback([errorMessage]);
|
351
|
-
|
352
|
-
case 25:
|
353
|
-
_context3.prev = 25;
|
354
|
-
renderPromise.cancel();
|
355
|
-
errorPromise.cancel();
|
356
|
-
return _context3.finish(25);
|
357
|
-
|
358
|
-
case 29:
|
359
|
-
case "end":
|
360
|
-
return _context3.stop();
|
361
|
-
}
|
362
|
-
}
|
363
|
-
}, _callee3, null, [[15, 21, 25, 29]]);
|
364
|
-
}));
|
365
|
-
return _selectStory.apply(this, arguments);
|
178
|
+
async function selectStory(storyId, kind, name, shouldWaitForReady, callback) {
|
179
|
+
if (!isAnimationDisabled) disableAnimation();
|
180
|
+
isTestBrowser = true;
|
181
|
+
const channel = addons.getChannel();
|
182
|
+
const waitForReady = shouldWaitForReady ? new Promise(resolve => window.__CREEVEY_SET_READY_FOR_CAPTURE__ = resolve) : Promise.resolve();
|
183
|
+
if (storyId == currentStory) await resetCurrentStory(channel);else currentStory = storyId;
|
184
|
+
let isCaptureCalled = false;
|
185
|
+
const renderPromise = waitForStoryRendered(channel);
|
186
|
+
const errorPromise = catchRenderError(channel);
|
187
|
+
const capturePromise = waitForCaptureCall().then(() => isCaptureCalled = true);
|
188
|
+
setTimeout(() => channel.emit(Events.SET_CURRENT_STORY, {
|
189
|
+
storyId,
|
190
|
+
name,
|
191
|
+
kind
|
192
|
+
}), 0);
|
193
|
+
|
194
|
+
try {
|
195
|
+
await Promise.race([(async () => {
|
196
|
+
await Promise.race([renderPromise, capturePromise]);
|
197
|
+
await waitForFontsLoaded();
|
198
|
+
await waitForReady;
|
199
|
+
})(), errorPromise]);
|
200
|
+
callback([null, isCaptureCalled]);
|
201
|
+
} catch (reason) {
|
202
|
+
var _reason$stack;
|
203
|
+
|
204
|
+
// NOTE Event `STORY_THREW_EXCEPTION` triggered only in react and vue frameworks and return Error instance
|
205
|
+
// NOTE Event `STORY_ERRORED` return error-like object without `name` field
|
206
|
+
const errorMessage = reason instanceof Error ? (_reason$stack = reason.stack) !== null && _reason$stack !== void 0 ? _reason$stack : reason.message : isObject(reason) ? "".concat(reason.message, "\n ").concat(reason.stack) : reason;
|
207
|
+
callback([errorMessage]);
|
208
|
+
} finally {
|
209
|
+
renderPromise.cancel();
|
210
|
+
errorPromise.cancel();
|
211
|
+
}
|
366
212
|
}
|
367
213
|
|
368
214
|
function updateGlobals(globals) {
|
369
215
|
addons.getChannel().emit(Events.UPDATE_GLOBALS, {
|
370
|
-
globals
|
216
|
+
globals
|
371
217
|
});
|
372
218
|
}
|
373
219
|
|
374
220
|
function insertIgnoreStyles(ignoreSelectors) {
|
375
|
-
|
221
|
+
const stylesElement = document.createElement('style');
|
376
222
|
stylesElement.setAttribute('type', 'text/css');
|
377
223
|
document.head.appendChild(stylesElement);
|
378
|
-
ignoreSelectors.forEach(
|
224
|
+
ignoreSelectors.forEach(selector => {
|
379
225
|
stylesElement.innerHTML += "\n ".concat(selector, " {\n background: #000 !important;\n box-shadow: none !important;\n text-shadow: none !important;\n outline: 0 !important;\n color: rgba(0,0,0,0) !important;\n }\n ").concat(selector, " *, ").concat(selector, "::before, ").concat(selector, "::after {\n visibility: hidden !important;\n }\n ");
|
380
226
|
});
|
381
227
|
return stylesElement;
|
@@ -389,15 +235,15 @@ export function withCreevey() {
|
|
389
235
|
|
390
236
|
function hasPlayCompletedYet(callback) {
|
391
237
|
creeveyReady();
|
392
|
-
|
393
|
-
|
394
|
-
|
395
|
-
void waitForStoryRendered(channel).then(
|
238
|
+
let isCaptureCalled = false;
|
239
|
+
let isPlayCompleted = false;
|
240
|
+
const channel = addons.getChannel();
|
241
|
+
void waitForStoryRendered(channel).then(() => {
|
396
242
|
if (isCaptureCalled) return;
|
397
243
|
isPlayCompleted = true;
|
398
244
|
callback(true);
|
399
245
|
});
|
400
|
-
void waitForCaptureCall().then(
|
246
|
+
void waitForCaptureCall().then(() => {
|
401
247
|
if (isPlayCompleted) return;
|
402
248
|
isCaptureCalled = true;
|
403
249
|
callback(false);
|
@@ -410,49 +256,50 @@ export function withCreevey() {
|
|
410
256
|
window.__CREEVEY_INSERT_IGNORE_STYLES__ = insertIgnoreStyles;
|
411
257
|
window.__CREEVEY_REMOVE_IGNORE_STYLES__ = removeIgnoreStyles;
|
412
258
|
window.__CREEVEY_HAS_PLAY_COMPLETED_YET__ = hasPlayCompletedYet;
|
413
|
-
window.__CREEVEY_SET_READY_FOR_CAPTURE__ = noop;
|
414
|
-
// [...container.querySelectorAll(query)].filter((e) => e instanceof HTMLElement) as HTMLElement[];
|
415
|
-
// const getMultipleError = (_: Element | null, query: string): string => `Found multiple elements by query: ${query}`;
|
416
|
-
// const getMissingError = (_: Element | null, query: string): string => `Unable to find an element by query: ${query}`;
|
417
|
-
// const [queryByQuery, getAllByQuery, getByQuery, findAllByQuery, findByQuery] = buildQueries(
|
418
|
-
// queryAllByQuery,
|
419
|
-
// getMultipleError,
|
420
|
-
// getMissingError,
|
421
|
-
// );
|
422
|
-
// const queries = {
|
423
|
-
// queryByQuery,
|
424
|
-
// getAllByQuery,
|
425
|
-
// getByQuery,
|
426
|
-
// findAllByQuery,
|
427
|
-
// findByQuery,
|
428
|
-
// };
|
259
|
+
window.__CREEVEY_SET_READY_FOR_CAPTURE__ = noop;
|
429
260
|
|
261
|
+
const queryAllByQuery = (container, query) => [...container.querySelectorAll(query)].filter(e => e instanceof HTMLElement);
|
262
|
+
|
263
|
+
const getMultipleError = (_, query) => "Found multiple elements by query: ".concat(query);
|
264
|
+
|
265
|
+
const getMissingError = (_, query) => "Unable to find an element by query: ".concat(query);
|
266
|
+
|
267
|
+
const [queryByQuery, getAllByQuery, getByQuery, findAllByQuery, findByQuery] = buildQueries(queryAllByQuery, getMultipleError, getMissingError);
|
268
|
+
const queries = {
|
269
|
+
queryByQuery,
|
270
|
+
getAllByQuery,
|
271
|
+
getByQuery,
|
272
|
+
findAllByQuery,
|
273
|
+
findByQuery
|
274
|
+
};
|
430
275
|
return makeDecorator({
|
431
276
|
name: 'withCreevey',
|
432
277
|
parameterName: 'creevey',
|
433
|
-
wrapper:
|
278
|
+
wrapper: (getStory, context) => {
|
434
279
|
var _ref2;
|
435
280
|
|
436
281
|
// TODO Define proper types, like captureElement is a promise
|
437
|
-
|
438
|
-
|
439
|
-
|
282
|
+
const {
|
283
|
+
captureElement
|
284
|
+
} = context.parameters.creevey = (_ref2 = context.parameters.creevey) !== null && _ref2 !== void 0 ? _ref2 : {};
|
440
285
|
Object.defineProperty(context.parameters.creevey, 'captureElement', {
|
441
|
-
get
|
286
|
+
get() {
|
442
287
|
switch (true) {
|
443
288
|
case captureElement === undefined:
|
444
289
|
return Promise.resolve(context.canvasElement);
|
445
290
|
|
446
291
|
case captureElement === null:
|
447
292
|
return Promise.resolve(document.documentElement);
|
448
|
-
|
449
|
-
|
293
|
+
|
294
|
+
case typeof captureElement == 'string':
|
295
|
+
return within(context.canvasElement, queries).findByQuery(captureElement);
|
450
296
|
|
451
297
|
case typeof captureElement == 'function':
|
452
298
|
// TODO Define type for it
|
453
299
|
return Promise.resolve(captureElement(context));
|
454
300
|
}
|
455
301
|
},
|
302
|
+
|
456
303
|
enumerable: true,
|
457
304
|
configurable: true
|
458
305
|
});
|
@@ -460,50 +307,19 @@ export function withCreevey() {
|
|
460
307
|
}
|
461
308
|
});
|
462
309
|
}
|
463
|
-
export function capture(
|
464
|
-
|
465
|
-
|
466
|
-
|
467
|
-
|
468
|
-
|
469
|
-
|
470
|
-
|
471
|
-
|
472
|
-
|
473
|
-
|
474
|
-
|
475
|
-
|
476
|
-
|
477
|
-
|
478
|
-
return _context5.abrupt("return");
|
479
|
-
|
480
|
-
case 2:
|
481
|
-
captureResolver();
|
482
|
-
waitForCreevey = new Promise(function (resolve) {
|
483
|
-
return creeveyReady = resolve;
|
484
|
-
});
|
485
|
-
_context5.next = 6;
|
486
|
-
return fetch("http://".concat(getConnectionUrl(), "/capture"), {
|
487
|
-
method: 'POST',
|
488
|
-
headers: {
|
489
|
-
'Content-Type': 'application/json'
|
490
|
-
},
|
491
|
-
body: JSON.stringify({
|
492
|
-
workerId: window.__CREEVEY_WORKER_ID__,
|
493
|
-
options: options
|
494
|
-
})
|
495
|
-
});
|
496
|
-
|
497
|
-
case 6:
|
498
|
-
_context5.next = 8;
|
499
|
-
return waitForCreevey;
|
500
|
-
|
501
|
-
case 8:
|
502
|
-
case "end":
|
503
|
-
return _context5.stop();
|
504
|
-
}
|
505
|
-
}
|
506
|
-
}, _callee5);
|
507
|
-
}));
|
508
|
-
return _capture.apply(this, arguments);
|
310
|
+
export async function capture(options) {
|
311
|
+
if (!isTestBrowser) return;
|
312
|
+
captureResolver();
|
313
|
+
waitForCreevey = new Promise(resolve => creeveyReady = resolve);
|
314
|
+
await fetch("http://".concat(getConnectionUrl(), "/capture"), {
|
315
|
+
method: 'POST',
|
316
|
+
headers: {
|
317
|
+
'Content-Type': 'application/json'
|
318
|
+
},
|
319
|
+
body: JSON.stringify({
|
320
|
+
workerId: window.__CREEVEY_WORKER_ID__,
|
321
|
+
options
|
322
|
+
})
|
323
|
+
});
|
324
|
+
await waitForCreevey;
|
509
325
|
}
|