storybook_vitest_addon 0.0.3 → 0.0.6

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.
Files changed (5) hide show
  1. package/CHANGELOG.md +38 -0
  2. package/README.md +14 -6
  3. package/dist/cjs/Panel.js +52 -17
  4. package/dist/esm/Panel.js +52 -17
  5. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,3 +1,41 @@
1
+ # v0.0.6 (Fri Apr 01 2022)
2
+
3
+ #### ⚠️ Pushed to `main`
4
+
5
+ - match breaking change in vitest v0.8.0 (krzysztof.radomski@netigate.se)
6
+
7
+ #### Authors: 1
8
+
9
+ - Krzysztof Radomski (krzysztof.radomski@netigate.se)
10
+
11
+ ---
12
+
13
+ # v0.0.5 (Sun Mar 27 2022)
14
+
15
+ #### ⚠️ Pushed to `main`
16
+
17
+ - Merge branch 'main' of https://github.com/krzysztofradomski/storybook-addon-vitest (krzysztof.radomski@netigate.se)
18
+ - update readme file (krzysztof.radomski@netigate.se)
19
+ - improve config error messages (krzysztof.radomski@netigate.se)
20
+
21
+ #### Authors: 1
22
+
23
+ - Krzysztof Radomski (krzysztof.radomski@netigate.se)
24
+
25
+ ---
26
+
27
+ # v0.0.4 (Sun Mar 27 2022)
28
+
29
+ #### ⚠️ Pushed to `main`
30
+
31
+ - fix keywords order (krzysztof.radomski@netigate.se)
32
+
33
+ #### Authors: 1
34
+
35
+ - Krzysztof Radomski (krzysztof.radomski@netigate.se)
36
+
37
+ ---
38
+
1
39
  # v0.0.3 (Sun Mar 27 2022)
2
40
 
3
41
  #### ⚠️ Pushed to `main`
package/README.md CHANGED
@@ -1,23 +1,31 @@
1
+ ## storybook_vitest_addon
2
+
3
+ ### \_
4
+
1
5
  Addon meant to display Vitest unit test results in a new Stoybook panel. Developed and tested with React.
6
+ Simply add it to the addon list in your Storybook config, and then you can use it in any story.
7
+
8
+ The addon offers minimal visuals for maximum clarity.
9
+ It needs 2 params: `testResults` - test results file in json format and `testFile` - name of the component test file (TypeScript definitions available).
2
10
 
3
11
  Example usage:
4
12
 
5
13
  ```
6
- // Component.stories.tsx
14
+ // Button.stories.tsx
7
15
 
8
16
  import vitestResults from "./unit-test-results.json";
9
17
  /.../
10
18
  export default {
11
- title: "Example/Component",
12
- component: Header,
19
+ title: "Example/Button",
20
+ component: Button,
13
21
  parameters: {
14
22
  vitest: {
15
- testFile: "Header.test.tsx",
16
- results: vitestResults,
23
+ testFile: "Button.test.tsx",
24
+ testResults: vitestResults,
17
25
  },
18
26
  },
19
27
  };
20
28
  /.../
21
29
  ```
22
30
 
23
- ![](2022-03-27-18-36-17.png)
31
+ ![](2022-04-01-22-48-00.png)
package/dist/cjs/Panel.js CHANGED
@@ -13,28 +13,63 @@ var _constants = require("./constants");
13
13
 
14
14
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
15
15
 
