1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
metamask-extension/development/highlights/storybook.js
Nidhi Kumari c5368c152b
Added storybook check to CI (#17092)
* added storybook test runner

* added test runner in ci

* updated test for ci and fixed lint error

* updated lavamoat policy

* updated test command

* updated playwright

* changed command to storybook;ci

* updated command

* updated instance for test-storybook

* updated playwright

* added playwright step

* replaced concurrently with start-server-and-test

* updated the static storybook directory

* replaced first with last

* updated lock file

* replaced first with last

* updated test-storybook with maxworkers

* updated .depchechrc

* updated yml

* removed id from banner base

* replaced broken stories with .stories-to-do.js extesnsion

* updated token allowance story

* removed duplicacies from yarn

* fixed lavamoat

* removed filename comment

* updated links for docs

* fixed file extension for stories

* updated path for stories.json

* updated stories.json path

* yarn updated

* updated stories

* updated yarn

* updated wait on
2023-01-21 00:57:46 +05:30

92 lines
2.5 KiB
JavaScript

const path = require('path');
const { promisify } = require('util');
const exec = promisify(require('child_process').exec);
const fs = require('fs');
const dependencyTree = require('dependency-tree');
const stories = fs.readFileSync(
path.join(__dirname, '..', '..', 'storybook-build', 'stories.json'),
'utf8',
);
const cwd = process.cwd();
const resolutionCache = {};
// 1. load stories
// 2. load list per story
// 3. filter against files
module.exports = {
getHighlights,
getHighlightAnnouncement,
};
async function getHighlightAnnouncement({ changedFiles, artifactBase }) {
const highlights = await getHighlights({ changedFiles });
if (!highlights.length) {
return null;
}
const highlightsBody = highlights
.map((entry) => `\n- [${entry}](${urlForStoryFile(entry, artifactBase)})`)
.join('');
const announcement = `<details>
<summary>storybook</summary>
${highlightsBody}
</details>\n\n`;
return announcement;
}
async function getHighlights({ changedFiles }) {
const highlights = [];
const storyFiles = await getAllStories();
// check each story file for dep graph overlap with changed files
for (const storyFile of storyFiles) {
const list = await getLocalDependencyList(storyFile);
if (list.some((entry) => changedFiles.includes(entry))) {
highlights.push(storyFile);
}
}
return highlights;
}
async function getAllStories() {
const { stdout } = await exec('find ui -name "*.stories.js"');
const matches = stdout.split('\n').slice(0, -1);
return matches;
}
async function getLocalDependencyList(filename) {
const list = dependencyTree
.toList({
filename,
// not sure what this does but its mandatory
directory: cwd,
webpackConfig: `.storybook/main.js`,
// skip all dependencies
filter: (entry) => !entry.includes('node_modules'),
// for memoization across trees: 30s -> 5s
visited: resolutionCache,
})
.map((entry) => path.relative(cwd, entry));
return list;
}
function urlForStoryFile(filename, artifactBase) {
const storyId = getStoryId(filename);
return `${artifactBase}/storybook/index.html?path=/story/${storyId}`;
}
/**
* @param {fileName} string - The fileName to get the story id.
* @returns The id of the story.
*/
function getStoryId(fileName) {
const storiesArray = Object.values(stories.stories);
const foundStory = storiesArray.find((story) => {
return story.importPath.includes(fileName);
});
if (!foundStory) {
throw new Error(`story for ${fileName} not found`);
}
return foundStory.id;
}