Revert "test(ObjectPage): fix test in CI"

This reverts commit de799d0.

Author: Lukas742

.github/workflows/test.yml

@@ -15,7 +15,13 @@ jobs:
     strategy:
       matrix:
         spec:
-          - main/src/components/ObjectPage
+          - base
+          - charts
+          - cypress-commands
+          - main/src/components
+          - main/src/webComponents
+          - main/src/internal
+          - compat
         react: ['18', '19']
       fail-fast: false
     steps:

package.json

@@ -15,7 +15,7 @@
     "build:storybook-sitemap": "node ./scripts/create-storybook-sitemap.js --directory .out",
     "test:prepare": "rimraf temp && lerna run build",
     "test:open": "CYPRESS_COVERAGE=false cypress open --component --browser chrome",
-    "test": "yarn test:prepare && cypress run --component --browser chrome --spec packages/main/src/components/ObjectPage",
+    "test": "yarn test:prepare && cypress run --component --browser chrome --spec packages",
     "clean": "tsc --build --clean && tsc --build tsconfig.build.json --clean && rimraf temp .out && lerna run clean",
     "clean:remove-modules": "yarn clean && rimraf node_modules",
     "prettier:all": "prettier --write --config ./prettier.config.js \"**/*\"",

packages/main/src/components/ObjectPage/ObjectPage.cy.tsx

@@ -365,154 +365,152 @@ describe('ObjectPage', () => {
     });
   });
 
