patternfly-react/packages/react-integration/cypress/integration/tabshorizontaloverflow.spec.ts at main · patternfly/patternfly-react · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
describe('Tab Demo Test', () => {
  it('Navigate to demo section', () => {
    cy.visit('http://localhost:3000/tabs-horizontal-overflow-demo-nav-link');
  });

  // Re-enable once https://github.com/patternfly/patternfly/issues/7449 is resolved
  xit('Adjusts tabs showing on resize', () => {
    // shrink viewport and verify that tabs which would now overflow are moved to the overflow tab
    cy.viewport(700, 792);
    ['Tab item 1', 'Tab item 2', 'Tab item 3', 'Tab item 4', 'Tab item 5', 'More'].forEach((tab) =>
      cy.contains('.pf-v6-c-tabs__link', tab).should('exist')
    );
    ['Tab item 6', 'Tab item 7', 'Tab item 8', 'Tab item 9', 'Tab item 10', 'Tab item 11'].forEach((tab) =>
      cy.contains(tab).should('not.exist')
    );
    cy.contains('.pf-v6-c-tabs__link', 'More').click();
    ['Tab item 6', 'Tab item 7', 'Tab item 8', 'Tab item 9', 'Tab item 10', 'Tab item 11'].forEach((tab) =>
      cy.contains(tab).should('exist')
    );

    // expand the viewport and verify that all tabs are shown and the overflow tab is removed
    cy.viewport(1800, 792);
    [
      'Tab item 1',
      'Tab item 2',
      'Tab item 3',
      'Tab item 4',
      'Tab item 5',
      'Tab item 6',
      'Tab item 7',
      'Tab item 8',
      'Tab item 9',
      'Tab item 10',
      'Tab item 11'
    ].forEach((tab) => cy.contains('.pf-v6-c-tabs__link', tab).should('exist'));
    cy.contains('.pf-v6-c-tabs__link', 'More').should('not.exist');
  });

  // TODO: look into why this test will only pass when another test interacting with the "More" overflow fails first
  xit('Allows selection of tabs from overflow tab menu', () => {
    cy.contains('Tab 1 section').should('not.be.hidden');
    cy.contains('Tab 9 section').should('be.hidden');
    cy.contains('.pf-v6-c-tabs__link', 'More').click();
    cy.contains('Tab item 9').click();
    cy.contains('Tab 9 section').should('not.be.hidden');
    cy.contains('Tab 1 section').should('be.hidden');
  });
});