Feat/test automation

[ReneSchroederLJ]

Description

• setup cypress with docker for running automated End-to-End tests
• added tests for general functionality like navigation
• added tests for material related logic
• added login logic for testing with an IDP

Pre-review checks

Please ensure to do as many of the following checks as possible, before asking for committer review:

• DEPENDENCIES are up-to-date. Dash license tool. Committers can open IP issues for restricted libs.
• Copyright and license header are present on all affected files
• If helm chart has been changed, the chart version has been bumped to either next major, minor or patch level (compared to released chart).

[tom-rm-meyer-ISST]

Reviewed in total with following PRs:

• #833
• #859
• #867
• #873

[tom-rm-meyer-ISST]

I tried to resolve conflicts and struggled with timeouts for the past few hours. Now just one issue remains with the sidebar tests.

Resolving Conflicts

Changes in SummaryPanel:

export function ReportedSummaryPanel<TType extends SummaryType>({ summary, materialNumber, site, partnerBpnl, ...props }: SummaryPanelProps<TType>) {
    const { supplies, refreshSupply } = useReportedDaysOfSupply(materialNumber, summary.type === 'demand' ? DirectionType.Inbound : DirectionType.Outbound, site, partnerBpnl);
    useEffect(() => {
        refreshSupply()
    }, [refreshSupply, summary])
    return <SummaryPanelContent summary={summary} {...props} supplies={supplies ?? []} data-testid={`reported-summary-panel-${site ? site : partnerBpnl}`}/>
}

Changes in SideBar.tsx "

            {open ? <Stack gap="0.25rem" paddingInline=".5rem" paddingBlock="1rem" marginTop="auto" data-testid="sidebar-item-license">
                <Typography
                    variant="body2"
                    component="h3"
                    fontWeight="600"
                    sx={{ maxWidth: '12rem', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}
                >
                    {ownPartner?.name}
                </Typography>
                <Button variant="text" sx={{ padding: 0, justifyContent: 'start', width: 'fit-content'}} onClick={handleCopyBpnl}>
                    <Typography variant="body3">{ownPartner?.bpnl} <ContentCopyOutlined /></Typography>
                </Button>
            </Stack> : null}

Issue Sidebar Test

Running into dom has changed error - using a callback runs to more often succeeding, but is still not reliable

cypress-e2e  |   sidebar
cypress-e2e  |     1) shows 7 menu items and one is selected
cypress-e2e  | 
cypress-e2e  | 
cypress-e2e  |   0 passing (1m)
cypress-e2e  |   1 failing
cypress-e2e  | 
cypress-e2e  |   1) sidebar
cypress-e2e  |        shows 7 menu items and one is selected:
cypress-e2e  |      CypressError: Timed out retrying after 60050ms: `cy.click()` failed because the page updated while this command was executing. Cypress tried to locate elements based on this query:
cypress-e2e  | 
cypress-e2e  | > <a.MuiButtonBase-root.MuiListItemButton-root.MuiListItemButton-gutters.MuiListItemButton-root.MuiListItemButton-gutters.css-1oyxher>
cypress-e2e  | 
cypress-e2e  | We initially found matching element(s), but while waiting for them to become actionable, they disappeared from the page. Common situations why this happens:
cypress-e2e  |   - Your JS framework re-rendered asynchronously
cypress-e2e  |   - Your app code reacted to an event firing and removed the element
cypress-e2e  | 
cypress-e2e  | You can typically solve this by breaking up a chain. For example, rewrite:
cypress-e2e  | 
cypress-e2e  | > `cy.get('button').click().click()`
cypress-e2e  | 
cypress-e2e  | to
cypress-e2e  | 
cypress-e2e  | > `cy.get('button').as('btn').click()`
cypress-e2e  | > `cy.get('@btn').click()`
cypress-e2e  | 
cypress-e2e  | https://on.cypress.io/element-has-detached-from-dom

I pushed the merged state, @ReneSchroederLJ could you check what I'm missing?

[tom-rm-meyer-ISST]

Additionally now fixed the automation issue in #881