OrderList tests added
Tuğçe Küçükoğlu
parent
1e580f89ee
commit
a10c5e3420
|
|
@ -0,0 +1,140 @@
|
|||
import { mount } from '@vue/test-utils';
|
||||
import OrderList from './OrderList.vue';
|
||||
|
||||
describe('OrderList.vue', () => {
|
||||
let wrapper;
|
||||
|
||||
beforeEach(() => {
|
||||
wrapper = mount(OrderList, {
|
||||
props: {
|
||||
modelValue: [
|
||||
{
|
||||
"id": "1000",
|
||||
"code": "vbb124btr",
|
||||
"name": "Game Controller",
|
||||
"description": "Product Description",
|
||||
"image": "game-controller.jpg",
|
||||
"price": 99,
|
||||
"category": "Electronics",
|
||||
"quantity": 2,
|
||||
"inventoryStatus": "LOWSTOCK",
|
||||
"rating": 4
|
||||
},
|
||||
{
|
||||
"id": "1001",
|
||||
"code": "nvklal433",
|
||||
"name": "Black Watch",
|
||||
"description": "Product Description",
|
||||
"image": "black-watch.jpg",
|
||||
"price": 72,
|
||||
"category": "Accessories",
|
||||
"quantity": 61,
|
||||
"inventoryStatus": "INSTOCK",
|
||||
"rating": 4
|
||||
},
|
||||
{
|
||||
"id": "1002",
|
||||
"code": "zz21cz3c1",
|
||||
"name": "Blue Band",
|
||||
"description": "Product Description",
|
||||
"image": "blue-band.jpg",
|
||||
"price": 79,
|
||||
"category": "Fitness",
|
||||
"quantity": 2,
|
||||
"inventoryStatus": "LOWSTOCK",
|
||||
"rating": 3
|
||||
},
|
||||
{
|
||||
"id": "1003",
|
||||
"code": "244wgerg2",
|
||||
"name": "Blue T-Shirt",
|
||||
"description": "Product Description",
|
||||
"image": "blue-t-shirt.jpg",
|
||||
"price": 29,
|
||||
"category": "Clothing",
|
||||
"quantity": 25,
|
||||
"inventoryStatus": "INSTOCK",
|
||||
"rating": 5
|
||||
},
|
||||
{
|
||||
"id": "1004",
|
||||
"code": "h456wer53",
|
||||
"name": "Bracelet",
|
||||
"description": "Product Description",
|
||||
"image": "bracelet.jpg",
|
||||
"price": 15,
|
||||
"category": "Accessories",
|
||||
"quantity": 73,
|
||||
"inventoryStatus": "INSTOCK",
|
||||
"rating": 4
|
||||
},
|
||||
{
|
||||
"id": "1005",
|
||||
"code": "cm230f032",
|
||||
"name": "Gaming Set",
|
||||
"description": "Product Description",
|
||||
"image": "gaming-set.jpg",
|
||||
"price": 299,
|
||||
"category": "Electronics",
|
||||
"quantity": 63,
|
||||
"inventoryStatus": "INSTOCK",
|
||||
"rating": 3
|
||||
}
|
||||
]
|
||||
},
|
||||
slots: {
|
||||
header: 'List of Products',
|
||||
item: `
|
||||
<template #item="slotProps">
|
||||
<div class="product-item">
|
||||
<div class="image-container">
|
||||
<img :src="'demo/images/product/' + slotProps.item.image" :alt="slotProps.item.name" />
|
||||
</div>
|
||||
<div class="product-list-detail">
|
||||
<h6 class="mb-2">{{slotProps.item.name}}</h6>
|
||||
<i class="pi pi-tag product-category-icon"></i>
|
||||
<span class="product-category">{{slotProps.item.category}}</span>
|
||||
</div>
|
||||
<div class="product-list-action">
|
||||
<h6 class="mb-2">\${{slotProps.item.price}}</h6>
|
||||
<span :class="'product-badge status-'+slotProps.item.inventoryStatus.toLowerCase()">{{slotProps.item.inventoryStatus}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
`
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
it('should exist', () => {
|
||||
expect(wrapper.find('.p-orderlist.p-component').exists()).toBe(true);
|
||||
expect(wrapper.find('.p-orderlist-controls').exists()).toBe(true);
|
||||
expect(wrapper.findAll('li.p-orderlist-item').length).toBe(6);
|
||||
});
|
||||
|
||||
it('should select item', async () => {
|
||||
await wrapper.vm.onItemClick({}, wrapper.vm.modelValue[0], 0);
|
||||
|
||||
expect(wrapper.emitted()['update:selection'][0]).toEqual([[wrapper.vm.modelValue[0]]]);
|
||||
|
||||
await wrapper.setProps({ selection: [wrapper.vm.modelValue[0]] });
|
||||
|
||||
expect(wrapper.findAll('li.p-orderlist-item')[0].classes()).toContain('p-highlight');
|
||||
});
|
||||
|
||||
it('should slot works', () => {
|
||||
expect(wrapper.find('.p-orderlist-header').text()).toBe('List of Products');
|
||||
expect(wrapper.findAll('.product-item').length).toBe(6);
|
||||
});
|
||||
|
||||
it('should change order', async () => {
|
||||
await wrapper.setProps({ selection: [wrapper.vm.modelValue[2]] });
|
||||
await wrapper.setData({ d_selection: [wrapper.vm.modelValue[2]] });
|
||||
|
||||
expect(wrapper.findAll('li.p-orderlist-item')[2].classes()).toContain('p-highlight');
|
||||
|
||||
await wrapper.vm.moveUp({});
|
||||
|
||||
expect(wrapper.emitted()['update:modelValue'][0][0][1]).toEqual(wrapper.vm.modelValue[2]);
|
||||
});
|
||||
});
|
||||
|
|
@ -96,7 +96,7 @@ export default {
|
|||
isSelected(item) {
|
||||
return ObjectUtils.findIndexInList(item, this.d_selection) != -1;
|
||||
},
|
||||
moveUp() {
|
||||
moveUp(event) {
|
||||
if (this.d_selection) {
|
||||
let value = [...this.modelValue];
|
||||
|
||||
|
|
@ -124,7 +124,7 @@ export default {
|
|||
});
|
||||
}
|
||||
},
|
||||
moveTop() {
|
||||
moveTop(event) {
|
||||
if(this.d_selection) {
|
||||
let value = [...this.modelValue];
|
||||
|
||||
|
|
@ -150,7 +150,7 @@ export default {
|
|||
});
|
||||
}
|
||||
},
|
||||
moveDown() {
|
||||
moveDown(event) {
|
||||
if(this.d_selection) {
|
||||
let value = [...this.modelValue];
|
||||
|
||||
|
|
@ -178,7 +178,7 @@ export default {
|
|||
});
|
||||
}
|
||||
},
|
||||
moveBottom() {
|
||||
moveBottom(event) {
|
||||
if (this.d_selection) {
|
||||
let value = [...this.modelValue];
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue