storybook-addon-playwright 4.14.2 → 4.14.5
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/dist/components/ResizeBrowserToPreview/ResizeBrowserToPreview.d.ts +3 -0
- package/dist/components/ResizeBrowserToPreview/ResizeBrowserToPreview.js +41 -0
- package/dist/components/ResizeBrowserToPreview/ResizeBrowserToPreview.js.map +1 -0
- package/dist/components/screenshot-preview/Toolbar.js +5 -3
- package/dist/components/screenshot-preview/Toolbar.js.map +1 -1
- package/package.json +2 -2
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.ResizeBrowserToPreview = void 0;
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
6
|
+
const components_1 = require("@storybook/components");
|
|
7
|
+
const core_1 = require("@material-ui/core");
|
|
8
|
+
const utils_1 = require("../../utils");
|
|
9
|
+
const hooks_1 = require("../../hooks");
|
|
10
|
+
const ResizeBrowserToPreview = () => {
|
|
11
|
+
const { setBrowserOptions, browserOptions } = hooks_1.useBrowserOptions();
|
|
12
|
+
const { setScreenshotOptions, screenshotOptions } = hooks_1.useScreenshotOptions();
|
|
13
|
+
const handleClick = react_1.default.useCallback(() => {
|
|
14
|
+
const iframe = utils_1.getPreviewIframe();
|
|
15
|
+
if (iframe) {
|
|
16
|
+
const iframeRect = iframe.getBoundingClientRect();
|
|
17
|
+
setBrowserOptions('all', Object.assign(Object.assign({}, browserOptions), { viewport: {
|
|
18
|
+
height: Math.round(iframeRect.height),
|
|
19
|
+
width: Math.round(iframeRect.width),
|
|
20
|
+
} }));
|
|
21
|
+
setScreenshotOptions(Object.assign(Object.assign({}, screenshotOptions), { clip: undefined }));
|
|
22
|
+
}
|
|
23
|
+
}, [
|
|
24
|
+
browserOptions,
|
|
25
|
+
screenshotOptions,
|
|
26
|
+
setBrowserOptions,
|
|
27
|
+
setScreenshotOptions,
|
|
28
|
+
]);
|
|
29
|
+
return (react_1.default.createElement(components_1.IconButton, { onClick: handleClick },
|
|
30
|
+
react_1.default.createElement(core_1.Tooltip, { placement: "top", title: 'Adjust the browser size to match the preview.' },
|
|
31
|
+
react_1.default.createElement("svg", { className: "MuiSvgIcon-root", focusable: "false", "aria-hidden": "true", viewBox: "0 0 24 24", style: {
|
|
32
|
+
height: 20,
|
|
33
|
+
transform: 'rotate(180deg)',
|
|
34
|
+
width: 20,
|
|
35
|
+
} },
|
|
36
|
+
react_1.default.createElement("path", { d: "M17 4h3c1.1 0 2 .9 2 2v2h-2V6h-3V4zM4 8V6h3V4H4c-1.1 0-2 .9-2 2v2h2zm16 8v2h-3v2h3c1.1 0 2-.9 2-2v-2h-2zM7 18H4v-2H2v2c0 1.1.9 2 2 2h3v-2zM18 8H6v8h12V8z" }),
|
|
37
|
+
' '))));
|
|
38
|
+
};
|
|
39
|
+
exports.ResizeBrowserToPreview = ResizeBrowserToPreview;
|
|
40
|
+
ResizeBrowserToPreview.displayName = 'ResizeBrowserToPreview';
|
|
41
|
+
//# sourceMappingURL=ResizeBrowserToPreview.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ResizeBrowserToPreview.js","sourceRoot":"","sources":["../../../src/components/ResizeBrowserToPreview/ResizeBrowserToPreview.tsx"],"names":[],"mappings":";;;;AAAA,0DAA0B;AAC1B,sDAAmD;AACnD,4CAA4C;AAC5C,uCAA+C;AAC/C,uCAAsE;AAEtE,MAAM,sBAAsB,GAAa,GAAG,EAAE;IAC5C,MAAM,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,yBAAiB,EAAE,CAAC;IAClE,MAAM,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,GAAG,4BAAoB,EAAE,CAAC;IAE3E,MAAM,WAAW,GAAG,eAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACzC,MAAM,MAAM,GAAG,wBAAgB,EAAE,CAAC;QAClC,IAAI,MAAM,EAAE;YACV,MAAM,UAAU,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;YAElD,iBAAiB,CAAC,KAAK,kCAClB,cAAc,KACjB,QAAQ,EAAE;oBACR,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC;oBACrC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC;iBACpC,IACD,CAAC;YACH,oBAAoB,iCACf,iBAAiB,KACpB,IAAI,EAAE,SAAS,IACf,CAAC;SACJ;IACH,CAAC,EAAE;QACD,cAAc;QACd,iBAAiB;QACjB,iBAAiB;QACjB,oBAAoB;KACrB,CAAC,CAAC;IAEH,OAAO,CACL,8BAAC,uBAAU,IAAC,OAAO,EAAE,WAAW;QAC9B,8BAAC,cAAO,IACN,SAAS,EAAC,KAAK,EACf,KAAK,EAAE,+CAA+C;YAEtD,uCACE,SAAS,EAAC,iBAAiB,EAC3B,SAAS,EAAC,OAAO,iBACL,MAAM,EAClB,OAAO,EAAC,WAAW,EACnB,KAAK,EAAE;oBACL,MAAM,EAAE,EAAE;oBACV,SAAS,EAAE,gBAAgB;oBAC3B,KAAK,EAAE,EAAE;iBACV;gBAED,wCAAM,CAAC,EAAC,2JAA2J,GAAQ;gBAAC,GAAG,CAC3K,CACE,CACC,CACd,CAAC;AACJ,CAAC,CAAC;AAIO,wDAAsB;AAF/B,sBAAsB,CAAC,WAAW,GAAG,wBAAwB,CAAC"}
|
|
@@ -16,6 +16,7 @@ const BrowserOptions_1 = require("./BrowserOptions");
|
|
|
16
16
|
const ScreenshotOptions_1 = require("./ScreenshotOptions");
|
|
17
17
|
const ClipperButton_1 = require("../Clipper/ClipperButton");
|
|
18
18
|
const ResetSettings_1 = require("./ResetSettings");
|
|
19
|
+
const ResizeBrowserToPreview_1 = require("../ResizeBrowserToPreview/ResizeBrowserToPreview");
|
|
19
20
|
const Toolbar = (props) => {
|
|
20
21
|
const { browserTypes, toggleBrowser, activeBrowsers, onCLose, onRefresh, isVertical, onSave, } = props;
|
|
21
22
|
const { setBrowserOptions, browserOptions } = hooks_1.useBrowserOptions();
|
|
@@ -32,12 +33,13 @@ const Toolbar = (props) => {
|
|
|
32
33
|
: 'Show cursor' },
|
|
33
34
|
react_1.default.createElement(NearMe_1.default, { style: { transform: 'rotate(-80deg)' } }))),
|
|
34
35
|
react_1.default.createElement(ClipperButton_1.ClipperButton, null),
|
|
35
|
-
react_1.default.createElement(
|
|
36
|
-
react_1.default.createElement(core_1.Tooltip, { placement: "top", title: "Refresh" },
|
|
37
|
-
react_1.default.createElement(RefreshSharp_1.default, null))),
|
|
36
|
+
react_1.default.createElement(ResizeBrowserToPreview_1.ResizeBrowserToPreview, null),
|
|
38
37
|
react_1.default.createElement(components_1.IconButton, { onClick: onSave },
|
|
39
38
|
react_1.default.createElement(core_1.Tooltip, { placement: "top", title: "Save screenshots" },
|
|
40
39
|
react_1.default.createElement(SaveAltOutlined_1.default, null))),
|
|
40
|
+
react_1.default.createElement(components_1.IconButton, { onClick: onRefresh },
|
|
41
|
+
react_1.default.createElement(core_1.Tooltip, { placement: "top", title: "Refresh" },
|
|
42
|
+
react_1.default.createElement(RefreshSharp_1.default, null))),
|
|
41
43
|
react_1.default.createElement(ResetSettings_1.ResetSettings, null),
|
|
42
44
|
react_1.default.createElement(ScreenshotOptions_1.ScreenshotOptions, null),
|
|
43
45
|
react_1.default.createElement(BrowserOptions_1.BrowserOptions, { browserType: "all" }),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toolbar.js","sourceRoot":"","sources":["../../../src/components/screenshot-preview/Toolbar.tsx"],"names":[],"mappings":";;;;AAAA,uDAA2C;AAC3C,sDAAmD;AAEnD,6FAA6D;AAC7D,sCAAqD;AACrD,2FAA2D;AAC3D,mEAAgE;AAChE,iGAA0D;AAC1D,uCAAgD;AAChD,4CAA4C;AAC5C,+EAAmD;AACnD,qDAAkD;AAClD,2DAAwD;AACxD,4DAAyD;AACzD,mDAAgD;
|
|
1
|
+
{"version":3,"file":"Toolbar.js","sourceRoot":"","sources":["../../../src/components/screenshot-preview/Toolbar.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "storybook-addon-playwright",
|
|
3
|
-
"version": "4.14.
|
|
3
|
+
"version": "4.14.5",
|
|
4
4
|
"description": "An addon to visually test the stories in the multiple browsers within storybook environment",
|
|
5
5
|
"author": "m.doaie <mdoaie@yahoo.co.uk>",
|
|
6
6
|
"engines": {
|
|
@@ -124,7 +124,7 @@
|
|
|
124
124
|
"hash-sum": "^2.0.0",
|
|
125
125
|
"ip": "^1.1.5",
|
|
126
126
|
"jest-image-snapshot": "^4.5.1",
|
|
127
|
-
"join-images": "
|
|
127
|
+
"join-images": "1.1.4",
|
|
128
128
|
"jsonfile": "^6.1.0",
|
|
129
129
|
"lodash": "^4.17.20",
|
|
130
130
|
"nanoid": "^3.1.18",
|