-
Notifications
You must be signed in to change notification settings - Fork 352
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
test(DualListSelector): new integration tests
- Loading branch information
1 parent
eb28eee
commit 3c810f6
Showing
3 changed files
with
306 additions
and
0 deletions.
There are no files selected for viewing
108 changes: 108 additions & 0 deletions
108
packages/react-integration/cypress/integration/duallistselectorbasic.spec.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,108 @@ | ||
| describe('Dual List Selector Basic Demo Test', () => { | ||
| it('Navigate to demo section', () => { | ||
| cy.visit('http://localhost:3000/dual-list-selector-basic-demo-nav-link'); | ||
| }); | ||
|
|
||
| it('Verify existence', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector').should('exist'); | ||
| }); | ||
|
|
||
| it('Verify default aria-labels, status, and titles', () => { | ||
| cy.get('.pf-m-available .pf-v6-c-dual-list-selector__title-text').contains('Available options'); | ||
| cy.get('.pf-m-available .pf-v6-c-dual-list-selector__status-text').contains('0 of 4 options selected'); | ||
|
|
||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(1).should('have.attr', 'aria-label', 'Add all'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button') | ||
| .eq(0) | ||
| .should('have.attr', 'aria-label', 'Add selected') | ||
| .and('have.attr', 'disabled'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button') | ||
| .eq(3) | ||
| .should('have.attr', 'aria-label', 'Remove selected') | ||
| .and('have.attr', 'disabled'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button') | ||
| .eq(2) | ||
| .should('have.attr', 'aria-label', 'Remove all') | ||
| .and('have.attr', 'disabled'); | ||
|
|
||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__title-text').contains('Chosen options'); | ||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__status-text').contains('0 of 0 options selected'); | ||
| }); | ||
|
|
||
| it('Verify default value content', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__list').first().should('have.value', ''); | ||
| cy.get('.pf-v6-c-dual-list-selector__list li').should('have.length', 4); | ||
| }); | ||
|
|
||
| it('Verify selecting options', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item .pf-m-selected').should('not.exist'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item').eq(0).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(0).and('not.have.attr', 'disabled'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item .pf-m-selected').should('exist'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item').eq(1).click(); | ||
| cy.get('.pf-m-available .pf-v6-c-dual-list-selector__status-text').contains('2 of 4 options selected'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item .pf-m-selected').should('have.length', 2); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item').eq(0).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item .pf-m-selected').should('have.length', 1); | ||
| cy.get('.pf-m-available .pf-v6-c-dual-list-selector__status-text').contains('1 of 4 options selected'); | ||
| }); | ||
|
|
||
| it('Verify selecting and choosing options', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item').eq(0).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 3); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(1).find('li').should('have.length', 1); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item').eq(1).click(); | ||
|
|
||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(1).should('not.have.attr', 'disabled'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(0).should('not.have.attr', 'disabled'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(3).should('have.attr', 'disabled'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(2).should('not.have.attr', 'disabled'); | ||
|
|
||
| cy.get('.pf-m-available .pf-v6-c-dual-list-selector__status-text').contains('1 of 3 options selected'); | ||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__status-text').contains('0 of 1 options selected'); | ||
|
|
||
| cy.get('.pf-v6-c-dual-list-selector__controls-item').eq(0).click(); | ||
| cy.get('.pf-v6-c-tooltip').should('exist'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 2); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(1).find('li').should('have.length', 2); | ||
|
|
||
| cy.get('.pf-m-available .pf-v6-c-dual-list-selector__status-text').contains('0 of 2 options selected'); | ||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__status-text').contains('0 of 2 options selected'); | ||
| }); | ||
|
|
||
| it('Verify removing all options', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item').eq(2).click(); | ||
| cy.get('.pf-v6-c-tooltip').should('exist'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 4); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(1).find('li').should('have.length', 0); | ||
| }); | ||
|
|
||
| it('Verify choosing all options', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item').eq(1).click(); | ||
| cy.get('.pf-v6-c-tooltip').should('exist'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 0); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(1).find('li').should('have.length', 4); | ||
|
|
||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(1).should('have.attr', 'disabled'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(0).should('have.attr', 'disabled'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(3).should('have.attr', 'disabled'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(2).should('not.have.attr', 'disabled'); | ||
|
|
||
| cy.get('.pf-m-available .pf-v6-c-dual-list-selector__status-text').contains('0 of 0 options selected'); | ||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__status-text').contains('0 of 4 options selected'); | ||
| }); | ||
|
|
||
| it('Verify removing all options', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item').eq(2).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 4); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(1).find('li').should('have.length', 0); | ||
|
|
||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(1).should('not.have.attr', 'disabled'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(0).should('have.attr', 'disabled'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(3).should('have.attr', 'disabled'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(2).should('have.attr', 'disabled'); | ||
|
|
||
| cy.get('.pf-m-available .pf-v6-c-dual-list-selector__status-text').contains('0 of 4 options selected'); | ||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__status-text').contains('0 of 0 options selected'); | ||
| }); | ||
| }); |
64 changes: 64 additions & 0 deletions
64
packages/react-integration/cypress/integration/duallistselectortree.spec.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,64 @@ | ||
| describe('Dual List Selector Tree Demo Test', () => { | ||
| it('Navigate to demo section', () => { | ||
| cy.visit('http://localhost:3000/dual-list-selector-tree-demo-nav-link'); | ||
| }); | ||
|
|
||
| it('Verify existence', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector').should('exist'); | ||
| }); | ||
|
|
||
| it('Verify expanding options', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 3); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item .pf-v6-c-dual-list-selector__item-toggle').eq(0).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item').eq(0).should('have.class', 'pf-m-expanded'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 6); | ||
| }); | ||
|
|
||
| it('Verify available search works', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 6); | ||
| cy.get('.pf-v6-c-dual-list-selector__tools-filter input').eq(0).type('bre'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 1); | ||
| cy.get('.pf-v6-c-dual-list-selector__tools-filter input').eq(0).type('{backspace}{backspace}{backspace}'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 3); | ||
| }); | ||
|
|
||
| it('Verify checkbox selects an option', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(0).should('have.attr', 'disabled'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item .pf-v6-c-dual-list-selector__item-check').eq(1).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(0).should('not.have.attr', 'disabled'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(0).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 2); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(1).find('li').should('have.length', 2); | ||
| }); | ||
|
|
||
| xit('Verify add all filtered options works', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 2); | ||
| cy.get('.pf-v6-c-dual-list-selector__tools-filter input').eq(0).type('Fru'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 1); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item').eq(1).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(1).find('li').should('have.length', 3); | ||
| cy.get('.pf-v6-c-dual-list-selector__tools-filter input').eq(0).type('{backspace}{backspace}{backspace}'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 1); | ||
| }); | ||
|
|
||
| it('Verify chosen search works', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item').eq(1).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__menu').eq(1).find('li').should('have.length', 4); | ||
| cy.get('.pf-v6-c-dual-list-selector__tools-filter input').eq(1).type('Pro'); | ||
| cy.get('.pf-v6-c-dual-list-selector__item-toggle').eq(0).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__menu').eq(1).find('li').should('have.length', 1); | ||
| }); | ||
|
|
||
| xit('Verify remove all filtered options works', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 0); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(1).find('li').should('have.length', 1); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item').eq(2).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 1); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(1).find('li').should('have.length', 0); | ||
| cy.get('.pf-v6-c-dual-list-selector__tools-filter input').eq(1).type('{backspace}{backspace}{backspace}'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(1).find('li').should('have.length', 3); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item').eq(2).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 4); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(1).find('li').should('have.length', 0); | ||
| }); | ||
| }); |
134 changes: 134 additions & 0 deletions
134
packages/react-integration/cypress/integration/duallistselectorwithactions.spec.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,134 @@ | ||
| describe('Dual List Selector deprecated With Actions Demo Test', () => { | ||
| it('Navigate to demo section', () => { | ||
| cy.visit('http://localhost:3000/dual-list-selector-with-actions-demo-nav-link'); | ||
| }); | ||
|
|
||
| it('Verify existence', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector').should('exist'); | ||
| }); | ||
|
|
||
| it('Verify default value content', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__list').first().should('have.value', ''); | ||
| cy.get('.pf-v6-c-dual-list-selector__list li').should('have.length', 4); | ||
| }); | ||
|
|
||
| it('Verify custom aria-labels, status, and titles', () => { | ||
| cy.get('.pf-m-available .pf-v6-c-dual-list-selector__title-text').contains('Available options'); | ||
| cy.get('.pf-m-available .pf-v6-c-dual-list-selector__status-text').contains('0 of 4 options selected'); | ||
| cy.get('.pf-m-available .pf-v6-c-dual-list-selector__tools-filter input').should( | ||
| 'have.attr', | ||
| 'aria-label', | ||
| 'Search input' | ||
| ); | ||
| cy.get('.pf-m-available .pf-v6-c-dual-list-selector__list').should('have.attr', 'aria-labelledby'); | ||
|
|
||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button').eq(1).should('have.attr', 'aria-label', 'Add all'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button') | ||
| .eq(0) | ||
| .should('have.attr', 'aria-label', 'Add selected') | ||
| .and('have.attr', 'disabled'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button') | ||
| .eq(3) | ||
| .should('have.attr', 'aria-label', 'Remove selected') | ||
| .and('have.attr', 'disabled'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item button') | ||
| .eq(2) | ||
| .should('have.attr', 'aria-label', 'Remove all') | ||
| .and('have.attr', 'disabled'); | ||
|
|
||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__title-text').contains('Chosen options'); | ||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__status-text').contains('0 of 0 options selected'); | ||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__tools-filter input').should( | ||
| 'have.attr', | ||
| 'aria-label', | ||
| 'Search input' | ||
| ); | ||
| }); | ||
|
|
||
| it('Verify selecting options', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item .pf-m-selected').should('not.exist'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item').eq(0).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item .pf-m-selected').should('exist'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item').eq(1).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item .pf-m-selected').should('have.length', 2); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item').eq(0).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item .pf-m-selected').should('have.length', 1); | ||
| }); | ||
|
|
||
| it('Verify selecting and choosing options', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item').eq(0).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 3); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(1).find('li').should('have.length', 1); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item').eq(1).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item').eq(0).click(); | ||
|
|
||
| cy.get('.pf-m-available .pf-v6-c-dual-list-selector__status-text').contains('0 of 2 options selected'); | ||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__status-text').contains('0 of 2 options selected'); | ||
|
|
||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 2); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(1).find('li').should('have.length', 2); | ||
|
|
||
| cy.get('.pf-v6-c-dual-list-selector__list-item').eq(0).click(); | ||
| cy.get('.pf-m-available .pf-v6-c-dual-list-selector__status-text').contains('1 of 2 options selected'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list-item').eq(0).click(); | ||
| }); | ||
|
|
||
| it('Verify removing all options', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item').eq(2).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__menu').eq(0).find('li').should('have.length', 4); | ||
| cy.get('.pf-v6-c-dual-list-selector__menu').eq(1).find('li').should('have.length', 0); | ||
| cy.get('.pf-m-available .pf-v6-c-dual-list-selector__status-text').contains('0 of 4 options selected'); | ||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__status-text').contains('0 of 0 options selected'); | ||
| }); | ||
|
|
||
| it('Verify choosing all options', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item').eq(1).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__menu').eq(0).find('li').should('have.length', 0); | ||
| cy.get('.pf-v6-c-dual-list-selector__menu').eq(1).find('li').should('have.length', 4); | ||
| cy.get('.pf-m-available .pf-v6-c-dual-list-selector__status-text').contains('0 of 0 options selected'); | ||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__status-text').contains('0 of 4 options selected'); | ||
| }); | ||
|
|
||
| it('Verify sort works', () => { | ||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__list-item').last().contains('Option 4'); | ||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__tools-actions button').first().click(); | ||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__list-item').last().contains('Option 1'); | ||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__list-item').first().contains('Option 4'); | ||
|
|
||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__tools-actions button').first().click(); | ||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__list-item').last().contains('Option 4'); | ||
| cy.get('.pf-m-chosen .pf-v6-c-dual-list-selector__list-item').first().contains('Option 1'); | ||
| }); | ||
|
|
||
| it('Verify chosen search works', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(1).find('li').should('have.length', 4); | ||
| cy.get('.pf-v6-c-dual-list-selector__tools-filter input').eq(1).type('Option 1'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(1).find('li').should('have.length', 1); | ||
| }); | ||
|
|
||
| it('Verify removing all options', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__tools-filter input') | ||
| .eq(1) | ||
| .type('{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}'); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item').eq(2).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__menu').eq(0).find('li').should('have.length', 4); | ||
| cy.get('.pf-v6-c-dual-list-selector__menu').eq(1).find('li').should('have.length', 0); | ||
| }); | ||
|
|
||
| it('Verify available search works', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 4); | ||
| cy.get('.pf-v6-c-dual-list-selector__tools-filter input').eq(0).type('Option 3'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 1); | ||
| }); | ||
|
|
||
| it('Verify adding all filtered options', () => { | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 1); | ||
| cy.get('.pf-v6-c-dual-list-selector__controls-item').eq(1).click(); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 0); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(1).find('li').should('have.length', 1); | ||
| cy.get('.pf-v6-c-dual-list-selector__tools-filter input') | ||
| .eq(0) | ||
| .type('{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}{Backspace}'); | ||
| cy.get('.pf-v6-c-dual-list-selector__list').eq(0).find('li').should('have.length', 3); | ||
| }); | ||
| }); |