mirror of
https://github.com/Choices-js/Choices.git
synced 2024-05-17 21:16:34 +02:00
Add scrolling e2e tests
This commit is contained in:
parent
462d8b764c
commit
620bfeae0d
|
@ -189,6 +189,58 @@ describe('Choices - select multiple', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe('scrolling choices', () => {
|
||||||
|
const choicesCount = 4;
|
||||||
|
|
||||||
|
it('highlights first choice on dropdown open', () => {
|
||||||
|
cy.get('[data-test-hook=basic]')
|
||||||
|
.find('.choices__list--dropdown .choices__list .is-highlighted')
|
||||||
|
.should($choice => {
|
||||||
|
expect($choice.text().trim()).to.equal('Dropdown item 1');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
it('scrolls to next choice on down arrow', () => {
|
||||||
|
for (let index = 0; index < choicesCount; index++) {
|
||||||
|
cy.get('[data-test-hook=basic]')
|
||||||
|
.find('.choices__list--dropdown .choices__list .is-highlighted')
|
||||||
|
.should($choice => {
|
||||||
|
expect($choice.text().trim()).to.equal(
|
||||||
|
`Dropdown item ${index + 1}`,
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
cy.get('[data-test-hook=basic]')
|
||||||
|
.find('.choices__input--cloned')
|
||||||
|
.type('{downarrow}');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
it('scrolls up to previous choice on up arrow', () => {
|
||||||
|
// scroll to last choice
|
||||||
|
for (let index = 0; index < choicesCount; index++) {
|
||||||
|
cy.get('[data-test-hook=basic]')
|
||||||
|
.find('.choices__input--cloned')
|
||||||
|
.type('{downarrow}');
|
||||||
|
}
|
||||||
|
|
||||||
|
// scroll up to first choice
|
||||||
|
for (let index = choicesCount; index > 0; index--) {
|
||||||
|
cy.get('[data-test-hook=basic]')
|
||||||
|
.find('.choices__list--dropdown .choices__list .is-highlighted')
|
||||||
|
.should($choice => {
|
||||||
|
expect($choice.text().trim()).to.equal(
|
||||||
|
`Dropdown item ${index}`,
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
cy.get('[data-test-hook=basic]')
|
||||||
|
.find('.choices__input--cloned')
|
||||||
|
.type('{uparrow}');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('remove button', () => {
|
describe('remove button', () => {
|
||||||
|
|
|
@ -129,6 +129,58 @@ describe('Choices - select one', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe('scrolling choices', () => {
|
||||||
|
const choicesCount = 4;
|
||||||
|
|
||||||
|
it('highlights first choice on dropdown open', () => {
|
||||||
|
cy.get('[data-test-hook=basic]')
|
||||||
|
.find('.choices__list--dropdown .choices__list .is-highlighted')
|
||||||
|
.should($choice => {
|
||||||
|
expect($choice.text().trim()).to.equal('Dropdown item 1');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
it('scrolls to next choice on down arrow', () => {
|
||||||
|
for (let index = 0; index < choicesCount; index++) {
|
||||||
|
cy.get('[data-test-hook=basic]')
|
||||||
|
.find('.choices__list--dropdown .choices__list .is-highlighted')
|
||||||
|
.should($choice => {
|
||||||
|
expect($choice.text().trim()).to.equal(
|
||||||
|
`Dropdown item ${index + 1}`,
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
cy.get('[data-test-hook=basic]')
|
||||||
|
.find('.choices__input--cloned')
|
||||||
|
.type('{downarrow}');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
it('scrolls up to previous choice on up arrow', () => {
|
||||||
|
// scroll to last choice
|
||||||
|
for (let index = 0; index < choicesCount; index++) {
|
||||||
|
cy.get('[data-test-hook=basic]')
|
||||||
|
.find('.choices__input--cloned')
|
||||||
|
.type('{downarrow}');
|
||||||
|
}
|
||||||
|
|
||||||
|
// scroll up to first choice
|
||||||
|
for (let index = choicesCount; index > 0; index--) {
|
||||||
|
cy.get('[data-test-hook=basic]')
|
||||||
|
.find('.choices__list--dropdown .choices__list .is-highlighted')
|
||||||
|
.should($choice => {
|
||||||
|
expect($choice.text().trim()).to.equal(
|
||||||
|
`Dropdown item ${index}`,
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
cy.get('[data-test-hook=basic]')
|
||||||
|
.find('.choices__input--cloned')
|
||||||
|
.type('{uparrow}');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('remove button', () => {
|
describe('remove button', () => {
|
||||||
|
|
Loading…
Reference in a new issue