Fix set choice by value bug (#471)
* Resolve bug with setChoiceByValue not removing choice from dropdown * 4.1.3 * Version 4.1.3
This commit is contained in:
Josh Johnson
GitHub
parent
16e16a181c
commit
826384b9d5
|
|
@ -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);
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "choices.js",
|
||||
"version": "4.1.2",
|
||||
"version": "4.1.3",
|
||||
"description": "A vanilla JS customisable text input/select box plugin",
|
||||
"main": "./public/assets/scripts/choices.min.js",
|
||||
"types": "./types/index.d.ts",
|
||||
|
|
@ -24,9 +24,9 @@
|
|||
"css:sass": "node-sass --output-style expanded --include-path scss src/styles/base.scss public/assets/styles/base.css && node-sass --output-style expanded --include-path scss src/styles/choices.scss public/assets/styles/choices.css",
|
||||
"css:prefix": "postcss --use autoprefixer -b 'last 2 versions' public/assets/styles/*.css -d public/assets/styles",
|
||||
"css:min": "csso public/assets/styles/base.css public/assets/styles/base.min.css && csso public/assets/styles/choices.css public/assets/styles/choices.min.css",
|
||||
"bump-version": "node bump-version.js --current $npm_package_version",
|
||||
"bump-cache": "node bump-cache.js --current $npm_package_version",
|
||||
"deploy": "git subtree push --prefix public origin gh-pages",
|
||||
"postversion": "npm run js:build",
|
||||
"postversion": "npm run js:build && npm run bump-cache",
|
||||
"prepush": "run-p lint test:unit"
|
||||
},
|
||||
"repository": {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
/*! choices.js v4.1.2 | (c) 2018 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
|
||||
/*! choices.js v4.1.3 | (c) 2018 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
|
||||
(function webpackUniversalModuleDefinition(root, factory) {
|
||||
//CommonJS2
|
||||
if(typeof exports === 'object' && typeof module === 'object')
|
||||
|
|
@ -3751,24 +3751,14 @@ var Choices = function () {
|
|||
}
|
||||
|
||||
// Trigger change event
|
||||
if (group && group.value) {
|
||||
this.passedElement.triggerEvent(_constants.EVENTS.addItem, {
|
||||
id: id,
|
||||
value: passedValue,
|
||||
label: passedLabel,
|
||||
customProperties: passedCustomProperties,
|
||||
groupValue: group.value,
|
||||
keyCode: passedKeyCode
|
||||
});
|
||||
} else {
|
||||
this.passedElement.triggerEvent(_constants.EVENTS.addItem, {
|
||||
id: id,
|
||||
value: passedValue,
|
||||
label: passedLabel,
|
||||
customProperties: passedCustomProperties,
|
||||
keyCode: passedKeyCode
|
||||
});
|
||||
}
|
||||
this.passedElement.triggerEvent(_constants.EVENTS.addItem, {
|
||||
id: id,
|
||||
value: passedValue,
|
||||
label: passedLabel,
|
||||
customProperties: passedCustomProperties,
|
||||
groupValue: group && group.value ? group.value : undefined,
|
||||
keyCode: passedKeyCode
|
||||
});
|
||||
|
||||
return this;
|
||||
}
|
||||
|
|
@ -4202,7 +4192,7 @@ var Choices = function () {
|
|||
this._addItem({
|
||||
value: foundChoice.value,
|
||||
label: foundChoice.label,
|
||||
id: foundChoice.id,
|
||||
choiceId: foundChoice.id,
|
||||
groupId: foundChoice.groupId,
|
||||
customProperties: foundChoice.customProperties,
|
||||
placeholder: foundChoice.placeholder,
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -16,7 +16,7 @@
|
|||
<meta name="theme-color" content="#ffffff">
|
||||
|
||||
<!-- Ignore these -->
|
||||
<link rel="stylesheet" href="assets/styles/base.min.css?version=4.1.2">
|
||||
<link rel="stylesheet" href="assets/styles/base.min.css?version=4.1.3">
|
||||
<!-- End ignore these -->
|
||||
|
||||
<!-- Optional includes -->
|
||||
|
|
@ -24,8 +24,8 @@
|
|||
<!-- End optional includes -->
|
||||
|
||||
<!-- Choices includes -->
|
||||
<link rel="stylesheet" href="assets/styles/choices.min.css?version=4.1.2">
|
||||
<script src="assets/scripts/choices.min.js?version=4.1.2"></script>
|
||||
<link rel="stylesheet" href="assets/styles/choices.min.css?version=4.1.3">
|
||||
<script src="assets/scripts/choices.min.js?version=4.1.3"></script>
|
||||
<!-- End Choices includes -->
|
||||
|
||||
<!--[if lt IE 9]>
|
||||
|
|
|
|||
|
|
@ -185,6 +185,15 @@
|
|||
</select>
|
||||
</form>
|
||||
</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>
|
||||
<script>
|
||||
|
|
@ -296,6 +305,8 @@
|
|||
});
|
||||
|
||||
new Choices('#choices-within-form');
|
||||
|
||||
new Choices('#choices-set-choice-by-value').setChoiceByValue('Choice 2');
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
|
|
|||
|
|
@ -189,6 +189,15 @@
|
|||
</select>
|
||||
</form>
|
||||
</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>
|
||||
<script>
|
||||
|
|
@ -308,6 +317,8 @@
|
|||
});
|
||||
|
||||
new Choices('#choices-within-form');
|
||||
|
||||
new Choices('#choices-set-choice-by-value').setChoiceByValue('Choice 2');
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
|
|
|||
|
|
@ -1628,24 +1628,14 @@ class Choices {
|
|||
}
|
||||
|
||||
// Trigger change event
|
||||
if (group && group.value) {
|
||||
this.passedElement.triggerEvent(EVENTS.addItem, {
|
||||
id,
|
||||
value: passedValue,
|
||||
label: passedLabel,
|
||||
customProperties: passedCustomProperties,
|
||||
groupValue: group.value,
|
||||
keyCode: passedKeyCode,
|
||||
});
|
||||
} else {
|
||||
this.passedElement.triggerEvent(EVENTS.addItem, {
|
||||
id,
|
||||
value: passedValue,
|
||||
label: passedLabel,
|
||||
customProperties: passedCustomProperties,
|
||||
keyCode: passedKeyCode,
|
||||
});
|
||||
}
|
||||
this.passedElement.triggerEvent(EVENTS.addItem, {
|
||||
id,
|
||||
value: passedValue,
|
||||
label: passedLabel,
|
||||
customProperties: passedCustomProperties,
|
||||
groupValue: group && group.value ? group.value : undefined,
|
||||
keyCode: passedKeyCode,
|
||||
});
|
||||
|
||||
return this;
|
||||
}
|
||||
|
|
@ -2044,7 +2034,7 @@ class Choices {
|
|||
this._addItem({
|
||||
value: foundChoice.value,
|
||||
label: foundChoice.label,
|
||||
id: foundChoice.id,
|
||||
choiceId: foundChoice.id,
|
||||
groupId: foundChoice.groupId,
|
||||
customProperties: foundChoice.customProperties,
|
||||
placeholder: foundChoice.placeholder,
|
||||
|
|
|
|||
Loading…
Reference in New Issue