mirror of
https://github.com/Choices-js/Choices.git
synced 2024-05-15 20:16:39 +02:00
Resolve bug with setChoiceByValue not removing choice from dropdown
This commit is contained in:
parent
16e16a181c
commit
e968989b6b
|
@ -818,5 +818,40 @@ describe('Choices - select multiple', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe('dynamically setting choice by value', () => {
|
||||||
|
const dynamicallySelectedChoiceValue = 'Choice 2';
|
||||||
|
|
||||||
|
it('selects choice', () => {
|
||||||
|
cy.get('[data-test-hook=set-choice-by-value]')
|
||||||
|
.find('.choices__list--multiple .choices__item')
|
||||||
|
.last()
|
||||||
|
.should($choice => {
|
||||||
|
expect($choice.text().trim()).to.equal(
|
||||||
|
dynamicallySelectedChoiceValue,
|
||||||
|
);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
it('removes choice from dropdown list', () => {
|
||||||
|
cy.get('[data-test-hook=set-choice-by-value]')
|
||||||
|
.find('.choices__list--dropdown .choices__list')
|
||||||
|
.children()
|
||||||
|
.each($choice => {
|
||||||
|
expect($choice.text().trim()).to.not.equal(
|
||||||
|
dynamicallySelectedChoiceValue,
|
||||||
|
);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
it('updates the value of the original input', () => {
|
||||||
|
cy.get('[data-test-hook=set-choice-by-value]')
|
||||||
|
.find('.choices__input.is-hidden')
|
||||||
|
.should($select => {
|
||||||
|
const val = $select.val() || [];
|
||||||
|
expect(val).to.contain(dynamicallySelectedChoiceValue);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -835,5 +835,37 @@ describe('Choices - select one', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe('dynamically setting choice by value', () => {
|
||||||
|
const dynamicallySelectedChoiceValue = 'Choice 2';
|
||||||
|
|
||||||
|
it('selects choice', () => {
|
||||||
|
cy.get('[data-test-hook=set-choice-by-value]')
|
||||||
|
.find('.choices__list--single .choices__item')
|
||||||
|
.last()
|
||||||
|
.should($choice => {
|
||||||
|
expect($choice.text().trim()).to.equal(
|
||||||
|
dynamicallySelectedChoiceValue,
|
||||||
|
);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
it('does not remove choice from dropdown list', () => {
|
||||||
|
cy.get('[data-test-hook=set-choice-by-value]')
|
||||||
|
.find('.choices__list--dropdown .choices__list')
|
||||||
|
.then($choicesList => {
|
||||||
|
expect($choicesList).to.contain(dynamicallySelectedChoiceValue);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
it('updates the value of the original input', () => {
|
||||||
|
cy.get('[data-test-hook=set-choice-by-value]')
|
||||||
|
.find('.choices__input.is-hidden')
|
||||||
|
.should($select => {
|
||||||
|
const val = $select.val() || [];
|
||||||
|
expect(val).to.contain(dynamicallySelectedChoiceValue);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -185,6 +185,15 @@
|
||||||
</select>
|
</select>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div data-test-hook="set-choice-by-value">
|
||||||
|
<label for="choices-set-choice-by-value">Dynamically set choice by value</label>
|
||||||
|
<select class="form-control" name="choices-set-choice-by-value" id="choices-set-choice-by-value" multiple>
|
||||||
|
<option value="Choice 1">Choice 1</option>
|
||||||
|
<option value="Choice 2">Choice 2</option>
|
||||||
|
<option value="Choice 3">Choice 3</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<script>
|
<script>
|
||||||
|
@ -296,6 +305,8 @@
|
||||||
});
|
});
|
||||||
|
|
||||||
new Choices('#choices-within-form');
|
new Choices('#choices-within-form');
|
||||||
|
|
||||||
|
new Choices('#choices-set-choice-by-value').setChoiceByValue('Choice 2');
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
|
|
|
@ -189,6 +189,15 @@
|
||||||
</select>
|
</select>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div data-test-hook="set-choice-by-value">
|
||||||
|
<label for="choices-set-choice-by-value">Dynamically set choice by value</label>
|
||||||
|
<select class="form-control" name="choices-set-choice-by-value" id="choices-set-choice-by-value">
|
||||||
|
<option value="Choice 1">Choice 1</option>
|
||||||
|
<option value="Choice 2">Choice 2</option>
|
||||||
|
<option value="Choice 3">Choice 3</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<script>
|
<script>
|
||||||
|
@ -308,6 +317,8 @@
|
||||||
});
|
});
|
||||||
|
|
||||||
new Choices('#choices-within-form');
|
new Choices('#choices-within-form');
|
||||||
|
|
||||||
|
new Choices('#choices-set-choice-by-value').setChoiceByValue('Choice 2');
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
|
|
|
@ -1628,24 +1628,14 @@ class Choices {
|
||||||
}
|
}
|
||||||
|
|
||||||
// Trigger change event
|
// Trigger change event
|
||||||
if (group && group.value) {
|
this.passedElement.triggerEvent(EVENTS.addItem, {
|
||||||
this.passedElement.triggerEvent(EVENTS.addItem, {
|
id,
|
||||||
id,
|
value: passedValue,
|
||||||
value: passedValue,
|
label: passedLabel,
|
||||||
label: passedLabel,
|
customProperties: passedCustomProperties,
|
||||||
customProperties: passedCustomProperties,
|
groupValue: group && group.value ? group.value : undefined,
|
||||||
groupValue: group.value,
|
keyCode: passedKeyCode,
|
||||||
keyCode: passedKeyCode,
|
});
|
||||||
});
|
|
||||||
} else {
|
|
||||||
this.passedElement.triggerEvent(EVENTS.addItem, {
|
|
||||||
id,
|
|
||||||
value: passedValue,
|
|
||||||
label: passedLabel,
|
|
||||||
customProperties: passedCustomProperties,
|
|
||||||
keyCode: passedKeyCode,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
return this;
|
return this;
|
||||||
}
|
}
|
||||||
|
@ -2044,7 +2034,7 @@ class Choices {
|
||||||
this._addItem({
|
this._addItem({
|
||||||
value: foundChoice.value,
|
value: foundChoice.value,
|
||||||
label: foundChoice.label,
|
label: foundChoice.label,
|
||||||
id: foundChoice.id,
|
choiceId: foundChoice.id,
|
||||||
groupId: foundChoice.groupId,
|
groupId: foundChoice.groupId,
|
||||||
customProperties: foundChoice.customProperties,
|
customProperties: foundChoice.customProperties,
|
||||||
placeholder: foundChoice.placeholder,
|
placeholder: foundChoice.placeholder,
|
||||||
|
|
Loading…
Reference in a new issue