deblan-mirror/Choices
deblan-mirror/Choices
1
0
Fork 0
mirror of https://github.com/Choices-js/Choices.git synced 2024-05-04 14:53:12 +02:00
Code Issues Projects Releases Wiki Activity

Add custom property tests

Browse source
This commit is contained in:
Josh Johnson 2018-11-03 12:00:37 +00:00
parent cd165deb3c
commit 90a92656be
4 changed files with 160 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

45
cypress/integration/select-multiple.spec.js
View file

@ -643,5 +643,50 @@ describe('Choices - select multiple', () => {
});
});
});
describe('custom properties', () => {
beforeEach(() => {
cy.get('[data-test-hook=custom-properties]')
.find('.choices__input--cloned')
.focus();
});
describe('on input', () => {
it('filters choices based on custom property', () => {
const data = [
{
country: 'Germany',
city: 'Berlin',
},
{
country: 'United Kingdom',
city: 'London',
},
{
country: 'Portugal',
city: 'Lisbon',
},
];
data.forEach(({ country, city }) => {
cy.get('[data-test-hook=custom-properties]')
.find('.choices__input--cloned')
.type(country);
cy.get('[data-test-hook=custom-properties]')
.find('.choices__list--dropdown .choices__list')
.children()
.first()
.should($choice => {
expect($choice.text().trim()).to.equal(city);
});
cy.get('[data-test-hook=custom-properties]')
.find('.choices__input--cloned')
.type('{selectall}{del}');
});
});
});
});
});
});

45
cypress/integration/select-one.spec.js
View file

@ -655,5 +655,50 @@ describe('Choices - select one', () => {
});
});
});
describe('custom properties', () => {
beforeEach(() => {
cy.get('[data-test-hook=custom-properties]')
.find('.choices')
.click();
});
describe('on input', () => {
it('filters choices based on custom property', () => {
const data = [
{
country: 'Germany',
city: 'Berlin',
},
{
country: 'United Kingdom',
city: 'London',
},
{
country: 'Portugal',
city: 'Lisbon',
},
];
data.forEach(({ country, city }) => {
cy.get('[data-test-hook=custom-properties]')
.find('.choices__input--cloned')
.type(country);
cy.get('[data-test-hook=custom-properties]')
.find('.choices__list--dropdown .choices__list')
.children()
.first()
.should($choice => {
expect($choice.text().trim()).to.equal(city);
});
cy.get('[data-test-hook=custom-properties]')
.find('.choices__input--cloned')
.type('{selectall}{del}');
});
});
});
});
});
});

35
public/test/select-multiple.html
View file

@ -166,6 +166,11 @@
</optgroup>
</select>
</div>
<div data-test-hook="custom-properties">
<label for="choices-custom-properties">Custom properties</label>
<select class="form-control" name="choices-custom-properties" id="choices-custom-properties" multiple></select>
</div>
</div>
</div>
<script>
@ -225,6 +230,36 @@
});
new Choices('#choices-groups');
new Choices('#choices-custom-properties', {
searchFields: ['label', 'value', 'customProperties.country'],
choices: [
{
id: 1,
value: 'London',
label: 'London',
customProperties: {
country: 'United Kingdom',
},
},
{
id: 2,
value: 'Berlin',
label: 'Berlin',
customProperties: {
country: 'Germany',
},
},
{
id: 3,
value: 'Lisbon',
label: 'Lisbon',
customProperties: {
country: 'Portugal',
},
}
]
});
});
</script>
</body>

35
public/test/select-one.html
View file

@ -170,6 +170,11 @@
<option value="Child choice 3">Child choice 3</option>
</select>
</div>
<div data-test-hook="custom-properties">
<label for="choices-custom-properties">Custom properties</label>
<select class="form-control" name="choices-custom-properties" id="choices-custom-properties"></select>
</div>
</div>
</div>
<script>
@ -237,6 +242,36 @@
child.disable();
}
});
new Choices('#choices-custom-properties', {
searchFields: ['label', 'value', 'customProperties.country'],
choices: [
{
id: 1,
value: 'London',
label: 'London',
customProperties: {
country: 'United Kingdom',
},
},
{
id: 2,
value: 'Berlin',
label: 'Berlin',
customProperties: {
country: 'Germany',
},
},
{
id: 3,
value: 'Lisbon',
label: 'Lisbon',
customProperties: {
country: 'Portugal',
},
}
]
});
});
</script>
</body>