creevey 0.9.0-beta.2 → 0.9.0-beta.4
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/CHANGELOG.md +35 -0
- package/README.md +9 -1
- package/addon/README.md +3 -0
- package/addon/package.json +4 -0
- package/docs/config.md +29 -26
- package/jest.config.js +6 -0
- package/lib/cjs/client/addon/Manager.js +122 -270
- package/lib/cjs/client/addon/components/Addon.js +17 -38
- package/lib/cjs/client/addon/components/Icons.js +11 -7
- 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.ie11.js +74 -0
- package/lib/cjs/client/addon/preset.js +14 -33
- package/lib/cjs/client/addon/register.js +46 -70
- package/lib/cjs/client/addon/utils.js +6 -2
- package/lib/cjs/client/addon/withCreevey.js +161 -342
- 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 +139 -210
- 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/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 +2 -4
- package/lib/cjs/server/docker.js +3 -7
- package/lib/cjs/server/extract.js +1 -5
- 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 +2 -4
- package/lib/cjs/server/loaders/webpack/compile.js +34 -51
- package/lib/cjs/server/loaders/webpack/creevey-loader.js +20 -22
- package/lib/cjs/server/loaders/webpack/dummy-hmr.js +2 -7
- package/lib/cjs/server/loaders/webpack/mdx-loader.js +2 -2
- 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 +5 -3
- package/lib/cjs/server/messages.js +8 -10
- package/lib/cjs/server/selenium/browser.js +22 -46
- package/lib/cjs/server/selenium/selenoid.js +5 -7
- package/lib/cjs/server/stories.js +16 -33
- package/lib/cjs/server/storybook/entry.js +7 -22
- package/lib/cjs/server/storybook/helpers.js +20 -27
- package/lib/cjs/server/storybook/providers/browser.js +5 -9
- package/lib/cjs/server/storybook/providers/nodejs.js +7 -9
- package/lib/cjs/server/update.js +1 -5
- package/lib/cjs/server/utils.js +27 -36
- 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 +122 -270
- package/lib/esm/client/addon/components/Addon.js +15 -34
- package/lib/esm/client/addon/components/Icons.js +10 -6
- 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.ie11.js +59 -0
- package/lib/esm/client/addon/preset.js +12 -27
- package/lib/esm/client/addon/register.js +42 -66
- package/lib/esm/client/addon/utils.js +3 -2
- package/lib/esm/client/addon/withCreevey.js +155 -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 +123 -194
- 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/config.js +2 -4
- package/lib/esm/server/docker.js +2 -2
- package/lib/esm/server/extract.js +1 -3
- 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 +3 -5
- package/lib/esm/server/loaders/webpack/compile.js +35 -52
- package/lib/esm/server/loaders/webpack/creevey-loader.js +9 -10
- package/lib/esm/server/loaders/webpack/dummy-hmr.js +2 -6
- package/lib/esm/server/loaders/webpack/mdx-loader.js +2 -2
- 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 +5 -3
- package/lib/esm/server/messages.js +3 -5
- package/lib/esm/server/selenium/browser.js +19 -43
- package/lib/esm/server/selenium/selenoid.js +4 -6
- package/lib/esm/server/stories.js +16 -32
- package/lib/esm/server/storybook/entry.js +5 -22
- package/lib/esm/server/storybook/helpers.js +11 -20
- package/lib/esm/server/storybook/providers/browser.js +4 -5
- package/lib/esm/server/storybook/providers/nodejs.js +7 -8
- package/lib/esm/server/update.js +1 -5
- package/lib/esm/server/utils.js +18 -31
- 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/preset.ie11.d.ts +10 -0
- 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 +3 -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 +17 -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 +24 -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 +489 -489
- package/package.json +114 -102
- package/preset/ie11.js +5 -0
- package/{preset.js → preset/index.js} +2 -2
- package/types/mdx.d.ts +3 -2
- 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,45 @@
|
|
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';
|
8
|
+
import { isInternetExplorer } from './utils';
|
26
9
|
|
27
|
-
if (
|
10
|
+
if (typeof process != 'object' || typeof process.version != 'string') {
|
28
11
|
// NOTE If you don't use babel-polyfill or any other polyfills that add EventSource for IE11
|
29
12
|
// You don't get hot reload in IE11. So put polyfill for that to better UX
|
30
13
|
// Don't load in nodejs environment
|
31
14
|
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
|
32
|
-
|
33
|
-
|
15
|
+
const {
|
16
|
+
NativeEventSource,
|
17
|
+
EventSourcePolyfill
|
18
|
+
} = polyfill; // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
|
34
19
|
|
35
20
|
window.EventSource = NativeEventSource || EventSourcePolyfill;
|
36
21
|
}
|
37
22
|
|
38
|
-
|
23
|
+
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
24
|
|
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);
|
25
|
+
async function resetCurrentStory(channel) {
|
26
|
+
setTimeout(() => channel.emit(Events.SET_CURRENT_STORY, {
|
27
|
+
storyId: true,
|
28
|
+
name: '',
|
29
|
+
kind: ''
|
30
|
+
}), 0);
|
31
|
+
return new Promise(resolve => channel.once(Events.STORY_MISSING, resolve));
|
69
32
|
}
|
70
33
|
|
71
34
|
function catchRenderError(channel) {
|
72
|
-
|
73
|
-
|
74
|
-
return rejectCallback = reject;
|
75
|
-
});
|
35
|
+
let rejectCallback;
|
36
|
+
const promise = new Promise((_resolve, reject) => rejectCallback = reject);
|
76
37
|
|
77
38
|
function errorHandler(_ref) {
|
78
|
-
|
79
|
-
|
39
|
+
let {
|
40
|
+
title,
|
41
|
+
description
|
42
|
+
} = _ref;
|
80
43
|
rejectCallback({
|
81
44
|
message: title,
|
82
45
|
stack: description
|
@@ -100,10 +63,8 @@ function catchRenderError(channel) {
|
|
100
63
|
}
|
101
64
|
|
102
65
|
function waitForStoryRendered(channel) {
|
103
|
-
|
104
|
-
|
105
|
-
return resolveCallback = resolve;
|
106
|
-
});
|
66
|
+
let resolveCallback;
|
67
|
+
const promise = new Promise(resolve => resolveCallback = resolve);
|
107
68
|
|
108
69
|
function renderHandler() {
|
109
70
|
resolveCallback();
|
@@ -121,13 +82,11 @@ function waitForStoryRendered(channel) {
|
|
121
82
|
|
122
83
|
function waitForFontsLoaded() {
|
123
84
|
if (!document.fonts) return;
|
124
|
-
|
125
|
-
return font.status == 'loading';
|
126
|
-
});
|
85
|
+
const areFontsLoading = Array.from(document.fonts).some(font => font.status == 'loading');
|
127
86
|
|
128
87
|
if (areFontsLoading) {
|
129
|
-
return new Promise(
|
130
|
-
|
88
|
+
return new Promise(resolve => {
|
89
|
+
const fontsLoadedHandler = () => {
|
131
90
|
document.fonts.removeEventListener('loadingdone', fontsLoadedHandler);
|
132
91
|
resolve();
|
133
92
|
};
|
@@ -138,244 +97,128 @@ function waitForFontsLoaded() {
|
|
138
97
|
}
|
139
98
|
|
140
99
|
function waitForCaptureCall() {
|
141
|
-
return new Promise(
|
142
|
-
return captureResolver = resolve;
|
143
|
-
});
|
100
|
+
return new Promise(resolve => captureResolver = resolve);
|
144
101
|
}
|
145
102
|
|
146
103
|
function initCreeveyState() {
|
147
104
|
var _window$localStorage$;
|
148
105
|
|
149
|
-
|
106
|
+
const prevState = JSON.parse((_window$localStorage$ = window.localStorage.getItem('Creevey_Tests')) !== null && _window$localStorage$ !== void 0 ? _window$localStorage$ : '{}');
|
150
107
|
if (prevState.creeveyHost) window.__CREEVEY_SERVER_HOST__ = prevState.creeveyHost;
|
151
108
|
if (prevState.creeveyPort) window.__CREEVEY_SERVER_PORT__ = prevState.creeveyPort;
|
152
109
|
if (prevState.setStoriesCounter) setStoriesCounter = prevState.setStoriesCounter;
|
153
110
|
if (prevState.isTestBrowser) isTestBrowser = prevState.isTestBrowser;
|
154
|
-
window.addEventListener('beforeunload',
|
111
|
+
window.addEventListener('beforeunload', () => {
|
155
112
|
window.localStorage.setItem('Creevey_Tests', JSON.stringify({
|
156
113
|
creeveyHost: window.__CREEVEY_SERVER_HOST__,
|
157
114
|
creeveyPort: window.__CREEVEY_SERVER_PORT__,
|
158
|
-
setStoriesCounter
|
159
|
-
isTestBrowser
|
115
|
+
setStoriesCounter,
|
116
|
+
isTestBrowser
|
160
117
|
}));
|
161
118
|
});
|
162
119
|
}
|
163
120
|
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
121
|
+
let isTestBrowser = false;
|
122
|
+
let captureResolver;
|
123
|
+
let waitForCreevey;
|
124
|
+
let creeveyReady;
|
125
|
+
let setStoriesCounter = 0;
|
169
126
|
export function withCreevey() {
|
170
|
-
|
171
|
-
|
127
|
+
let currentStory = '';
|
128
|
+
let isAnimationDisabled = false;
|
172
129
|
initCreeveyState();
|
173
130
|
|
174
131
|
function disableAnimation() {
|
175
132
|
isAnimationDisabled = true;
|
176
|
-
|
177
|
-
|
133
|
+
const style = document.createElement('style');
|
134
|
+
const textNode = document.createTextNode(disableAnimationsStyles);
|
178
135
|
style.setAttribute('type', 'text/css');
|
179
136
|
style.appendChild(textNode);
|
180
137
|
document.head.appendChild(style);
|
181
138
|
}
|
182
139
|
|
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
|
-
_context.next = 12;
|
217
|
-
break;
|
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);
|
140
|
+
async function getStories() {
|
141
|
+
var _window$__STORYBOOK_S;
|
142
|
+
|
143
|
+
const storiesPromise = new Promise(resolve => addons.getChannel().once(Events.SET_STORIES, data => resolve(serializeRawStories(denormalizeStoryParameters(data)))));
|
144
|
+
const store = (_window$__STORYBOOK_S = window.__STORYBOOK_STORY_STORE__) !== null && _window$__STORYBOOK_S !== void 0 ? _window$__STORYBOOK_S : {};
|
145
|
+
|
146
|
+
if (store.cacheAllCSFFiles) {
|
147
|
+
await store.cacheAllCSFFiles();
|
148
|
+
addons.getChannel().emit(Events.SET_STORIES, store.getSetStoriesPayload());
|
149
|
+
} else return;
|
150
|
+
|
151
|
+
addons.getChannel().on(Events.SET_STORIES, data => {
|
152
|
+
// TODO Figure out how to get only updated stories
|
153
|
+
// TODO Subscribe on hmr? like use dummy-hmr
|
154
|
+
setStoriesCounter += 1;
|
155
|
+
const stories = serializeRawStories(denormalizeStoryParameters(data));
|
156
|
+
const storiesByFiles = new Map();
|
157
|
+
Object.values(stories).forEach(story => {
|
158
|
+
const storiesFromFile = storiesByFiles.get(story.parameters.fileName);
|
159
|
+
if (storiesFromFile) storiesFromFile.push(story);else storiesByFiles.set(story.parameters.fileName, [story]);
|
160
|
+
});
|
161
|
+
void fetch("http://".concat(getConnectionUrl(), "/stories"), {
|
162
|
+
method: 'POST',
|
163
|
+
headers: {
|
164
|
+
'Content-Type': 'application/json'
|
165
|
+
},
|
166
|
+
body: JSON.stringify({
|
167
|
+
setStoriesCounter,
|
168
|
+
stories: [...storiesByFiles.entries()]
|
169
|
+
})
|
170
|
+
});
|
171
|
+
});
|
172
|
+
return storiesPromise;
|
267
173
|
}
|
268
174
|
|
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);
|
175
|
+
async function selectStory(storyId, kind, name, shouldWaitForReady, callback) {
|
176
|
+
if (!isAnimationDisabled) disableAnimation();
|
177
|
+
isTestBrowser = true;
|
178
|
+
const channel = addons.getChannel();
|
179
|
+
const waitForReady = shouldWaitForReady ? new Promise(resolve => window.__CREEVEY_SET_READY_FOR_CAPTURE__ = resolve) : Promise.resolve();
|
180
|
+
if (storyId == currentStory) await resetCurrentStory(channel);else currentStory = storyId;
|
181
|
+
let isCaptureCalled = false;
|
182
|
+
const renderPromise = waitForStoryRendered(channel);
|
183
|
+
const errorPromise = catchRenderError(channel);
|
184
|
+
const capturePromise = waitForCaptureCall().then(() => isCaptureCalled = true);
|
185
|
+
setTimeout(() => channel.emit(Events.SET_CURRENT_STORY, {
|
186
|
+
storyId,
|
187
|
+
name,
|
188
|
+
kind
|
189
|
+
}), 0);
|
190
|
+
|
191
|
+
try {
|
192
|
+
await Promise.race([(async () => {
|
193
|
+
await Promise.race([renderPromise, capturePromise]);
|
194
|
+
await waitForFontsLoaded();
|
195
|
+
await waitForReady;
|
196
|
+
})(), errorPromise]);
|
197
|
+
callback([null, isCaptureCalled]);
|
198
|
+
} catch (reason) {
|
199
|
+
var _reason$stack;
|
200
|
+
|
201
|
+
// NOTE Event `STORY_THREW_EXCEPTION` triggered only in react and vue frameworks and return Error instance
|
202
|
+
// NOTE Event `STORY_ERRORED` return error-like object without `name` field
|
203
|
+
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;
|
204
|
+
callback([errorMessage]);
|
205
|
+
} finally {
|
206
|
+
renderPromise.cancel();
|
207
|
+
errorPromise.cancel();
|
208
|
+
}
|
366
209
|
}
|
367
210
|
|
368
211
|
function updateGlobals(globals) {
|
369
212
|
addons.getChannel().emit(Events.UPDATE_GLOBALS, {
|
370
|
-
globals
|
213
|
+
globals
|
371
214
|
});
|
372
215
|
}
|
373
216
|
|
374
217
|
function insertIgnoreStyles(ignoreSelectors) {
|
375
|
-
|
218
|
+
const stylesElement = document.createElement('style');
|
376
219
|
stylesElement.setAttribute('type', 'text/css');
|
377
220
|
document.head.appendChild(stylesElement);
|
378
|
-
ignoreSelectors.forEach(
|
221
|
+
ignoreSelectors.forEach(selector => {
|
379
222
|
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
223
|
});
|
381
224
|
return stylesElement;
|
@@ -389,15 +232,15 @@ export function withCreevey() {
|
|
389
232
|
|
390
233
|
function hasPlayCompletedYet(callback) {
|
391
234
|
creeveyReady();
|
392
|
-
|
393
|
-
|
394
|
-
|
395
|
-
void waitForStoryRendered(channel).then(
|
235
|
+
let isCaptureCalled = false;
|
236
|
+
let isPlayCompleted = false;
|
237
|
+
const channel = addons.getChannel();
|
238
|
+
void waitForStoryRendered(channel).then(() => {
|
396
239
|
if (isCaptureCalled) return;
|
397
240
|
isPlayCompleted = true;
|
398
241
|
callback(true);
|
399
242
|
});
|
400
|
-
void waitForCaptureCall().then(
|
243
|
+
void waitForCaptureCall().then(() => {
|
401
244
|
if (isPlayCompleted) return;
|
402
245
|
isCaptureCalled = true;
|
403
246
|
callback(false);
|
@@ -410,49 +253,51 @@ export function withCreevey() {
|
|
410
253
|
window.__CREEVEY_INSERT_IGNORE_STYLES__ = insertIgnoreStyles;
|
411
254
|
window.__CREEVEY_REMOVE_IGNORE_STYLES__ = removeIgnoreStyles;
|
412
255
|
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
|
-
// };
|
256
|
+
window.__CREEVEY_SET_READY_FOR_CAPTURE__ = noop;
|
429
257
|
|
258
|
+
const queryAllByQuery = (container, query) => [...container.querySelectorAll(query)].filter(e => e instanceof HTMLElement);
|
259
|
+
|
260
|
+
const getMultipleError = (_, query) => "Found multiple elements by query: ".concat(query);
|
261
|
+
|
262
|
+
const getMissingError = (_, query) => "Unable to find an element by query: ".concat(query);
|
263
|
+
|
264
|
+
const [queryByQuery, getAllByQuery, getByQuery, findAllByQuery, findByQuery] = buildQueries(queryAllByQuery, getMultipleError, getMissingError);
|
265
|
+
const queries = {
|
266
|
+
queryByQuery,
|
267
|
+
getAllByQuery,
|
268
|
+
getByQuery,
|
269
|
+
findAllByQuery,
|
270
|
+
findByQuery
|
271
|
+
};
|
430
272
|
return makeDecorator({
|
431
273
|
name: 'withCreevey',
|
432
274
|
parameterName: 'creevey',
|
433
|
-
wrapper:
|
275
|
+
wrapper: (getStory, context) => {
|
434
276
|
var _ref2;
|
435
277
|
|
436
278
|
// TODO Define proper types, like captureElement is a promise
|
437
|
-
|
438
|
-
|
439
|
-
|
279
|
+
const {
|
280
|
+
captureElement
|
281
|
+
} = context.parameters.creevey = (_ref2 = context.parameters.creevey) !== null && _ref2 !== void 0 ? _ref2 : {};
|
440
282
|
Object.defineProperty(context.parameters.creevey, 'captureElement', {
|
441
|
-
get
|
283
|
+
get() {
|
442
284
|
switch (true) {
|
443
285
|
case captureElement === undefined:
|
444
286
|
return Promise.resolve(context.canvasElement);
|
445
287
|
|
446
288
|
case captureElement === null:
|
447
289
|
return Promise.resolve(document.documentElement);
|
448
|
-
|
449
|
-
|
290
|
+
|
291
|
+
case typeof captureElement == 'string':
|
292
|
+
return isInternetExplorer // some code from testing-library makes IE hang
|
293
|
+
? Promise.resolve(context.canvasElement.querySelector(captureElement)) : within(context.canvasElement, queries).findByQuery(captureElement);
|
450
294
|
|
451
295
|
case typeof captureElement == 'function':
|
452
296
|
// TODO Define type for it
|
453
297
|
return Promise.resolve(captureElement(context));
|
454
298
|
}
|
455
299
|
},
|
300
|
+
|
456
301
|
enumerable: true,
|
457
302
|
configurable: true
|
458
303
|
});
|
@@ -460,50 +305,19 @@ export function withCreevey() {
|
|
460
305
|
}
|
461
306
|
});
|
462
307
|
}
|
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);
|
308
|
+
export async function capture(options) {
|
309
|
+
if (!isTestBrowser) return;
|
310
|
+
captureResolver();
|
311
|
+
waitForCreevey = new Promise(resolve => creeveyReady = resolve);
|
312
|
+
await fetch("http://".concat(getConnectionUrl(), "/capture"), {
|
313
|
+
method: 'POST',
|
314
|
+
headers: {
|
315
|
+
'Content-Type': 'application/json'
|
316
|
+
},
|
317
|
+
body: JSON.stringify({
|
318
|
+
workerId: window.__CREEVEY_WORKER_ID__,
|
319
|
+
options
|
320
|
+
})
|
321
|
+
});
|
322
|
+
await waitForCreevey;
|
509
323
|
}
|