feat(storybook): add storybook-addon-performance addon

This commit is contained in:
Łukasz Mierzwa
2020-04-29 13:28:53 +01:00
committed by Łukasz Mierzwa
parent 17ac90fa4e
commit 38cd75b439
5 changed files with 295 additions and 2 deletions
+3
View File
@@ -8,6 +8,8 @@ import {
import createPercyAddon from "@percy-io/percy-storybook";
import { withPerformance } from "storybook-addon-performance";
import "mobx-react-lite/batchingForReactDom";
import { advanceTo } from "jest-date-mock";
@@ -69,6 +71,7 @@ addDecorator((story) => {
</div>
);
});
addDecorator(withPerformance);
const req = require.context("../src/Components", true, /\.stories\.(js|tsx)$/);
+4
View File
@@ -0,0 +1,4 @@
module.exports = {
addons: ["storybook-addon-performance/register"],
presets: ["@storybook/preset-create-react-app"],
};
-1
View File
@@ -1 +0,0 @@
module.exports = ["@storybook/preset-create-react-app"];
+286
View File
@@ -5645,6 +5645,119 @@
"loader-utils": "^1.2.3"
}
},
"@testing-library/dom": {
"version": "7.2.2",
"resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-7.2.2.tgz",
"integrity": "sha512-g+gT//COYh2FgRrlgcgdkifkjqSk7wQIS7F8jbrf6yoEsh85PJUJ/QtO0bJ9QU7pQPYQgKcgqNJsOs0dlyFYag==",
"dev": true,
"requires": {
"@babel/runtime": "^7.9.2",
"@types/testing-library__dom": "^7.0.0",
"aria-query": "^4.0.2",
"dom-accessibility-api": "^0.4.2",
"pretty-format": "^25.1.0"
},
"dependencies": {
"aria-query": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/aria-query/-/aria-query-4.0.2.tgz",
"integrity": "sha512-S1G1V790fTaigUSM/Gd0NngzEfiMy9uTUfMyHhKhVyy4cH5O/eTuR01ydhGL0z4Za1PXFTRGH3qL8VhUQuEO5w==",
"dev": true,
"requires": {
"@babel/runtime": "^7.7.4",
"@babel/runtime-corejs3": "^7.7.4"
}
}
}
},
"@testing-library/jest-dom": {
"version": "5.5.0",
"resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-5.5.0.tgz",
"integrity": "sha512-7sWHrpxG4Yd8TmryI7Rtbx8Ff4mbs3ASye3oshQIuHvsCR+QHgr7rTR/PfeXvOmwUwR36wSTTAvrLKsPmr6VEQ==",
"dev": true,
"requires": {
"@babel/runtime": "^7.9.2",
"@types/testing-library__jest-dom": "^5.0.2",
"chalk": "^3.0.0",
"css": "^2.2.4",
"css.escape": "^1.5.1",
"jest-diff": "^25.1.0",
"jest-matcher-utils": "^25.1.0",
"lodash": "^4.17.15",
"redent": "^3.0.0"
},
"dependencies": {
"@jest/types": {
"version": "25.5.0",
"resolved": "https://registry.npmjs.org/@jest/types/-/types-25.5.0.tgz",
"integrity": "sha512-OXD0RgQ86Tu3MazKo8bnrkDRaDXXMGUqd+kTtLtK1Zb7CRzQcaSRPPPV37SvYTdevXEBVxe0HXylEjs8ibkmCw==",
"dev": true,
"requires": {
"@types/istanbul-lib-coverage": "^2.0.0",
"@types/istanbul-reports": "^1.1.1",
"@types/yargs": "^15.0.0",
"chalk": "^3.0.0"
}
},
"jest-matcher-utils": {
"version": "25.5.0",
"resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-25.5.0.tgz",
"integrity": "sha512-VWI269+9JS5cpndnpCwm7dy7JtGQT30UHfrnM3mXl22gHGt/b7NkjBqXfbhZ8V4B7ANUsjK18PlSBmG0YH7gjw==",
"dev": true,
"requires": {
"chalk": "^3.0.0",
"jest-diff": "^25.5.0",
"jest-get-type": "^25.2.6",
"pretty-format": "^25.5.0"
},
"dependencies": {
"jest-diff": {
"version": "25.5.0",
"resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-25.5.0.tgz",
"integrity": "sha512-z1kygetuPiREYdNIumRpAHY6RXiGmp70YHptjdaxTWGmA085W3iCnXNx0DhflK3vwrKmrRWyY1wUpkPMVxMK7A==",
"dev": true,
"requires": {
"chalk": "^3.0.0",
"diff-sequences": "^25.2.6",
"jest-get-type": "^25.2.6",
"pretty-format": "^25.5.0"
}
}
}
},
"pretty-format": {
"version": "25.5.0",
"resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-25.5.0.tgz",
"integrity": "sha512-kbo/kq2LQ/A/is0PQwsEHM7Ca6//bGPPvU6UnsdDRSKTWxT/ru/xb88v4BJf6a69H+uTytOEsTusT9ksd/1iWQ==",
"dev": true,
"requires": {
"@jest/types": "^25.5.0",
"ansi-regex": "^5.0.0",
"ansi-styles": "^4.0.0",
"react-is": "^16.12.0"
}
},
"redent": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/redent/-/redent-3.0.0.tgz",
"integrity": "sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==",
"dev": true,
"requires": {
"indent-string": "^4.0.0",
"strip-indent": "^3.0.0"
}
},
"strip-indent": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-3.0.0.tgz",
"integrity": "sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==",
"dev": true,
"requires": {
"min-indent": "^1.0.0"
}
}
}
},
"@types/anymatch": {
"version": "1.3.1",
"resolved": "https://registry.npmjs.org/@types/anymatch/-/anymatch-1.3.1.tgz",
@@ -5854,6 +5967,24 @@
"integrity": "sha512-/gG2M/Imw7cQFp8PGvz/SwocNrmKFjFsm5Pb8HdbHkZ1K8pmuPzOX4VeVoiEecFCVf4CsN1r3/BRvx+6sNqwtQ==",
"dev": true
},
"@types/testing-library__dom": {
"version": "7.0.2",
"resolved": "https://registry.npmjs.org/@types/testing-library__dom/-/testing-library__dom-7.0.2.tgz",
"integrity": "sha512-8yu1gSwUEAwzg2OlPNbGq+ixhmSviGurBu1+ivxRKq1eRcwdjkmlwtPvr9VhuxTq2fNHBWN2po6Iem3Xt5A6rg==",
"dev": true,
"requires": {
"pretty-format": "^25.1.0"
}
},
"@types/testing-library__jest-dom": {
"version": "5.0.3",
"resolved": "https://registry.npmjs.org/@types/testing-library__jest-dom/-/testing-library__jest-dom-5.0.3.tgz",
"integrity": "sha512-NdbKc6yseg6uq4UJFwimPws0iwsGugVbPoOTP2EH+PJMJKiZsoSg5F2H3XYweOyytftCOuIMuXifBUrF9CSvaQ==",
"dev": true,
"requires": {
"@types/jest": "*"
}
},
"@types/uglify-js": {
"version": "3.9.0",
"resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-3.9.0.tgz",
@@ -6151,6 +6282,15 @@
"@xtuc/long": "4.2.2"
}
},
"@xstate/react": {
"version": "1.0.0-rc.3",
"resolved": "https://registry.npmjs.org/@xstate/react/-/react-1.0.0-rc.3.tgz",
"integrity": "sha512-TAZdWo1vg46I6XwMzqowOHlXMByGLNppN+AuJOoruTnCYXLw9YIiXRFw0d/PEepMEE8mkIcPlbOjLXodP7FtEw==",
"dev": true,
"requires": {
"use-subscription": "^1.3.0"
}
},
"@xtuc/ieee754": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz",
@@ -7285,6 +7425,18 @@
"recast": "^0.14.7"
}
},
"babel-plugin-styled-components": {
"version": "1.10.7",
"resolved": "https://registry.npmjs.org/babel-plugin-styled-components/-/babel-plugin-styled-components-1.10.7.tgz",
"integrity": "sha512-MBMHGcIA22996n9hZRf/UJLVVgkEOITuR2SvjHLb5dSTUyR4ZRGn+ngITapes36FI3WLxZHfRhkA1ffHxihOrg==",
"dev": true,
"requires": {
"@babel/helper-annotate-as-pure": "^7.0.0",
"@babel/helper-module-imports": "^7.0.0",
"babel-plugin-syntax-jsx": "^6.18.0",
"lodash": "^4.17.11"
}
},
"babel-plugin-syntax-jsx": {
"version": "6.18.0",
"resolved": "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz",
@@ -8099,6 +8251,12 @@
}
}
},
"camelize": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/camelize/-/camelize-1.0.0.tgz",
"integrity": "sha1-FkpUg+Yw+kMh5a8HAg5TGDGyYJs=",
"dev": true
},
"can-use-dom": {
"version": "0.1.0",
"resolved": "https://registry.npmjs.org/can-use-dom/-/can-use-dom-0.1.0.tgz",
@@ -8935,6 +9093,12 @@
"parse-json": "^4.0.0"
}
},
"crc32": {
"version": "0.2.2",
"resolved": "https://registry.npmjs.org/crc32/-/crc32-0.2.2.tgz",
"integrity": "sha1-etIg1v/c0Rn5/BJ6d3LKzqOQpLo=",
"dev": true
},
"create-ecdh": {
"version": "4.0.3",
"resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.3.tgz",
@@ -9069,6 +9233,12 @@
"postcss": "^7.0.5"
}
},
"css-color-keywords": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/css-color-keywords/-/css-color-keywords-1.0.0.tgz",
"integrity": "sha1-/qJhbcZ2spYmhrOvjb2+GAskTgU=",
"dev": true
},
"css-color-names": {
"version": "0.0.4",
"resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
@@ -9159,6 +9329,17 @@
"resolved": "https://registry.npmjs.org/css-select-base-adapter/-/css-select-base-adapter-0.1.1.tgz",
"integrity": "sha512-jQVeeRG70QI08vSTwf1jHxp74JoZsr2XSgETae8/xC8ovSnL2WF87GTLO86Sbwdt2lK4Umg4HnnwMO4YF3Ce7w=="
},
"css-to-react-native": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/css-to-react-native/-/css-to-react-native-3.0.0.tgz",
"integrity": "sha512-Ro1yETZA813eoyUp2GDBhG2j+YggidUmzO1/v9eYBKR2EHVEniE2MI/NqpTQ954BMpTPZFsGNPm46qFB9dpaPQ==",
"dev": true,
"requires": {
"camelize": "^1.0.0",
"css-color-keywords": "^1.0.0",
"postcss-value-parser": "^4.0.2"
}
},
"css-tree": {
"version": "1.0.0-alpha.37",
"resolved": "https://registry.npmjs.org/css-tree/-/css-tree-1.0.0-alpha.37.tgz",
@@ -9180,6 +9361,12 @@
"resolved": "https://registry.npmjs.org/css-what/-/css-what-3.2.1.tgz",
"integrity": "sha512-WwOrosiQTvyms+Ti5ZC5vGEK0Vod3FTt1ca+payZqvKuGJF+dq7bG63DstxtN0dpm6FxY27a/zS3Wten+gEtGw=="
},
"css.escape": {
"version": "1.5.1",
"resolved": "https://registry.npmjs.org/css.escape/-/css.escape-1.5.1.tgz",
"integrity": "sha1-QuJ9T6BK4y+TGktNQZH6nN3ul8s=",
"dev": true
},
"cssdb": {
"version": "4.4.0",
"resolved": "https://registry.npmjs.org/cssdb/-/cssdb-4.4.0.tgz",
@@ -9516,6 +9703,12 @@
}
}
},
"deflate-js": {
"version": "0.2.3",
"resolved": "https://registry.npmjs.org/deflate-js/-/deflate-js-0.2.3.tgz",
"integrity": "sha1-+Fq7WOvFFRowYUdHPVfD5PfkQms=",
"dev": true
},
"del": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/del/-/del-4.1.1.tgz",
@@ -9686,6 +9879,12 @@
"esutils": "^2.0.2"
}
},
"dom-accessibility-api": {
"version": "0.4.3",
"resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.4.3.tgz",
"integrity": "sha512-JZ8iPuEHDQzq6q0k7PKMGbrIdsgBB7TRrtVOUm4nSMCExlg5qQG4KXWTH2k90yggjM4tTumRGwTKJSldMzKyLA==",
"dev": true
},
"dom-converter": {
"version": "0.2.0",
"resolved": "https://registry.npmjs.org/dom-converter/-/dom-converter-0.2.0.tgz",
@@ -11986,6 +12185,16 @@
"resolved": "https://registry.npmjs.org/gud/-/gud-1.0.0.tgz",
"integrity": "sha512-zGEOVKFM5sVPPrYs7J5/hYEw2Pof8KCyOwyhG8sAF26mCAeUFAcYPu1mwB7hhpIP29zOIBaDqwuHdLp0jvZXjw=="
},
"gzip-js": {
"version": "0.3.2",
"resolved": "https://registry.npmjs.org/gzip-js/-/gzip-js-0.3.2.tgz",
"integrity": "sha1-IxF+/usozzhSSN7/Df+tiUg22Ws=",
"dev": true,
"requires": {
"crc32": ">= 0.2.2",
"deflate-js": ">= 0.2.2"
}
},
"gzip-size": {
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-5.1.1.tgz",
@@ -21950,6 +22159,27 @@
"integrity": "sha512-llZqXAXjG2E4FvWsZxFmBDfh6kqQuGFZm64TX23qW02Hf4dyElhDEbYx1IIVTEMKWrrDnDA9oqOjY8WHo2NgcA==",
"dev": true
},
"storybook-addon-performance": {
"version": "0.10.0",
"resolved": "https://registry.npmjs.org/storybook-addon-performance/-/storybook-addon-performance-0.10.0.tgz",
"integrity": "sha512-XQh6RdJAOVGk31jtq+ZVWRF1Y8sIVZlHBZKA6L5VWhP8nh0Zu/pCwPK4DFHS5h5MAU02Iw3H2xzIywnOyzNvrA==",
"dev": true,
"requires": {
"@storybook/addons": "^5.3.18",
"@storybook/api": "^5.3.18",
"@storybook/channels": "^5.3.18",
"@storybook/components": "^5.3.18",
"@storybook/core-events": "^5.3.18",
"@storybook/theming": "^5.3.18",
"@testing-library/dom": "^7.2.1",
"@testing-library/jest-dom": "^5.3.0",
"@xstate/react": "1.0.0-rc.3",
"gzip-js": "^0.3.2",
"styled-components": "^5.1.0",
"tiny-invariant": "^1.1.0",
"xstate": "^4.8.0"
}
},
"stream-browserify": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.2.tgz",
@@ -22267,6 +22497,41 @@
}
}
},
"styled-components": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/styled-components/-/styled-components-5.1.0.tgz",
"integrity": "sha512-0Qs2wEkFBXHFlysz6CV831VG6HedcrFUwChjnWylNivsx14MtmqQsohi21rMHZxzuTba063dEyoe/SR6VGJI7Q==",
"dev": true,
"requires": {
"@babel/helper-module-imports": "^7.0.0",
"@babel/traverse": "^7.4.5",
"@emotion/is-prop-valid": "^0.8.8",
"@emotion/stylis": "^0.8.4",
"@emotion/unitless": "^0.7.4",
"babel-plugin-styled-components": ">= 1",
"css-to-react-native": "^3.0.0",
"hoist-non-react-statics": "^3.0.0",
"shallowequal": "^1.1.0",
"supports-color": "^5.5.0"
},
"dependencies": {
"has-flag": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
"integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
"dev": true
},
"supports-color": {
"version": "5.5.0",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
"integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
"dev": true,
"requires": {
"has-flag": "^3.0.0"
}
}
}
},
"stylehacks": {
"version": "4.0.3",
"resolved": "https://registry.npmjs.org/stylehacks/-/stylehacks-4.0.3.tgz",
@@ -22695,6 +22960,12 @@
"dev": true,
"optional": true
},
"tiny-invariant": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.1.0.tgz",
"integrity": "sha512-ytxQvrb1cPc9WBEI/HSeYYoGD0kWnGEOR8RY6KomWLBVhqz0RgTwVO9dLrGz7dC+nN9llyI7OKAgRq8Vq4ZBSw==",
"dev": true
},
"tlds": {
"version": "1.207.0",
"resolved": "https://registry.npmjs.org/tlds/-/tlds-1.207.0.tgz",
@@ -23095,6 +23366,15 @@
"tslib": "^1.9.3"
}
},
"use-subscription": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/use-subscription/-/use-subscription-1.4.1.tgz",
"integrity": "sha512-7+IIwDG/4JICrWHL/Q/ZPK5yozEnvRm6vHImu0LKwQlmWGKeiF7mbAenLlK/cTNXrTtXHU/SFASQHzB6+oSJMQ==",
"dev": true,
"requires": {
"object-assign": "^4.1.1"
}
},
"util": {
"version": "0.10.3",
"resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
@@ -25268,6 +25548,12 @@
"@babel/runtime-corejs3": "^7.8.3"
}
},
"xstate": {
"version": "4.9.1",
"resolved": "https://registry.npmjs.org/xstate/-/xstate-4.9.1.tgz",
"integrity": "sha512-cfNnRaBebnr1tvs0nHBUTyomfJx36+8MWwXceyNTZfjyELMM8nIoiBDcUzfKmpNlnAvs2ZPREos19cw6Zl4nng==",
"dev": true
},
"xtend": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
+2 -1
View File
@@ -91,7 +91,8 @@
"markdownlint-cli": "0.22.0",
"node-sass": "4.14.0",
"prettier": "2.0.5",
"source-map-explorer": "2.4.2"
"source-map-explorer": "2.4.2",
"storybook-addon-performance": "0.10.0"
},
"browserslist": [
">= 1%",