Cypress not displaying UI5 Page component

[DrMalchev]

Hello team,
I recently ran over a strange issue when component testing with cypress.
npx cypress run --component --browser firefox --headed --no-exit --spec "src/components/TestPage.cy.jsx"
This renders a UI5 Page component

<Page id="page" data-cy="view-page" > {dataLoading ? <FlexBox alignItems="Center" justifyContent="Center" fitContainer> <BusyIndicator active={dataLoading} /> </FlexBox> : <div className="sap-margin-top-medium"> <Bar design="Header" startContent={<Title>Inbox ({data?.length})</Title>}></Bar> <AnalyticalTableComponent /> </div>} </Page>}

Very strange that no content is shown in the test browser that cypress opens. Even if I put <Page> some string </Page> it shows nothing.
However if I put the content in <Page header="some string or component"> </Page it renders fine.
Have you experienced something like this? Any help is welcome. Thanks a lot, guys!

[Lukas742]

Hi @DrMalchev

Is the Page not rendered (not present in the DOM), or is it not displayed (present in the DOM but not visible)? If it’s not displayed, you might need to set a fixed height:

Note: The Page occupies the full available space of its parent. To achieve the intended design, ensure the parent element provides enough space for the Page to render. Specifically, the parent element must have a fixed height for the Page to be displayed.

If that’s not the issue, there might be another root cause, but I can’t determine it based solely on your example.

[DrMalchev]

It was the height, thanks!