mirror of
https://github.com/Choices-js/Choices.git
synced 2024-06-17 05:05:08 +02:00
Finish up e2e tests for text elements
This commit is contained in:
parent
2f96c239ff
commit
57f16c23ee
|
@ -52,6 +52,32 @@ describe('Choices - text element', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe('editing choices', () => {
|
||||||
|
beforeEach(() => {
|
||||||
|
cy.get('[data-test-hook=basic]')
|
||||||
|
.find('.choices__input--cloned')
|
||||||
|
.type(textInput)
|
||||||
|
.type('{enter}');
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('pressing back space', () => {
|
||||||
|
it('allows me to change my entry', () => {
|
||||||
|
cy.get('[data-test-hook=basic]')
|
||||||
|
.find('.choices__input--cloned')
|
||||||
|
.type('{backspace}')
|
||||||
|
.type('-edited')
|
||||||
|
.type('{enter}');
|
||||||
|
|
||||||
|
cy.get('[data-test-hook=basic]')
|
||||||
|
.find('.choices__list--multiple .choices__item')
|
||||||
|
.last()
|
||||||
|
.should($choice => {
|
||||||
|
expect($choice.data('value')).to.equal(`${textInput}-edited`);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
describe('removing choices', () => {
|
describe('removing choices', () => {
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
cy.get('[data-test-hook=basic]')
|
cy.get('[data-test-hook=basic]')
|
||||||
|
@ -162,10 +188,10 @@ describe('Choices - text element', () => {
|
||||||
.type('{enter}');
|
.type('{enter}');
|
||||||
|
|
||||||
cy.get('[data-test-hook=regex-filter]')
|
cy.get('[data-test-hook=regex-filter]')
|
||||||
.find('.choices__list .choices__item')
|
.find('.choices__list--multiple .choices__item')
|
||||||
.last()
|
.last()
|
||||||
.should($choice => {
|
.should($choice => {
|
||||||
expect($choice).to.contain(input);
|
expect($choice.text().trim()).to.equal(input);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
@ -200,6 +226,16 @@ describe('Choices - text element', () => {
|
||||||
expect($choice.data('value')).to.equal(`before-${textInput}-after`);
|
expect($choice.data('value')).to.equal(`before-${textInput}-after`);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('displays just the inputted value to the user', () => {
|
||||||
|
cy.get('[data-test-hook=prepend-append]')
|
||||||
|
.find('.choices__list--multiple .choices__item')
|
||||||
|
.last()
|
||||||
|
.should($choice => {
|
||||||
|
expect($choice.text()).to.not.contain(`before-${textInput}-after`);
|
||||||
|
expect($choice.text()).to.contain(textInput);
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('disabled', () => {
|
describe('disabled', () => {
|
||||||
|
@ -209,5 +245,29 @@ describe('Choices - text element', () => {
|
||||||
.should('be.disabled');
|
.should('be.disabled');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe('pre-populated choices', () => {
|
||||||
|
it('pre-populates choices', () => {
|
||||||
|
cy.get('[data-test-hook=prepopulated]')
|
||||||
|
.find('.choices__list--multiple .choices__item')
|
||||||
|
.should($choices => {
|
||||||
|
expect($choices.length).to.equal(2);
|
||||||
|
});
|
||||||
|
|
||||||
|
cy.get('[data-test-hook=prepopulated]')
|
||||||
|
.find('.choices__list--multiple .choices__item')
|
||||||
|
.first()
|
||||||
|
.should($choice => {
|
||||||
|
expect($choice.text().trim()).to.equal('Josh Johnson');
|
||||||
|
});
|
||||||
|
|
||||||
|
cy.get('[data-test-hook=prepopulated]')
|
||||||
|
.find('.choices__list--multiple .choices__item')
|
||||||
|
.last()
|
||||||
|
.should($choice => {
|
||||||
|
expect($choice.text().trim()).to.equal('Joe Bloggs');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -39,10 +39,6 @@
|
||||||
<body>
|
<body>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="section">
|
<div class="section">
|
||||||
<a href="https://github.com/jshjohnson/Choices" class="logo">
|
|
||||||
<img src="../assets/images/logo.svg" alt="Choices.js logo" class="logo__img hidden-ie">
|
|
||||||
<h1 class="visible-ie">Choices.js</h1>
|
|
||||||
</a>
|
|
||||||
<h2>Text inputs</h2>
|
<h2>Text inputs</h2>
|
||||||
<div data-test-hook="basic">
|
<div data-test-hook="basic">
|
||||||
<label for="choices-basic">Basic</label>
|
<label for="choices-basic">Basic</label>
|
||||||
|
@ -74,14 +70,10 @@
|
||||||
<input class="form-control" id="choices-prepend-append" type="text" placeholder="This is a placeholder">
|
<input class="form-control" id="choices-prepend-append" type="text" placeholder="This is a placeholder">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<hr>
|
<div data-test-hook="prepopulated">
|
||||||
|
<label for="choices-prepopulated">Pre-populated choices</label>
|
||||||
<h2>Multiple select input</h2>
|
<input class="form-control" id="choices-prepopulated" type="text" placeholder="This is a placeholder">
|
||||||
|
</div>
|
||||||
<hr>
|
|
||||||
|
|
||||||
<h2>Single select input</h2>
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<script>
|
<script>
|
||||||
|
@ -112,17 +104,17 @@
|
||||||
prependValue: 'before-',
|
prependValue: 'before-',
|
||||||
appendValue: '-after',
|
appendValue: '-after',
|
||||||
});
|
});
|
||||||
|
|
||||||
|
new Choices('#choices-prepopulated', {
|
||||||
|
items: ['Josh Johnson', {
|
||||||
|
value: 'joe@bloggs.co.uk',
|
||||||
|
label: 'Joe Bloggs',
|
||||||
|
customProperties: {
|
||||||
|
description: 'Joe Blogg is such a generic name'
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
});
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- Google Analytics - Ignore me -->
|
|
||||||
<script>
|
|
||||||
window.ga = window.ga || function() { (ga.q = ga.q || []).push(arguments) }; ga.l = +new Date;
|
|
||||||
ga('create', 'UA-31575166-1', 'auto');
|
|
||||||
ga('send', 'pageview');
|
|
||||||
</script>
|
|
||||||
<script async src='https://www.google-analytics.com/analytics.js'></script>
|
|
||||||
<!-- End Google Analytics -->
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
Loading…
Reference in a new issue