diff --git a/.github/workflows/build.yaml b/.github/workflows/build.yaml index d88fd9d2..ca8aaae0 100644 --- a/.github/workflows/build.yaml +++ b/.github/workflows/build.yaml @@ -1,10 +1,10 @@ -name: Build +name: Build and Test on: workflow_call: jobs: - build: + build-and-test: runs-on: ubuntu-latest permissions: contents: read @@ -16,9 +16,24 @@ jobs: uses: actions/setup-node@cdca7365b2dadb8aad0a33bc7601856ffabcc48e # v4.3.0 with: node-version: 22 + cache: 'npm' # Added caching for faster installs - name: Install dependencies run: npm ci - name: Build run: npm run build + + - name: Run Cypress Tests + run: npm run test + + - name: Upload Cypress Screenshots + if: always() # Run this step even if tests fail + uses: actions/upload-artifact@v4 + with: + name: cypress-screenshots + path: | + cypress/screenshots/ + retention-days: 7 # Keep artifacts for 7 days + if-no-files-found: warn # Warn instead of fail if no screenshots found + diff --git a/cypress/support/component.tsx b/cypress/support/component.tsx index 3c4f63b8..78400390 100644 --- a/cypress/support/component.tsx +++ b/cypress/support/component.tsx @@ -20,7 +20,8 @@ import { ThemeProvider } from '@ui5/webcomponents-react'; import { mount } from 'cypress/react'; // Import commands.js using ES2015 syntax: import './commands'; -import { FrontendConfigProvider, Landscape } from "../../src/context/FrontendConfigContext"; +import { FrontendConfigContext } from '../../src/context/FrontendConfigContext'; +import { mockedFrontendConfig } from '../../src/utils/testing'; // Augment the Cypress namespace to include type definitions for // your custom command. @@ -36,12 +37,11 @@ declare global { } - Cypress.Commands.add('mount', (component, options) => { - return mount({component} , options); + return mount( + + {component} + + , options); }); diff --git a/src/context/FrontendConfigContext.tsx b/src/context/FrontendConfigContext.tsx index bdf1346b..d1d0ebab 100644 --- a/src/context/FrontendConfigContext.tsx +++ b/src/context/FrontendConfigContext.tsx @@ -6,6 +6,7 @@ export enum Landscape { Canary = 'CANARY', Staging = 'STAGING', Development = 'DEV', + Local = 'LOCAL', } interface FrontendConfigContextProps { @@ -15,19 +16,18 @@ interface FrontendConfigContextProps { links: DocLinkCreator; } -const FrontendConfigContext = createContext( +export const FrontendConfigContext = createContext( null, ); + const fetchPromise = fetch('/frontend-config.json').then((res) => res.json()); interface FrontendConfigProviderProps { children: ReactNode; } -export function FrontendConfigProvider({ - children, -}: FrontendConfigProviderProps) { +export function FrontendConfigProvider({ children }: FrontendConfigProviderProps) { const config = use(fetchPromise); const docLinks = new DocLinkCreator(config.documentationBaseUrl); const value: FrontendConfigContextProps = { diff --git a/src/utils/index.ts b/src/utils/index.ts index 434cba47..8dc63d58 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -10,3 +10,4 @@ export const extractWorkspaceNameFromNamespace = (namespace: string) => { export const projectnameToNamespace = (projectname: string) => { return `project-${projectname}`; }; + diff --git a/src/utils/testing.ts b/src/utils/testing.ts new file mode 100644 index 00000000..b191d422 --- /dev/null +++ b/src/utils/testing.ts @@ -0,0 +1,11 @@ +import { DocLinkCreator } from '../lib/shared/links.ts'; +import { Landscape } from '../context/FrontendConfigContext.tsx'; + +export const isInTestingMode: Boolean = !!window.Cypress; +const documentationBaseUrl = 'http://localhost:3000'; +export const mockedFrontendConfig = { + backendUrl: 'http://localhost:3000', + landscape: Landscape.Local, + documentationBaseUrl: 'http://localhost:3000', + links: new DocLinkCreator(documentationBaseUrl), +}; \ No newline at end of file