Skip to content

Commit

Permalink
Fix problem with comments and update test
Browse files Browse the repository at this point in the history
  • Loading branch information
Lionel Bijaoui committed Jun 27, 2017
1 parent c868aab commit 155f5a1
Show file tree
Hide file tree
Showing 2 changed files with 28 additions and 35 deletions.
11 changes: 3 additions & 8 deletions src/fields/optional/fieldVueMultiSelect.vue
Original file line number Diff line number Diff line change
@@ -1,10 +1,9 @@
<template lang="pug">
multiselect(
//- multiselectMixin.js
multiselect(
:id="selectOptions.id",
:options="options",
:value="value",
:multiple="schema.multiple",
:multiple="selectOptions.multiple",
:track-by="selectOptions.trackBy || null",
:label="selectOptions.label || null",
:searchable="selectOptions.searchable",
Expand All @@ -22,7 +21,6 @@
:group-label="selectOptions.groupLabel",
:block-keys="selectOptions.blockKeys",
:internal-search="selectOptions.internalSearch",
//- Multiselect.vue
:select-label="selectOptions.selectLabel",
:selected-label="selectOptions.selectedLabel",
:deselect-label="selectOptions.deselectLabel",
Expand All @@ -32,17 +30,14 @@
:loading="selectOptions.loading",
:disabled="disabled",
:max-height="selectOptions.maxHeight",
//- pointerMixin.js
:show-pointer="selectOptions.showPointer",
//- Events
@input="updateSelected",
@select="onSelect",
@remove="onRemove",
@search-change="onSearchChange",
@tag="addTag",
@open="onOpen",
@close="onClose",
//- Slots
@close="onClose",
:option-height="selectOptions.optionHeight",
)
</template>
Expand Down
52 changes: 25 additions & 27 deletions test/unit/specs/fields/fieldVueMultiSelect.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ Vue.component("multiselect", VueMultiSelect);
let el, vm, field;

function createField(test, schema = {}, model = null, disabled = false, options) {
[ el, vm, field ] = createVueField(test, "fieldVueMultiSelect", schema, model, disabled, options);
[el, vm, field] = createVueField(test, "fieldVueMultiSelect", schema, model, disabled, options);
}

describe("fieldVueMultiSelect.vue", function() {
Expand All @@ -22,20 +22,21 @@ describe("fieldVueMultiSelect.vue", function() {
type: "vueMultiSelect",
label: "Cities",
model: "city",
multiSelect: true,
required: false,
values: [
"London",
"Paris",
"Rome",
"Berlin"
],
selectOptions: {}
selectOptions: {
multiple: true
}
};
let model = { city: "Paris" };
let input;

before( () => {
before(() => {
createField(this, schema, model, false);
input = el.querySelector(".multiselect");
});
Expand All @@ -58,7 +59,7 @@ describe("fieldVueMultiSelect.vue", function() {

it("should set disabled", (done) => {
field.disabled = true;
vm.$nextTick( () => {
vm.$nextTick(() => {
expect(input.classList.contains("multiselect--disabled")).to.be.true;
field.disabled = false;
done();
Expand All @@ -67,7 +68,7 @@ describe("fieldVueMultiSelect.vue", function() {

it("input value should be the model value after changed", (done) => {
model.city = "Rome";
vm.$nextTick( () => {
vm.$nextTick(() => {
expect(input.querySelectorAll("li .multiselect__option--selected").length).to.be.equal(1);
let options = input.querySelectorAll("li .multiselect__option");
expect(options[2].querySelector("span").textContent).to.be.equal("Rome");
Expand All @@ -77,8 +78,8 @@ describe("fieldVueMultiSelect.vue", function() {
});

it("input value should be the model value after changed (multiselection)", (done) => {
model.city = ["Paris","Rome"];
vm.$nextTick( () => {
model.city = ["Paris", "Rome"];
vm.$nextTick(() => {
expect(input.querySelectorAll("li .multiselect__option--selected").length).to.be.equal(2);
let options = input.querySelectorAll("li .multiselect__option");
expect(options[1].querySelector("span").textContent).to.be.equal("Paris");
Expand All @@ -93,7 +94,7 @@ describe("fieldVueMultiSelect.vue", function() {
let options = input.querySelectorAll("li .multiselect__option");
trigger(options[2], "mousedown");

vm.$nextTick( () => {
vm.$nextTick(() => {
expect(model.city.length).to.be.equal(1);
expect(model.city[0]).to.be.equal("Paris");
done();
Expand All @@ -106,31 +107,28 @@ describe("fieldVueMultiSelect.vue", function() {
name: "Vue.js",
language: "JavaScript"
};
let schema = {...schema};
let schema = {...schema };
let model = {
city: [option]
};
schema.values = [
{
name: "Vue.js",
language: "JavaScript"
},
{
name: "Rails",
language: "Ruby"
},
{
name: "Sinatra",
language: "Ruby"
}];
schema.values = [{
name: "Vue.js",
language: "JavaScript"
}, {
name: "Rails",
language: "Ruby"
}, {
name: "Sinatra",
language: "Ruby"
}];
schema.selectOptions = {};
before(() => {
createField(this, schema, model, false);
input = el.querySelector(".multiselect");
});

it("model value should work with objects", (done) => {
schema.selectOptions = {label: "name", trackBy: "name"};
schema.selectOptions = { label: "name", trackBy: "name" };
vm.$nextTick(() => {
expect(model.city.length).to.be.equal(1);
expect(model.city[0]).to.be.eql(schema.values[0]);
Expand All @@ -139,7 +137,7 @@ describe("fieldVueMultiSelect.vue", function() {
});

it("options should contain only text specified in label", (done) => {
schema.selectOptions = {label: "language", trackBy: "language"};
schema.selectOptions = { label: "language", trackBy: "language" };
vm.$nextTick(() => {
let options = input.querySelectorAll("li .multiselect__option");
expect(options[0].querySelector("span").textContent).to.be.equal("JavaScript");
Expand All @@ -151,7 +149,7 @@ describe("fieldVueMultiSelect.vue", function() {
schema.selectOptions = {
label: "name",
trackBy: "name",
customLabel: ({name, language}) => {
customLabel: ({ name, language }) => {
return `${name}-${language}`;
}
};
Expand All @@ -163,4 +161,4 @@ describe("fieldVueMultiSelect.vue", function() {
});
});
});
});
});

0 comments on commit 155f5a1

Please sign in to comment.