From 98cc025c0751219d237d6e3aada5c4374b471b8e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?= Date: Fri, 18 Mar 2022 11:26:41 +0300 Subject: [PATCH 01/10] fake timers config --- jest.config.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/jest.config.js b/jest.config.js index 108d78814..35fb25a03 100644 --- a/jest.config.js +++ b/jest.config.js @@ -29,5 +29,6 @@ module.exports = { }, testMatch: [ "**/src/components/**/*.spec.{j,t}s?(x)" - ] + ], + timers: "fake" } \ No newline at end of file From d60e20a6e05a2f445d0fad328f4799a6bf8262c3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?= Date: Fri, 18 Mar 2022 11:26:44 +0300 Subject: [PATCH 02/10] Create Message.spec.js --- src/components/message/Message.spec.js | 52 ++++++++++++++++++++++++++ 1 file changed, 52 insertions(+) create mode 100644 src/components/message/Message.spec.js diff --git a/src/components/message/Message.spec.js b/src/components/message/Message.spec.js new file mode 100644 index 000000000..78e2707fd --- /dev/null +++ b/src/components/message/Message.spec.js @@ -0,0 +1,52 @@ +import { mount } from '@vue/test-utils'; +import Message from './Message.vue'; + +describe('Message.vue', () => { + let wrapper; + + beforeEach(() => { + wrapper = mount(Message, { + props: { + severity: 'error' + }, + slots: { + default: 'Error Message Content' + } + }); + }); + + it('should exist', () => { + expect(wrapper.find('.p-message.p-component').exists()).toBe(true); + expect(wrapper.find('.p-message.p-component').classes()).toContain('p-message-error'); + expect(wrapper.find('.p-message-text').text()).toContain('Error Message Content'); + }); + + it('should close the message', async () => { + await wrapper.vm.close({}); + + expect(wrapper.vm.visible).toBe(false); + expect(wrapper.emitted().close[0]).toEqual([{}]); + }); +}); + +describe('Message.vue', () => { + let wrapper; + + beforeEach(() => { + wrapper = mount(Message, { + props: { + severity: 'error', + life: 3000, + sticky: false + }, + slots: { + default: 'Error Message Content' + } + }); + }); + + it('should sticky and life works', async () => { + jest.runTimersToTime(3001); + expect(wrapper.vm.visible).toBe(false); + }); +}); \ No newline at end of file From 1e580f89eea627bac2079b8041820b19c394f979 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?= Date: Fri, 18 Mar 2022 12:07:40 +0300 Subject: [PATCH 03/10] Create MultiSelect.spec.js --- .../multiselect/MultiSelect.spec.js | 78 +++++++++++++++++++ 1 file changed, 78 insertions(+) create mode 100644 src/components/multiselect/MultiSelect.spec.js diff --git a/src/components/multiselect/MultiSelect.spec.js b/src/components/multiselect/MultiSelect.spec.js new file mode 100644 index 000000000..7f063b974 --- /dev/null +++ b/src/components/multiselect/MultiSelect.spec.js @@ -0,0 +1,78 @@ +import { mount } from '@vue/test-utils'; +import PrimeVue from '@/components/config/PrimeVue'; +import MultiSelect from './MultiSelect.vue'; + +describe('MultiSelect.vue', () => { + let wrapper; + + beforeEach(async () => { + wrapper = mount(MultiSelect, { + global: { + plugins: [PrimeVue], + stubs: { + teleport: true + } + }, + props: { + modelValue: null, + options: [ + {name: 'New York', code: 'NY'}, + {name: 'Rome', code: 'RM'}, + {name: 'London', code: 'LDN'}, + {name: 'Istanbul', code: 'IST'}, + {name: 'Paris', code: 'PRS'} + ], + optionLabel: 'name', + placeholder: 'Select Cities' + } + }); + + await wrapper.vm.onClick({}); + }); + + it('should exist', () => { + expect(wrapper.find('.p-multiselect.p-component').exists()).toBe(true); + expect(wrapper.find('.p-multiselect-label.p-placeholder').text()).toBe('Select Cities'); + expect(wrapper.find('.p-multiselect-panel').exists()).toBe(true); + expect(wrapper.findAll('li.p-multiselect-item').length).toBe(5); + expect(wrapper.findAll('li.p-multiselect-item')[0].attributes()['aria-label']).toBe('New York'); + expect(wrapper.findAll('li.p-multiselect-item')[0].findAll('span')[1].text()).toBe('New York'); + }); + + it('should select an item', async () => { + await wrapper.vm.onOptionSelect({}, wrapper.vm.options[0]); + + expect(wrapper.emitted()['update:modelValue'][0]).toEqual([[wrapper.vm.options[0]]]); + + await wrapper.setProps({ modelValue: [wrapper.vm.options[0]]}); + + expect(wrapper.findAll('li.p-multiselect-item')[0].classes()).toContain('p-highlight'); + expect(wrapper.find('.p-multiselect-label').text()).toBe('New York'); + }); + + it('should select multiple item', async () => { + await wrapper.setProps({ modelValue: [wrapper.vm.options[0]]}); + + await wrapper.vm.onOptionSelect({}, wrapper.vm.options[1]); + + expect(wrapper.emitted()['update:modelValue'][0]).toEqual([[wrapper.vm.options[0], wrapper.vm.options[1]]]); + + await wrapper.setProps({ modelValue: [wrapper.vm.options[0], wrapper.vm.options[1]]}); + + expect(wrapper.findAll('li.p-multiselect-item')[0].classes()).toContain('p-highlight'); + expect(wrapper.findAll('li.p-multiselect-item')[1].classes()).toContain('p-highlight'); + }); + + it('should close panel', async () => { + await wrapper.vm.onCloseClick(); + + expect(wrapper.find('.p-multiselect-panel').exists()).toBe(false); + }); + + it('should chip work', async () => { + await wrapper.setProps({ display: 'chip', modelValue: [wrapper.vm.options[0]] }); + + expect(wrapper.find('.p-multiselect-token').exists()).toBe(true); + expect(wrapper.find('.p-multiselect-token-label').text()).toBe('New York'); + }); +}); \ No newline at end of file From a10c5e342096794cc38911f76275419862c96af6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?= Date: Fri, 18 Mar 2022 14:34:14 +0300 Subject: [PATCH 04/10] OrderList tests added --- src/components/orderlist/OrderList.spec.js | 140 +++++++++++++++++++++ src/components/orderlist/OrderList.vue | 8 +- 2 files changed, 144 insertions(+), 4 deletions(-) create mode 100644 src/components/orderlist/OrderList.spec.js diff --git a/src/components/orderlist/OrderList.spec.js b/src/components/orderlist/OrderList.spec.js new file mode 100644 index 000000000..6ca3da0da --- /dev/null +++ b/src/components/orderlist/OrderList.spec.js @@ -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: ` + + ` + } + }); + }); + + 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]); + }); +}); \ No newline at end of file diff --git a/src/components/orderlist/OrderList.vue b/src/components/orderlist/OrderList.vue index 8bcd83317..4e50e7075 100755 --- a/src/components/orderlist/OrderList.vue +++ b/src/components/orderlist/OrderList.vue @@ -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]; From f7d9a40adbaf7cf1c84476e84c0b4b2a6b2117b3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?= Date: Fri, 18 Mar 2022 14:34:17 +0300 Subject: [PATCH 05/10] Create OrganizationChart.spec.js --- .../OrganizationChart.spec.js | 160 ++++++++++++++++++ 1 file changed, 160 insertions(+) create mode 100644 src/components/organizationchart/OrganizationChart.spec.js diff --git a/src/components/organizationchart/OrganizationChart.spec.js b/src/components/organizationchart/OrganizationChart.spec.js new file mode 100644 index 000000000..69b9036c6 --- /dev/null +++ b/src/components/organizationchart/OrganizationChart.spec.js @@ -0,0 +1,160 @@ +import { mount } from '@vue/test-utils'; +import OrganizationChart from './OrganizationChart.vue'; + +describe('OrganizationChart.vue', () => { + let wrapper; + + beforeEach(() => { + wrapper = mount(OrganizationChart, { + props: { + value: { + key: '0', + type: 'person', + styleClass: 'p-person', + data: {label: 'CEO', name: 'Walter White', avatar: 'walter.jpg'}, + children: [ + { + key: '0_0', + type: 'person', + styleClass: 'p-person', + data: {label: 'CFO', name:'Saul Goodman', avatar: 'saul.jpg'}, + children:[{ + key: '0_0_0', + data: {label: 'Tax'}, + selectable: false, + styleClass: 'department-cfo' + }, + { + key: '0_0_1', + data: {label: 'Legal'}, + selectable: false, + styleClass: 'department-cfo' + }], + }, + { + key: '0_1', + type: 'person', + styleClass: 'p-person', + data: {label: 'COO', name:'Mike E.', avatar: 'mike.jpg'}, + children:[{ + key: '0_1_0', + data: {label: 'Operations'}, + selectable: false, + styleClass: 'department-coo' + }] + }, + { + key: '0_2', + type: 'person', + styleClass: 'p-person', + data: {label: 'CTO', name:'Jesse Pinkman', avatar: 'jesse.jpg'}, + children:[{ + key: '0_2_0', + data: {label: 'Development'}, + selectable: false, + styleClass: 'department-cto', + children:[{ + key: '0_2_0_0', + data: {label: 'Analysis'}, + selectable: false, + styleClass: 'department-cto' + }, + { + key: '0_2_0_1', + data: {label: 'Front End'}, + selectable: false, + styleClass: 'department-cto' + }, + { + key: '0_2_0_2', + data: {label: 'Back End'}, + selectable: false, + styleClass: 'department-cto' + }] + }, + { + key: '0_2_1', + data: {label: 'QA'}, + selectable: false, + styleClass: 'department-cto' + }, + { + key: '0_2_2', + data: {label: 'R&D'}, + selectable: false, + styleClass: 'department-cto' + }] + } + ] + }, + collapsible: true, + selectionMode: 'single', + selectionKeys: {} + }, + slots: { + slots: { + default: ` + + `, + person: ` + + ` + } + } + }); + }); + + it('should exist', () => { + expect(wrapper.find('.p-organizationchart.p-component').exists()).toBe(true); + expect(wrapper.find('table.p-organizationchart-table').exists()).toBe(true); + expect(wrapper.findAll('.p-node-toggler-icon').length).toBe(5); + expect(wrapper.find('.p-node-toggler-icon').classes()).toContain('pi-chevron-down'); + }); + + it('should collapsed and expand', async () => { + await wrapper.vm.onNodeToggle(wrapper.vm.value); + + expect(wrapper.find('.p-node-toggler-icon').classes()).toContain('pi-chevron-up'); + expect(wrapper.emitted()['node-collapse'][0]).toEqual([wrapper.vm.value]); + expect(wrapper.emitted()['update:collapsedKeys'][0]).toEqual([{ '0': true }]); + expect(wrapper.vm.d_collapsedKeys).toEqual({ '0': true }); + + await wrapper.vm.onNodeToggle(wrapper.vm.value); + + expect(wrapper.find('.p-node-toggler-icon').classes()).toContain('pi-chevron-down'); + expect(wrapper.emitted()['node-expand'][0]).toEqual([wrapper.vm.value]); + expect(wrapper.emitted()['update:collapsedKeys'][0]).toEqual([{}]); + expect(wrapper.vm.d_collapsedKeys).toEqual({}); + }); + + it('should item select and unselect', async () => { + const contents = wrapper.findAll('.p-organizationchart-node-content'); + + await wrapper.vm.onNodeClick(wrapper.vm.value); + + expect(wrapper.emitted()['node-select'][0]).toEqual([wrapper.vm.value]); + expect(wrapper.emitted()['update:selectionKeys'][0]).toEqual([{ '0': true }]); + + await wrapper.setProps({ selectionKeys: { '0': true } }); + + expect(contents[0].classes()).toContain('p-highlight'); + + + await wrapper.vm.onNodeClick(wrapper.vm.value); + + expect(wrapper.emitted()['node-unselect'][0]).toEqual([wrapper.vm.value]); + expect(wrapper.emitted()['update:selectionKeys'][1]).toEqual([{}]); + + await wrapper.setProps({ selectionKeys: {} }); + + expect(contents[0].classes()).not.toContain('p-highlight'); + }); +}); \ No newline at end of file From 57dc58e326ed4ce492153fedfa06b5db8655dc2a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?= Date: Fri, 18 Mar 2022 16:11:07 +0300 Subject: [PATCH 06/10] Create OverlayPanel.spec.js --- .../overlaypanel/OverlayPanel.spec.js | 48 +++++++++++++++++++ 1 file changed, 48 insertions(+) create mode 100644 src/components/overlaypanel/OverlayPanel.spec.js diff --git a/src/components/overlaypanel/OverlayPanel.spec.js b/src/components/overlaypanel/OverlayPanel.spec.js new file mode 100644 index 000000000..94092a6ea --- /dev/null +++ b/src/components/overlaypanel/OverlayPanel.spec.js @@ -0,0 +1,48 @@ +import { mount } from '@vue/test-utils'; +import PrimeVue from '@/components/config/PrimeVue'; +import OverlayPanel from './OverlayPanel.vue'; + +describe('OverlayPanel.vue', () => { + let wrapper; + + beforeEach(async () => { + wrapper = mount(OverlayPanel, { + global: { + plugins: [PrimeVue], + stubs: { + teleport: true + } + }, + props: { + showCloseIcon: true, + ariaCloseLabel: 'exit' + }, + slots: { + default: 'PrimeVue' + } + }); + + await wrapper.vm.toggle({}, {}); + }); + + it('should exist', () => { + expect(wrapper.find('.p-overlaypanel.p-component').exists()).toBe(true); + expect(wrapper.find('.p-overlaypanel-content').exists()).toBe(true); + expect(wrapper.find('.p-overlaypanel-content').text()).toBe('PrimeVue'); + expect(wrapper.find('.p-overlaypanel-close').exists()).toBe(true); + expect(wrapper.find('.p-overlaypanel-close').attributes()['aria-label']).toBe('exit'); + console.log(wrapper.html()) + }); + + it('should toggle itself', async () => { + await wrapper.vm.toggle({}, {}); + + expect(wrapper.find('.p-overlaypanel.p-component').exists()).toBe(false); + }); + + it('should close icon work', async () => { + await wrapper.vm.hide(); + + expect(wrapper.vm.visible).toBe(false); + }); +}); \ No newline at end of file From 1c1060581d203379b671727e29861fae1e16c1ba Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?= Date: Fri, 18 Mar 2022 16:11:09 +0300 Subject: [PATCH 07/10] Create Paginator.spec.js --- src/components/paginator/Paginator.spec.js | 50 ++++++++++++++++++++++ 1 file changed, 50 insertions(+) create mode 100644 src/components/paginator/Paginator.spec.js diff --git a/src/components/paginator/Paginator.spec.js b/src/components/paginator/Paginator.spec.js new file mode 100644 index 000000000..1894fc4ab --- /dev/null +++ b/src/components/paginator/Paginator.spec.js @@ -0,0 +1,50 @@ +import { mount } from '@vue/test-utils'; +import Paginator from './Paginator.vue'; + +describe('Paginator.vue', () => { + let wrapper; + + beforeEach(() => { + wrapper = mount(Paginator, { + props: { + rows: 10, + totalRecords: 120, + rowsPerPageOptions: [10,20,30] + } + }); + }); + + it('should exist', () => { + expect(wrapper.find('.p-paginator.p-component').exists()).toBe(true); + expect(wrapper.find('.p-paginator-icon.pi-angle-double-left').exists()).toBe(true); + expect(wrapper.find('.p-paginator-icon.pi-angle-right').exists()).toBe(true); + expect(wrapper.findAll('.p-paginator-page.p-paginator-element').length).toBe(5); + expect(wrapper.find('.p-dropdown.p-component').exists()).toBe(true); + expect(wrapper.find('.p-dropdown-label').text()).toBe('10'); + expect(wrapper.find('.p-paginator-first').classes()).toContain('p-disabled'); + expect(wrapper.find('.p-paginator-prev').classes()).toContain('p-disabled'); + expect(wrapper.vm.pageCount).toBe(12); + }); + + it('show jump to the end', async () => { + await wrapper.vm.changePageToLast({ preventDefault: () => {} }); + + expect(wrapper.findAll('.p-paginator-page.p-paginator-element')[4].classes()).toContain('p-highlight'); + expect(wrapper.findAll('.p-paginator-page.p-paginator-element')[4].text()).toBe('12'); + expect(wrapper.find('.p-paginator-next').classes()).toContain('p-disabled'); + expect(wrapper.find('.p-paginator-last').classes()).toContain('p-disabled'); + }); + + it('should change row count', async () => { + await wrapper.vm.onRowChange(20); + + expect(wrapper.vm.d_rows).toBe(20); + expect(wrapper.emitted()['update:rows'][0]).toEqual([20]); + expect(wrapper.vm.pageCount).toBe(6); + + await wrapper.setProps({ rows: 20 }); + + console.log(wrapper.html()) + expect(wrapper.find('.p-dropdown-label').text()).toBe('20'); + }); +}); \ No newline at end of file From af16490a306d044fced2be720a0d1dd5dce70c49 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?= Date: Fri, 18 Mar 2022 16:11:25 +0300 Subject: [PATCH 08/10] Update Paginator.spec.js --- src/components/paginator/Paginator.spec.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/paginator/Paginator.spec.js b/src/components/paginator/Paginator.spec.js index 1894fc4ab..c010f9c00 100644 --- a/src/components/paginator/Paginator.spec.js +++ b/src/components/paginator/Paginator.spec.js @@ -44,7 +44,6 @@ describe('Paginator.vue', () => { await wrapper.setProps({ rows: 20 }); - console.log(wrapper.html()) expect(wrapper.find('.p-dropdown-label').text()).toBe('20'); }); }); \ No newline at end of file From b030d28b37dd0ecebc82ca2ccf354b6a14cfb595 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?= Date: Fri, 18 Mar 2022 16:40:46 +0300 Subject: [PATCH 09/10] Update OverlayPanel.spec.js --- src/components/overlaypanel/OverlayPanel.spec.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/overlaypanel/OverlayPanel.spec.js b/src/components/overlaypanel/OverlayPanel.spec.js index 94092a6ea..0161c3c17 100644 --- a/src/components/overlaypanel/OverlayPanel.spec.js +++ b/src/components/overlaypanel/OverlayPanel.spec.js @@ -31,7 +31,6 @@ describe('OverlayPanel.vue', () => { expect(wrapper.find('.p-overlaypanel-content').text()).toBe('PrimeVue'); expect(wrapper.find('.p-overlaypanel-close').exists()).toBe(true); expect(wrapper.find('.p-overlaypanel-close').attributes()['aria-label']).toBe('exit'); - console.log(wrapper.html()) }); it('should toggle itself', async () => { From 83c00a2181d09df860c45ab552d2743da693806b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?= Date: Fri, 18 Mar 2022 16:40:50 +0300 Subject: [PATCH 10/10] Create Panel.spec.js --- src/components/panel/Panel.spec.js | 33 ++++++++++++++++++++++++++++++ 1 file changed, 33 insertions(+) create mode 100644 src/components/panel/Panel.spec.js diff --git a/src/components/panel/Panel.spec.js b/src/components/panel/Panel.spec.js new file mode 100644 index 000000000..df58bfa7a --- /dev/null +++ b/src/components/panel/Panel.spec.js @@ -0,0 +1,33 @@ +import { mount } from '@vue/test-utils'; +import Panel from './Panel.vue'; + +describe('Panel.vue', () => { + let wrapper; + + beforeEach(() => { + wrapper = mount(Panel, { + props: { + header: 'PrimeVue' + }, + slots: { + default: '

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt

' + } + }); + }); + + it('should exist', () => { + expect(wrapper.find('.p-panel.p-component').exists()).toBe(true); + expect(wrapper.find('.p-panel-content').text()).toBe('Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt'); + expect(wrapper.find('.p-panel-title').text()).toBe('PrimeVue'); + }); + + it('should be toggleable', async () => { + await wrapper.setProps({ toggleable: true }); + + expect(wrapper.find('.p-panel.p-component').classes()).toContain('p-panel-toggleable'); + + await wrapper.vm.toggle({}); + + expect(wrapper.emitted().toggle[0]).toEqual([{originalEvent: {}, value: true}]); + }); +}); \ No newline at end of file