16
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
17
+
18
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
19
+
20
+ 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); }
21
+
22
+ 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; }
23
+
24
+ function _iterableToArrayLimit(arr, i) { var _i = arr && (typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]); if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
25
+
26
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
27
+
16
28
  var VitestPanel = function VitestPanel() {
17
- var _json$testResults;
29
+ var _json$testResults$fin, _Object$values, _Object$entries;
18
30
 
19
31
  var params = (0, _api.useParameter)(_constants.PARAM_KEY, null);
20
32
  var fileName = (params === null || params === void 0 ? void 0 : params.testFile) || null;
21
- var json = (params === null || params === void 0 ? void 0 : params.results) || null;
22
- var data = json === null || json === void 0 ? void 0 : (_json$testResults = json.testResults) === null || _json$testResults === void 0 ? void 0 : _json$testResults.filter(function (t) {
23
- return t.testFilePath.includes(fileName);
24
- }).map(function (t) {
25
- return {
26
- status: t.status,
27
- displayName: t.displayName
28
- };
33
+ var json = (params === null || params === void 0 ? void 0 : params.testResults) || null;
34
+ var data = (json === null || json === void 0 ? void 0 : (_json$testResults$fin = json.testResults.find(function (r) {
35
+ var _r$name;
36
+
37
+ return r === null || r === void 0 ? void 0 : (_r$name = r.name) === null || _r$name === void 0 ? void 0 : _r$name.includes(fileName);
38
+ })) === null || _json$testResults$fin === void 0 ? void 0 : _json$testResults$fin.assertionResults.reduce(function (acc, curr) {
39
+ var _curr$ancestorTitles = _slicedToArray(curr.ancestorTitles, 2),
40
+ key = _curr$ancestorTitles[1];
41
+
42
+ acc[key] = acc[key] || [];
43
+ var group = acc[key];
44
+ group.push({
45
+ title: curr.title,
46
+ status: curr.status
47
+ });
48
+ return acc;
49
+ }, {})) || [];
50
+ console.log({
51
+ data: data
29
52
  });
30
- return /*#__PURE__*/_react["default"].createElement("ul", null, !data && /*#__PURE__*/_react["default"].createElement("li", null, "No test results file available"), (data === null || data === void 0 ? void 0 : data.length) == 0 && /*#__PURE__*/_react["default"].createElement("li", null, "No tests found"), data === null || data === void 0 ? void 0 : data.map(function (d) {
31
- return /*#__PURE__*/_react["default"].createElement("li", {
32
- key: d.displayName
33
- }, /*#__PURE__*/_react["default"].createElement("p", null, d.displayName, /*#__PURE__*/_react["default"].createElement("span", {
34
- style: {
35
- color: d.status === "pass" ? "green" : "red"
36
- }
37
- }, d.status)));
53
+ return /*#__PURE__*/_react["default"].createElement("div", {
54
+ style: {
55
+ padding: "1rem"
56
+ }
57
+ }, !fileName && !data ? /*#__PURE__*/_react["default"].createElement("p", null, "Please check your config: missing both `testFile` and `testResults`.", " ") : null, !fileName && data ? /*#__PURE__*/_react["default"].createElement("p", null, "Please check your config: missing `testFile` name.") : null, fileName && !data ? /*#__PURE__*/_react["default"].createElement("p", null, "Please check your config: missing `testResults` file.") : null, fileName && ((_Object$values = Object.values(data)) === null || _Object$values === void 0 ? void 0 : _Object$values.length) == 0 && /*#__PURE__*/_react["default"].createElement("p", null, "No tests found"), (_Object$entries = Object.entries(data)) === null || _Object$entries === void 0 ? void 0 : _Object$entries.map(function (_ref) {
58
+ var _ref2 = _slicedToArray(_ref, 2),
59
+ title = _ref2[0],
60
+ group = _ref2[1];
61
+
62
+ return /*#__PURE__*/_react["default"].createElement("div", {
63
+ key: title
64
+ }, /*#__PURE__*/_react["default"].createElement("strong", null, title), /*#__PURE__*/_react["default"].createElement("ul", null, group.map(function (d) {
65
+ return /*#__PURE__*/_react["default"].createElement("li", {
66
+ key: d.title
67
+ }, /*#__PURE__*/_react["default"].createElement("p", null, d.title, /*#__PURE__*/_react["default"].createElement("span", {
68
+ style: {
69
+ color: d.status === "passed" ? "green" : "red"
70
+ }
71
+ }, d.status)));
72
+ })));
38
73
  }));
39
74
  };
40
75
 
package/dist/esm/Panel.js CHANGED
@@ -1,29 +1,64 @@
1
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
2
+
3
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure 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 _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; }
8
+
9
+ function _iterableToArrayLimit(arr, i) { var _i = arr && (typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]); if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
10
+
11
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
12
+
1
13
  import React from "react";
2
14
  import { useParameter } from "@storybook/api";
3
15
  import { PARAM_KEY } from "./constants";
4
16
 
5
17
  var VitestPanel = function VitestPanel() {
6
- var _json$testResults;
18
+ var _json$testResults$fin, _Object$values, _Object$entries;
7
19
 
8
20
  var params = useParameter(PARAM_KEY, null);
9
21
  var fileName = (params === null || params === void 0 ? void 0 : params.testFile) || null;
10
- var json = (params === null || params === void 0 ? void 0 : params.results) || null;
11
- var data = json === null || json === void 0 ? void 0 : (_json$testResults = json.testResults) === null || _json$testResults === void 0 ? void 0 : _json$testResults.filter(function (t) {
12
- return t.testFilePath.includes(fileName);
13
- }).map(function (t) {
14
- return {
15
- status: t.status,
16
- displayName: t.displayName
17
- };
22
+ var json = (params === null || params === void 0 ? void 0 : params.testResults) || null;
23
+ var data = (json === null || json === void 0 ? void 0 : (_json$testResults$fin = json.testResults.find(function (r) {
24
+ var _r$name;
25
+
26
+ return r === null || r === void 0 ? void 0 : (_r$name = r.name) === null || _r$name === void 0 ? void 0 : _r$name.includes(fileName);
27
+ })) === null || _json$testResults$fin === void 0 ? void 0 : _json$testResults$fin.assertionResults.reduce(function (acc, curr) {
28
+ var _curr$ancestorTitles = _slicedToArray(curr.ancestorTitles, 2),
29
+ key = _curr$ancestorTitles[1];
30
+
31
+ acc[key] = acc[key] || [];
32
+ var group = acc[key];
33
+ group.push({
34
+ title: curr.title,
35
+ status: curr.status
36
+ });
37
+ return acc;
38
+ }, {})) || [];
39
+ console.log({
40
+ data: data
18
41
  });
19
- return /*#__PURE__*/React.createElement("ul", null, !data && /*#__PURE__*/React.createElement("li", null, "No test results file available"), (data === null || data === void 0 ? void 0 : data.length) == 0 && /*#__PURE__*/React.createElement("li", null, "No tests found"), data === null || data === void 0 ? void 0 : data.map(function (d) {
20
- return /*#__PURE__*/React.createElement("li", {
21
- key: d.displayName
22
- }, /*#__PURE__*/React.createElement("p", null, d.displayName, /*#__PURE__*/React.createElement("span", {
23
- style: {
24
- color: d.status === "pass" ? "green" : "red"
25
- }
26
- }, d.status)));
42
+ return /*#__PURE__*/React.createElement("div", {
43
+ style: {
44
+ padding: "1rem"
45
+ }
46
+ }, !fileName && !data ? /*#__PURE__*/React.createElement("p", null, "Please check your config: missing both `testFile` and `testResults`.", " ") : null, !fileName && data ? /*#__PURE__*/React.createElement("p", null, "Please check your config: missing `testFile` name.") : null, fileName && !data ? /*#__PURE__*/React.createElement("p", null, "Please check your config: missing `testResults` file.") : null, fileName && ((_Object$values = Object.values(data)) === null || _Object$values === void 0 ? void 0 : _Object$values.length) == 0 && /*#__PURE__*/React.createElement("p", null, "No tests found"), (_Object$entries = Object.entries(data)) === null || _Object$entries === void 0 ? void 0 : _Object$entries.map(function (_ref) {
47
+ var _ref2 = _slicedToArray(_ref, 2),
48
+ title = _ref2[0],
49
+ group = _ref2[1];
50
+
51
+ return /*#__PURE__*/React.createElement("div", {
52
+ key: title
53
+ }, /*#__PURE__*/React.createElement("strong", null, title), /*#__PURE__*/React.createElement("ul", null, group.map(function (d) {
54
+ return /*#__PURE__*/React.createElement("li", {
55
+ key: d.title
56
+ }, /*#__PURE__*/React.createElement("p", null, d.title, /*#__PURE__*/React.createElement("span", {
57
+ style: {
58
+ color: d.status === "passed" ? "green" : "red"
59
+ }
60
+ }, d.status)));
61
+ })));
27
62
  }));
28
63
  };
29
64
 
package/package.json CHANGED
@@ -1,8 +1,9 @@
1
1
  {
2
2
  "name": "storybook_vitest_addon",
3
- "version": "0.0.3",
3
+ "version": "0.0.6",
4
4
  "description": "Adds a panel to display Vitest unit test results",
5
5
  "keywords": [
6
+ "storybook-addons",
6
7
  "addon",
7
8
  "storybook",
8
9
  "vitest",
@@ -10,8 +11,7 @@
10
11
  "report",
11
12
  "test",
12
13
  "results",
13
- "unit-testing",
14
- "storybook-addons"
14
+ "unit-testing"
15
15
  ],
16
16
  "repository": {
17
17
  "type": "git",