-  for (let i = 0; i < 10; i++) {
-    it.only('scroll to sections - default mode', () => {
-      document.body.style.margin = '0px';
-      cy.mount(
-        <ObjectPage data-testid="op" titleArea={DPTitle} headerArea={DPContent} style={{ height: '100vh' }}>
-          {OPContent}
-        </ObjectPage>,
-      );
-      cy.wait(200);
+  it('scroll to sections - default mode', () => {
+    document.body.style.margin = '0px';
+    cy.mount(
+      <ObjectPage data-testid="op" titleArea={DPTitle} headerArea={DPContent} style={{ height: '100vh' }}>
+        {OPContent}
+      </ObjectPage>,
+    );
+    cy.wait(200);
 
-      // first titleText should never be displayed (not.be.visible doesn't work here - only invisible for sighted users)
-      cy.findByText('Goals')
-        .parent()
-        .should('have.css', 'width', '1px')
-        .and('have.css', 'margin', '-1px')
-        .and('have.css', 'position', 'absolute');
-      cy.findByText('Employment').should('not.be.visible');
-      cy.findByText('Test').should('be.visible');
+    // first titleText should never be displayed (not.be.visible doesn't work here - only invisible for sighted users)
+    cy.findByText('Goals')
+      .parent()
+      .should('have.css', 'width', '1px')
+      .and('have.css', 'margin', '-1px')
+      .and('have.css', 'position', 'absolute');
+    cy.findByText('Employment').should('not.be.visible');
+    cy.findByText('Test').should('be.visible');
 
-      cy.get('[ui5-tabcontainer]').findUi5TabByText('Employment').realClick();
-      cy.get('[data-section-id="test"]').shouldNeverHaveAttribute('selected', 300);
-      cy.get('[data-section-id="personal"]').shouldNeverHaveAttribute('selected', 300);
-      cy.get(`[ui5-tab][data-index="3"]`).should('have.attr', 'selected');
-      cy.findByText('Employment').should('be.visible');
+    cy.get('[ui5-tabcontainer]').findUi5TabByText('Employment').realClick();
+    cy.get('[data-section-id="test"]').shouldNeverHaveAttribute('selected', 300);
+    cy.get('[data-section-id="personal"]').shouldNeverHaveAttribute('selected', 300);
+    cy.get(`[ui5-tab][data-index="3"]`).should('have.attr', 'selected');
+    cy.findByText('Employment').should('be.visible');
 
-      cy.wait(200);
+    cy.wait(200);
 
-      cy.get('[ui5-tabcontainer]').findUi5TabByText('Goals').realClick();
-      cy.findByText('Test').should('be.visible');
+    cy.get('[ui5-tabcontainer]').findUi5TabByText('Goals').realClick();
+    cy.findByText('Test').should('be.visible');
 
-      // no scroll when focusing something in the header area
-      cy.get('[ui5-tabcontainer]').findUi5TabByText('Employment').realClick();
-      cy.findByText('Job Information').should('be.visible');
-      cy.findByTestId('op').invoke('scrollTop').as('scrollTop');
-      cy.wait(100);
-      cy.realPress('ArrowLeft');
-      cy.get('@scrollTop').then((scrollTop) => {
-        cy.findByTestId('op').invoke('scrollTop').should('equal', scrollTop);
-      });
+    // no scroll when focusing something in the header area
+    cy.get('[ui5-tabcontainer]').findUi5TabByText('Employment').realClick();
+    cy.findByText('Job Information').should('be.visible');
+    cy.findByTestId('op').invoke('scrollTop').as('scrollTop');
+    cy.wait(100);
+    cy.realPress('ArrowLeft');
+    cy.get('@scrollTop').then((scrollTop) => {
+      cy.findByTestId('op').invoke('scrollTop').should('equal', scrollTop);
+    });
 
-      cy.get('[ui5-tabcontainer]').findUi5TabByText('Employment').focus();
-      cy.realPress('ArrowDown');
-      cy.realPress('ArrowDown');
-      cy.realPress('ArrowDown');
-      cy.realPress('Enter');
-      cy.get('[data-section-id="goals"]').shouldNeverHaveAttribute('selected');
-      cy.get('[data-section-id="personal"]').shouldNeverHaveAttribute('selected');
-      cy.findByText('Job Relationship').should('be.visible');
+    cy.get('[ui5-tabcontainer]').findUi5TabByText('Employment').focus();
+    cy.realPress('ArrowDown');
+    cy.realPress('ArrowDown');
+    cy.realPress('ArrowDown');
+    cy.realPress('Enter');
+    cy.get('[data-section-id="goals"]').shouldNeverHaveAttribute('selected');
+    cy.get('[data-section-id="personal"]').shouldNeverHaveAttribute('selected');
+    cy.findByText('Job Relationship').should('be.visible');
 
-      cy.mount(
-        <ObjectPage
-          data-testid
-          titleArea={DPTitle}
-          headerArea={DPContent}
-          footerArea={Footer}
-          style={{ height: '100vh' }}
-        >
-          {OPContent}
-        </ObjectPage>,
-      );
-      cy.wait(100);
+    cy.mount(
+      <ObjectPage
+        data-testid
+        titleArea={DPTitle}
+        headerArea={DPContent}
+        footerArea={Footer}
+        style={{ height: '100vh' }}
+      >
+        {OPContent}
+      </ObjectPage>,
+    );
+    cy.wait(100);
 
-      cy.findByText('Employment').should('not.be.visible');
-      cy.findByText('Test').should('be.visible');
-      cy.findByTestId('footer').should('be.visible');
+    cy.findByText('Employment').should('not.be.visible');
+    cy.findByText('Test').should('be.visible');
+    cy.findByTestId('footer').should('be.visible');
 
-      // Select Employment tab
-      cy.get('[ui5-tabcontainer]').findUi5TabByText('Goals').focus();
-      cy.get('[ui5-tabcontainer]').realPress('ArrowRight');
-      cy.get('[ui5-tabcontainer]').realPress('ArrowRight');
-      cy.get('[ui5-tabcontainer]').realPress('ArrowRight');
-      cy.get('[ui5-tabcontainer]').realPress('Enter');
+    // Select Employment tab
+    cy.get('[ui5-tabcontainer]').findUi5TabByText('Goals').focus();
+    cy.get('[ui5-tabcontainer]').realPress('ArrowRight');
+    cy.get('[ui5-tabcontainer]').realPress('ArrowRight');
+    cy.get('[ui5-tabcontainer]').realPress('ArrowRight');
+    cy.get('[ui5-tabcontainer]').realPress('Enter');
 
-      cy.wait(200);
-      //fallback click
-      cy.get('[ui5-tabcontainer]').findUi5TabByText('Employment').realClick();
-      cy.get('[data-section-id="test"]').shouldNeverHaveAttribute('selected', 500);
-      cy.get('[data-section-id="personal"]').shouldNeverHaveAttribute('selected', 500);
-      cy.findByTestId('footer').should('be.visible');
-      cy.findByText('Employment').should('be.visible');
-      cy.findByText('Job Information').should('be.visible');
+    cy.wait(200);
+    //fallback click
+    cy.get('[ui5-tabcontainer]').findUi5TabByText('Employment').realClick();
+    cy.get('[data-section-id="test"]').shouldNeverHaveAttribute('selected', 500);
+    cy.get('[data-section-id="personal"]').shouldNeverHaveAttribute('selected', 500);
+    cy.findByTestId('footer').should('be.visible');
+    cy.findByText('Employment').should('be.visible');
+    cy.findByText('Job Information').should('be.visible');
 
-      cy.wait(200);
+    cy.wait(200);
 
-      cy.get('[ui5-tabcontainer]').findUi5TabByText('Goals').click();
-      cy.get('[data-section-id="test"]').shouldNeverHaveAttribute('selected', 300);
-      cy.get('[data-section-id="personal"]').shouldNeverHaveAttribute('selected', 300);
-      cy.findByText('Test').should('be.visible');
-      cy.findByTestId('footer').should('be.visible');
+    cy.get('[ui5-tabcontainer]').findUi5TabByText('Goals').click();
+    cy.get('[data-section-id="test"]').shouldNeverHaveAttribute('selected', 300);
+    cy.get('[data-section-id="personal"]').shouldNeverHaveAttribute('selected', 300);
+    cy.findByText('Test').should('be.visible');
+    cy.findByTestId('footer').should('be.visible');
 
-      cy.wait(300);
+    cy.wait(300);
 
-      cy.get('[ui5-tabcontainer]').findUi5TabByText('Employment').focus();
-      cy.realPress('ArrowDown');
-      cy.wait(500);
-      cy.realPress('ArrowDown');
-      cy.realPress('ArrowDown');
-      cy.realPress('Enter');
-      cy.get('[data-section-id="personal"]').shouldNeverHaveAttribute('selected');
-      cy.get(`[ui5-tab][data-index="3"]`).should('have.attr', 'selected');
-      // wait for scroll
-      cy.wait(200);
-      cy.findByText('Job Relationship').should('be.visible');
+    cy.get('[ui5-tabcontainer]').findUi5TabByText('Employment').focus();
+    cy.realPress('ArrowDown');
+    cy.wait(500);
+    cy.realPress('ArrowDown');
+    cy.realPress('ArrowDown');
+    cy.realPress('Enter');
+    cy.get('[data-section-id="personal"]').shouldNeverHaveAttribute('selected');
+    cy.get(`[ui5-tab][data-index="3"]`).should('have.attr', 'selected');
+    // wait for scroll
+    cy.wait(200);
+    cy.findByText('Job Relationship').should('be.visible');
 
-      cy.findByTestId('footer').should('be.visible');
+    cy.findByTestId('footer').should('be.visible');
 
-      cy.mount(
-        <ObjectPage
-          data-testid
-          titleArea={DPTitle}
-          headerArea={DPContent}
-          footerArea={Footer}
-          style={{ height: '100vh' }}
-        >
-          {OPContent}
-          <ObjectPageSection aria-label="Long Section" id="long-section" titleText="Long Section">
-            <ObjectPageSubSection aria-label="Long Subsection 1" id="sub1" titleText="Long Subsection 1">
-              <FlexBox style={{ height: '2000px' }} direction="Column" justifyContent="SpaceBetween">
-                <span>Start SubSection1</span>
-                <span>End SubSection1</span>
-              </FlexBox>
-            </ObjectPageSubSection>
-            <ObjectPageSubSection aria-label="Long Subsection 2" id="sub2" titleText="Long Subsection 2">
-              <FlexBox style={{ height: '1000px' }} direction="Column" justifyContent="SpaceBetween">
-                <span>Start SubSection2</span>
-                <span>End SubSection2</span>
-              </FlexBox>
-            </ObjectPageSubSection>
-          </ObjectPageSection>
-        </ObjectPage>,
-      );
-      cy.wait(100);
+    cy.mount(
+      <ObjectPage
+        data-testid
+        titleArea={DPTitle}
+        headerArea={DPContent}
+        footerArea={Footer}
+        style={{ height: '100vh' }}
+      >
+        {OPContent}
+        <ObjectPageSection aria-label="Long Section" id="long-section" titleText="Long Section">
+          <ObjectPageSubSection aria-label="Long Subsection 1" id="sub1" titleText="Long Subsection 1">
+            <FlexBox style={{ height: '2000px' }} direction="Column" justifyContent="SpaceBetween">
+              <span>Start SubSection1</span>
+              <span>End SubSection1</span>
+            </FlexBox>
+          </ObjectPageSubSection>
+          <ObjectPageSubSection aria-label="Long Subsection 2" id="sub2" titleText="Long Subsection 2">
+            <FlexBox style={{ height: '1000px' }} direction="Column" justifyContent="SpaceBetween">
+              <span>Start SubSection2</span>
+              <span>End SubSection2</span>
+            </FlexBox>
+          </ObjectPageSubSection>
+        </ObjectPageSection>
+      </ObjectPage>,
+    );
+    cy.wait(100);
 
-      cy.get('[ui5-tabcontainer]').findUi5TabByText('Long Section').focus();
-      cy.realPress('ArrowDown');
-      cy.get('[ui5-responsive-popover]').should('be.visible');
-      cy.realPress('ArrowDown');
-      cy.wait(50);
-      cy.realPress('ArrowDown');
-      cy.realPress('Enter');
-      cy.get('[data-section-id="test"]').shouldNeverHaveAttribute('selected');
-      cy.get('[data-section-id="personal"]').shouldNeverHaveAttribute('selected');
-      cy.get(`[ui5-tab][data-index="3"]`).shouldNeverHaveAttribute('selected');
-      // wait for scroll
-      cy.wait(200);
-      cy.findByText('Start SubSection2').should('be.visible');
-    });
-  }
+    cy.get('[ui5-tabcontainer]').findUi5TabByText('Long Section').focus();
+    cy.realPress('ArrowDown');
+    cy.get('[ui5-responsive-popover]').should('be.visible');
+    cy.realPress('ArrowDown');
+    cy.wait(50);
+    cy.realPress('ArrowDown');
+    cy.realPress('Enter');
+    cy.get('[data-section-id="test"]').shouldNeverHaveAttribute('selected');
+    cy.get('[data-section-id="personal"]').shouldNeverHaveAttribute('selected');
+    cy.get(`[ui5-tab][data-index="3"]`).shouldNeverHaveAttribute('selected');
+    // wait for scroll
+    cy.wait(200);
+    cy.findByText('Start SubSection2').should('be.visible');
+  });
 
   it('scroll to sections - tab mode', () => {
     document.body.style.margin = '0px';