diff --git a/.github/workflows/run_tests.yml b/.github/workflows/run_tests.yml index 0533cc78e..c89c78286 100644 --- a/.github/workflows/run_tests.yml +++ b/.github/workflows/run_tests.yml @@ -48,8 +48,11 @@ jobs: run: | export CI_PATHS_CHANGED=$(git diff --name-only -r HEAD^1 HEAD) npm run test:component + - name: Run e2e tests 👀 - run: npm run test:e2e + run: | + export CI_PATHS_CHANGED=$(git diff --name-only -r HEAD^1 HEAD) &&npm run test:e2e + - name: Upload failed test screenshots 📷 uses: actions/upload-artifact@v4 if: failure() diff --git a/cypress.config.ts b/cypress.config.ts index 6a5f4f9f6..2bec5c102 100644 --- a/cypress.config.ts +++ b/cypress.config.ts @@ -21,6 +21,9 @@ if (pathsChanged) { } } export default defineConfig({ + env: { + CI_PATHS_CHANGED: pathsChanged, + }, e2e: { // specPattern: "**/*.cy.{js,jsx,ts,tsx}", supportFile: false, @@ -35,4 +38,7 @@ export default defineConfig({ specPattern: specPatternComponentTests, indexHtmlFile: "cypress/support/component-index.html", }, + retries: { + runMode: 2, + }, }); diff --git a/cypress/e2e/storybook.cy.js b/cypress/e2e/storybook.cy.js new file mode 100644 index 000000000..6093222ae --- /dev/null +++ b/cypress/e2e/storybook.cy.js @@ -0,0 +1,37 @@ +import "cypress-network-idle"; +import stories from "../../docs/index.json"; + +describe("Stories test", () => { + const pathsChanged = Cypress.env("CI_PATHS_CHANGED"); + let uniqueElementFolders = []; + let cypressChanged = false; + // only run stories from files that have been changed + if (pathsChanged) { + const changed = pathsChanged.split("\n"); + // if cypress folder changed => run all tests + if (!changed.some((item) => item.startsWith("cypress"))) { + const filteredElementsFolders = changed + .filter((filePath) => filePath.startsWith("elements/")) + .map((filePath) => filePath.split("/")[1]); + uniqueElementFolders = [...new Set(filteredElementsFolders)]; + console.log(uniqueElementFolders); + } else { + cypressChanged = true; + } + } + const filteredStories = cypressChanged + ? Object.values(stories.entries) + : Object.values(stories.entries).filter((obj) => { + return uniqueElementFolders.some((folder) => + obj.importPath.includes(folder) + ); + }); + filteredStories.forEach((story) => { + if (story.type && story.type == "story") { + it(`${story.id}`, () => { + cy.visit(`../../docs/iframe.html?id=${story.id}`); + cy.waitForNetworkIdle(1000); + }); + } + }); +}); diff --git a/elements/stacinfo/stacinfo.stories.js b/elements/stacinfo/stacinfo.stories.js index 7d0183d91..3af19678a 100644 --- a/elements/stacinfo/stacinfo.stories.js +++ b/elements/stacinfo/stacinfo.stories.js @@ -123,20 +123,17 @@ export const CustomSlotContent = { style="width: 400px" >
-

- Replacing the "region" property slot to render it in a custom manner: -

-

--> Region: !

+

--> Agency: !