drip-public/iview
6
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix unit tests and add more tests

Browse source
This commit is contained in:
Sergio Crisostomo 2018-03-27 10:06:16 +02:00
parent c9b86944ec
commit afef4ce7f7
1 changed files with 267 additions and 100 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

205
test/unit/specs/select.spec.js
View file

@ -26,8 +26,6 @@ describe('Select.vue', () => {
const placeholderSpan = vm.$el.querySelector('.ivu-select-placeholder');
expect(placeholderSpan.textContent).to.equal(placeholder);
expect(placeholderSpan.style.display).to.not.equal('none');
expect(vm.$children[0].showPlaceholder).to.equal(true);
done();
});
});
@ -35,25 +33,33 @@ describe('Select.vue', () => {
it('should create a Select component and take a pre-selected value', done => {
vm = createVue({
template: `
<Select :value="2">
<Select :value="value">
<Option v-for="item in options" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
`,
data() {
return {
value: '',
value: 2,
options: [{value: 1, label: 'Foo'}, {value: 2, label: 'Bar'}]
};
}
});
vm.$nextTick(() => {
waitForIt(
() => {
const selectedValueSpan = vm.$el.querySelector('.ivu-select-selected-value');
return selectedValueSpan.textContent === 'Bar';
},
() => {
const selectedValueSpan = vm.$el.querySelector('.ivu-select-selected-value');
const {label, value} = vm.$children[0].values[0];
expect(selectedValueSpan.textContent).to.equal('Bar');
expect(selectedValueSpan.style.display).to.not.equal('none');
expect(vm.$children[0].selectedSingle).to.equal('Bar');
expect(vm.$children[0].model).to.equal(2);
expect(label).to.equal('Bar');
expect(value).to.equal(2);
done();
});
}
);
});
it('should accept normal characters', done => {
@ -112,13 +118,20 @@ describe('Select.vue', () => {
};
}
});
vm.$nextTick(() => {
waitForIt(
() => {
const selectedValueSpan = vm.$el.querySelector('.ivu-select-selected-value');
return selectedValueSpan.textContent === 'Bar';
},
() => {
const placeholderSpan = vm.$el.querySelector('.ivu-select-placeholder');
const selectedValueSpan = vm.$el.querySelector('.ivu-select-selected-value');
expect(placeholderSpan.style.display).to.equal('none');
expect(selectedValueSpan.style.display).to.not.equal('none');
expect(placeholderSpan).to.equal(null);
expect(!!selectedValueSpan.style.display).to.not.equal('none');
expect(selectedValueSpan.textContent).to.equal('Bar');
done();
});
}
);
});
it('should set different classes for different sizes', done => {
@ -158,12 +171,10 @@ describe('Select.vue', () => {
}
});
const condition = function() {
return vm.$children[0].options.length > 0;
const componentOptions = vm.$children[0].flatOptions;
return componentOptions && componentOptions.length > 0;
};
const callback = function() {
if (vm.$children[0].options == 0) return setTimeout(waitForIt.bind(null, done), 50);
expect(JSON.stringify(vm.$children[0].options)).to.equal(JSON.stringify(laterOptions));
const renderedOptions = vm.$el.querySelectorAll('.ivu-select-dropdown-list li');
expect(renderedOptions.length).to.equal(laterOptions.length);
@ -207,8 +218,8 @@ describe('Select.vue', () => {
}
});
const [SelectA, SelectB] = vm.$children;
SelectA.toggleMenu();
SelectB.toggleMenu();
SelectA.toggleMenu(null, true);
SelectB.toggleMenu(null, true);
new Promise(resolve => {
const condition = function() {
@ -247,6 +258,161 @@ describe('Select.vue', () => {
expect(selectAValue).to.equal(options[0].label);
expect(selectBValue).to.equal(options.slice(1, 3).map(obj => obj.label.trim()).join(','));
done();
}).catch(err => {
console.log(err);
done(false);
});
});
it('should create update model with value, and label when asked', done => {
const options = [
{value: 'beijing', label: 'Beijing'},
{value: 'stockholm', label: 'Stockholm'},
{value: 'lisboa', label: 'Lisboa'}
];
let onChangeValueA, onChangeValueB;
vm = createVue({
template: `
<div>
<i-select v-model="modelA" style="width:260px" @on-change="onChangeA">
<i-option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</i-option>
</i-select>
<i-select v-model="modelB" label-in-value style="width:260px" @on-change="onChangeB">
<i-option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</i-option>
</i-select>
</div>
`,
data() {
return {
cityList: options,
modelA: [],
modelB: []
};
},
methods: {
onChangeA(val){
onChangeValueA = val;
},
onChangeB(val){
onChangeValueB = val;
}
}
});
const [SelectA, SelectB] = vm.$children;
SelectA.toggleMenu(null, true);
SelectB.toggleMenu(null, true);
new Promise(resolve => {
const condition = function() {
const optionsA = SelectA.$el.querySelectorAll('.ivu-select-item');
const optionsB = SelectB.$el.querySelectorAll('.ivu-select-item');
return optionsA.length > 0 && optionsB.length > 0;
};
waitForIt(condition, resolve);
})
.then(() => {
// click in A options
const optionsA = SelectA.$el.querySelectorAll('.ivu-select-item');
optionsA[0].click();
return promissedTick(SelectA);
})
.then(() => {
expect(vm.modelA).to.equal(options[0].value);
expect(onChangeValueA).to.equal(options[0].value);
// click in B options
const optionsB = SelectB.$el.querySelectorAll('.ivu-select-item');
optionsB[2].click();
return promissedTick(SelectB);
})
.then(() => {
expect(vm.modelB).to.equal(options[2].value);
expect(JSON.stringify(onChangeValueB)).to.equal(JSON.stringify(options[2]));
done();
});
});
});
describe('Public API', () => {
it('The "setQuery" method should behave as expected', (done) => {
const options = [
{value: 'beijing', label: 'Beijing'},
{value: 'stockholm', label: 'Stockholm'},
{value: 'lisboa', label: 'Lisboa'}
];
vm = createVue({
template: `
<Select v-model="value" filterable>
<Option v-for="item in options" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
`,
data() {
return {
value: '',
options: options
};
}
});
const [Select] = vm.$children;
Select.setQuery('i');
vm.$nextTick(() => {
const query = 'i';
const input = vm.$el.querySelector('.ivu-select-input');
expect(input.value).to.equal(query);
const renderedOptions = [...vm.$el.querySelectorAll('.ivu-select-item')].map(el => el.textContent);
const filteredOptions = options.filter(option => JSON.stringify(option).includes(query)).map(({label}) => label);
expect(JSON.stringify(renderedOptions)).to.equal(JSON.stringify(filteredOptions));
// reset query
// setQuery(null) should clear the select
Select.setQuery(null);
vm.$nextTick(() => {
const input = vm.$el.querySelector('.ivu-select-input');
expect(input.value).to.equal('');
const renderedOptions = [...vm.$el.querySelectorAll('.ivu-select-item')].map(el => el.textContent);
expect(JSON.stringify(renderedOptions)).to.equal(JSON.stringify(options.map(({label}) => label)));
done();
});
});
});
it('The "clearSingleSelect" method should behave as expected', (done) => {
// clearSingleSelect
const options = [
{value: 'beijing', label: 'Beijing'},
{value: 'stockholm', label: 'Stockholm'},
{value: 'lisboa', label: 'Lisboa'}
];
const preSelected = 'lisboa';
vm = createVue({
template: `
<Select v-model="value" clearable>
<Option v-for="item in options" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
`,
data() {
return {
value: preSelected,
options: options
};
}
});
const [Select] = vm.$children;
vm.$nextTick(() => {
expect(Select.publicValue).to.equal(preSelected);
Select.clearSingleSelect();
expect(typeof Select.publicValue).to.equal('undefined');
done();
});
});
@ -278,7 +444,8 @@ describe('Select.vue', () => {
}
});
const condition = function() {
return vm.$children[0].options.length == manyLaterOptions.length;
const componentOptions = vm.$children[0].flatOptions;
return componentOptions && componentOptions.length === manyLaterOptions.length;
};
const callback = function() {
const end = +new Date();