mirror of
https://github.com/Choices-js/Choices.git
synced 2024-06-10 09:52:18 +02:00
* add specs * fix to restore preset choices after destroy * avoid to modify `this.config.choices` directly * Update cypress/integration/select-one.spec.js Co-Authored-By: Josh Johnson <josh@joshuajohnson.co.uk> * Update public/test/select-one.html Co-Authored-By: Josh Johnson <josh@joshuajohnson.co.uk> * Update public/test/select-one.html Co-Authored-By: Josh Johnson <josh@joshuajohnson.co.uk> * Update public/test/select-one.html Co-Authored-By: Josh Johnson <josh@joshuajohnson.co.uk> * Update public/test/select-one.html Co-Authored-By: Josh Johnson <josh@joshuajohnson.co.uk> * fix specs * restoring passed element initial options - Save `passedElement.options` values as `this._presetOptions` - Restore saved `this._presetOptions` to `passedElement.options` on `destroy` - It avoids restoring options in `this.config.choices` * Update cypress/integration/select-one.spec.js Co-Authored-By: Josh Johnson <josh@joshuajohnson.co.uk> * Update cypress/integration/select-one.spec.js Co-Authored-By: Josh Johnson <josh@joshuajohnson.co.uk> * Update public/test/select-one.html Co-Authored-By: Josh Johnson <josh@joshuajohnson.co.uk> * move preset options assignment statement
This commit is contained in:
parent
e7b4afd472
commit
0e8e42e015
|
@ -1022,5 +1022,39 @@ describe('Choices - select one', () => {
|
|||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('re-initialising a choices instance', () => {
|
||||
it('preserves the choices list', () => {
|
||||
cy.get('[data-test-hook=new-destroy-init]')
|
||||
.find('.choices__list--dropdown .choices__list')
|
||||
.children()
|
||||
.should('have.length', 3);
|
||||
|
||||
cy.get('[data-test-hook=new-destroy-init]')
|
||||
.find('button.destroy')
|
||||
.click();
|
||||
cy.get('[data-test-hook=new-destroy-init]')
|
||||
.find('button.init')
|
||||
.click();
|
||||
|
||||
cy.get('[data-test-hook=new-destroy-init]')
|
||||
.find('.choices__list--dropdown .choices__list')
|
||||
.children()
|
||||
.should('have.length', 3);
|
||||
});
|
||||
});
|
||||
|
||||
describe('destroying the choices instance', () => {
|
||||
it('preserves the original select element', () => {
|
||||
cy.get('[data-test-hook=new-destroy-init]')
|
||||
.find('button.destroy')
|
||||
.click();
|
||||
|
||||
cy.get('[data-test-hook=new-destroy-init]')
|
||||
.find('select')
|
||||
.children()
|
||||
.should('have.length', 3);
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
@ -359,6 +359,21 @@
|
|||
<option value="value2">label2</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div data-test-hook="new-destroy-init">
|
||||
<label for="choices-new-destroy-init">New, Destroy, Init</label>
|
||||
<select
|
||||
class="form-control"
|
||||
name="choices-new-destroy-init"
|
||||
id="choices-new-destroy-init"
|
||||
>
|
||||
<option value="Choice 1">Choice 1</option>
|
||||
<option value="Choice 2">Choice 2</option>
|
||||
<option value="Choice 3">Choice 3</option>
|
||||
</select>
|
||||
<button class="destroy">Destroy</button>
|
||||
<button class="init">Init</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
|
@ -523,6 +538,16 @@
|
|||
);
|
||||
|
||||
new Choices('#choices-search-by-label', { searchFields: ['label'] });
|
||||
|
||||
const newDestroyInitChoices = new Choices('#choices-new-destroy-init');
|
||||
document
|
||||
.querySelector('button.destroy')
|
||||
.addEventListener('click', () => {
|
||||
newDestroyInitChoices.destroy();
|
||||
});
|
||||
document.querySelector('button.init').addEventListener('click', () => {
|
||||
newDestroyInitChoices.init();
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
|
|
@ -183,6 +183,8 @@ class Choices {
|
|||
};
|
||||
// Assign preset groups from passed element
|
||||
this._presetGroups = this.passedElement.optionGroups;
|
||||
// Assign preset options from passed element
|
||||
this._presetOptions = this.passedElement.options;
|
||||
// Assign preset choices from passed object
|
||||
this._presetChoices = this.config.choices;
|
||||
// Assign preset items from passed object first
|
||||
|
@ -283,11 +285,12 @@ class Choices {
|
|||
this.passedElement.reveal();
|
||||
this.containerOuter.unwrap(this.passedElement.element);
|
||||
|
||||
this.clearStore();
|
||||
|
||||
if (this._isSelectElement) {
|
||||
this.passedElement.options = this._presetChoices;
|
||||
this.passedElement.options = this._presetOptions;
|
||||
}
|
||||
|
||||
this.clearStore();
|
||||
this._templates = null;
|
||||
this.initialised = false;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue