diff --git a/webapp/components/Badges.spec.js b/webapp/components/Badges.spec.js index f81eaafb1..d19c2beb2 100644 --- a/webapp/components/Badges.spec.js +++ b/webapp/components/Badges.spec.js @@ -14,7 +14,7 @@ describe('Badges.vue', () => { } it('has class "hc-badges"', () => { - expect(Wrapper().contains('.hc-badges')).toBe(true) + expect(Wrapper().find('.hc-badges').exists()).toBe(true) }) describe('given a badge', () => { @@ -23,7 +23,7 @@ describe('Badges.vue', () => { }) it('proxies badge icon, which is just a URL without metadata', () => { - expect(Wrapper().contains('img[src="/api/path/to/some/icon"]')).toBe(true) + expect(Wrapper().find('img[src="/api/path/to/some/icon"]').exists()).toBe(true) }) }) }) diff --git a/webapp/components/Category/index.spec.js b/webapp/components/Category/index.spec.js index 9abb8a11d..22a85f6f1 100644 --- a/webapp/components/Category/index.spec.js +++ b/webapp/components/Category/index.spec.js @@ -1,4 +1,4 @@ -import { shallowMount } from '@vue/test-utils' +import { mount } from '@vue/test-utils' import Category from './index' @@ -9,7 +9,7 @@ describe('Category', () => { let name const Wrapper = () => { - return shallowMount(Category, { + return mount(Category, { localVue, propsData: { icon, @@ -27,8 +27,9 @@ describe('Category', () => { it('shows Name', () => { expect(Wrapper().text()).toContain('Peter') }) - it('shows Icon Svg', () => { - expect(Wrapper().contains('svg')) + + it('shows base icon', () => { + expect(Wrapper().find('.base-icon').exists()).toBe(true) }) }) }) diff --git a/webapp/components/ContentMenu/GroupContentMenu.spec.js b/webapp/components/ContentMenu/GroupContentMenu.spec.js index 8b17b24b1..49a66aaac 100644 --- a/webapp/components/ContentMenu/GroupContentMenu.spec.js +++ b/webapp/components/ContentMenu/GroupContentMenu.spec.js @@ -1,9 +1,13 @@ -import { config, mount } from '@vue/test-utils' +import { mount } from '@vue/test-utils' import GroupContentMenu from './GroupContentMenu.vue' const localVue = global.localVue -config.stubs['router-link'] = '' +const stubs = { + 'router-link': { + template: '', + }, +} const propsData = { usage: 'groupTeaser', @@ -24,7 +28,7 @@ describe('GroupContentMenu', () => { describe('mount', () => { const Wrapper = () => { - return mount(GroupContentMenu, { propsData, mocks, localVue }) + return mount(GroupContentMenu, { propsData, mocks, localVue, stubs }) } beforeEach(() => { diff --git a/webapp/components/ContributionForm/ContributionForm.spec.js b/webapp/components/ContributionForm/ContributionForm.spec.js index 8ebd7d4de..ef3b47c37 100644 --- a/webapp/components/ContributionForm/ContributionForm.spec.js +++ b/webapp/components/ContributionForm/ContributionForm.spec.js @@ -166,7 +166,7 @@ describe('ContributionForm.vue', () => { .mockImplementation(function () { this.onload({ target: { result: 'someUrlToImage' } }) }) - wrapper.find(ImageUploader).vm.$emit('addHeroImage', imageUpload) + wrapper.findComponent(ImageUploader).vm.$emit('addHeroImage', imageUpload) await wrapper.find('form').trigger('submit') expect(mocks.$apollo.mutate).toHaveBeenCalledWith(expect.objectContaining(expectedParams)) expect(spy).toHaveBeenCalledWith(imageUpload) diff --git a/webapp/components/Editor/nodes/Embed.spec.js b/webapp/components/Editor/nodes/Embed.spec.js index 372b189f9..05edb1296 100644 --- a/webapp/components/Editor/nodes/Embed.spec.js +++ b/webapp/components/Editor/nodes/Embed.spec.js @@ -42,7 +42,7 @@ describe('Embed.vue', () => { propsData.node = { attrs: { href: 'https://www.youtube.com/watch?v=qkdXAtO40Fo' } } const wrapper = Wrapper({ propsData }) await wrapper.html() - expect(wrapper.contains('embed-component-stub')).toBe(true) + expect(wrapper.find('embed-component-stub').exists()).toBe(true) }) }) diff --git a/webapp/components/InviteButton/InviteButton.spec.js b/webapp/components/InviteButton/InviteButton.spec.js index fde1afd1d..cb73ecfd1 100644 --- a/webapp/components/InviteButton/InviteButton.spec.js +++ b/webapp/components/InviteButton/InviteButton.spec.js @@ -2,7 +2,9 @@ import { mount } from '@vue/test-utils' import InviteButton from './InviteButton.vue' const stubs = { - 'v-popover': true, + 'v-popover': { + template: '', + }, } describe('InviteButton.vue', () => { @@ -32,12 +34,12 @@ describe('InviteButton.vue', () => { }) it('renders', () => { - expect(wrapper.contains('.invite-button')).toBe(true) + expect(wrapper.find('.invite-button').exists()).toBe(true) }) it('open popup', () => { wrapper.find('.base-button').trigger('click') - expect(wrapper.contains('.invite-button')).toBe(true) + expect(wrapper.find('.invite-button').exists()).toBe(true) }) it('invite codes not available', async () => { diff --git a/webapp/components/LoginButton/LoginButton.spec.js b/webapp/components/LoginButton/LoginButton.spec.js index c288b73d3..d529dbfb6 100644 --- a/webapp/components/LoginButton/LoginButton.spec.js +++ b/webapp/components/LoginButton/LoginButton.spec.js @@ -3,6 +3,7 @@ import LoginButton from './LoginButton.vue' const stubs = { 'v-popover': true, + 'nuxt-link': true, } describe('LoginButton.vue', () => { @@ -32,12 +33,12 @@ describe('LoginButton.vue', () => { }) it('renders', () => { - expect(wrapper.contains('.login-button')).toBe(true) + expect(wrapper.find('.login-button').exists()).toBe(true) }) it('open popup', () => { wrapper.find('.base-button').trigger('click') - expect(wrapper.contains('.login-button')).toBe(true) + expect(wrapper.find('.login-button').exists()).toBe(true) }) }) }) diff --git a/webapp/components/Modal.spec.js b/webapp/components/Modal.spec.js index c08c90f51..037e84497 100644 --- a/webapp/components/Modal.spec.js +++ b/webapp/components/Modal.spec.js @@ -57,9 +57,9 @@ describe('Modal.vue', () => { it('initially empty', () => { wrapper = Wrapper() - expect(wrapper.contains(ConfirmModal)).toBe(false) - expect(wrapper.contains(DisableModal)).toBe(false) - expect(wrapper.contains(ReportModal)).toBe(false) + expect(wrapper.findComponent(ConfirmModal).exists()).toBe(false) + expect(wrapper.findComponent(DisableModal).exists()).toBe(false) + expect(wrapper.findComponent(ReportModal).exists()).toBe(false) }) describe('store/modal holds data to disable', () => { @@ -78,11 +78,11 @@ describe('Modal.vue', () => { }) it('renders disable modal', () => { - expect(wrapper.contains(DisableModal)).toBe(true) + expect(wrapper.findComponent(DisableModal).exists()).toBe(true) }) it('passes data to disable modal', () => { - expect(wrapper.find(DisableModal).props()).toEqual({ + expect(wrapper.findComponent(DisableModal).props()).toEqual({ type: 'contribution', name: 'some title', id: 'c456', @@ -91,9 +91,9 @@ describe('Modal.vue', () => { describe('child component emits close', () => { it('turns empty', async () => { - wrapper.find(DisableModal).vm.$emit('close') + wrapper.findComponent(DisableModal).vm.$emit('close') await Vue.nextTick() - expect(wrapper.contains(DisableModal)).toBe(false) + expect(wrapper.findComponent(DisableModal).exists()).toBe(false) }) }) @@ -109,7 +109,7 @@ describe('Modal.vue', () => { }, } wrapper = Wrapper() - expect(wrapper.find(DisableModal).props()).toEqual({ + expect(wrapper.findComponent(DisableModal).props()).toEqual({ type: 'comment', name: 'Author name', id: 'c456', @@ -124,7 +124,7 @@ describe('Modal.vue', () => { }, } wrapper = Wrapper() - expect(wrapper.find(DisableModal).props()).toEqual({ + expect(wrapper.findComponent(DisableModal).props()).toEqual({ type: 'comment', name: '', id: 'c456', @@ -142,7 +142,7 @@ describe('Modal.vue', () => { }, } wrapper = Wrapper() - expect(wrapper.find(DisableModal).props()).toEqual({ + expect(wrapper.findComponent(DisableModal).props()).toEqual({ type: 'user', name: 'Username', id: 'u456', @@ -160,7 +160,7 @@ describe('Modal.vue', () => { }, } wrapper = Wrapper() - expect(wrapper.find(DisableModal).props()).toEqual({ + expect(wrapper.findComponent(DisableModal).props()).toEqual({ type: 'something', name: null, id: 's456', diff --git a/webapp/components/NotificationList/NotificationList.spec.js b/webapp/components/NotificationList/NotificationList.spec.js index 4c6d3690a..7f7038d59 100644 --- a/webapp/components/NotificationList/NotificationList.spec.js +++ b/webapp/components/NotificationList/NotificationList.spec.js @@ -52,7 +52,7 @@ describe('NotificationList.vue', () => { }) it('renders Notification.vue for each notification of the user', () => { - expect(wrapper.findAll(Notification)).toHaveLength(2) + expect(wrapper.findAllComponents(Notification)).toHaveLength(2) }) }) @@ -97,7 +97,7 @@ describe('NotificationList.vue', () => { }) it('renders Notification.vue zero times', () => { - expect(wrapper.findAll(Notification)).toHaveLength(0) + expect(wrapper.findAllComponents(Notification)).toHaveLength(0) }) }) }) diff --git a/webapp/components/PasswordReset/Request.spec.js b/webapp/components/PasswordReset/Request.spec.js index a30ba70b4..50d6495bd 100644 --- a/webapp/components/PasswordReset/Request.spec.js +++ b/webapp/components/PasswordReset/Request.spec.js @@ -22,7 +22,7 @@ describe('Request', () => { }, } stubs = { - LocaleSwitch: "
", + LocaleSwitch: true, 'sweetalert-icon': true, 'client-only': true, 'nuxt-link': true, diff --git a/webapp/components/_new/generic/CounterIcon/CounterIcon.spec.js b/webapp/components/_new/generic/CounterIcon/CounterIcon.spec.js index 49be22bde..584a971c4 100644 --- a/webapp/components/_new/generic/CounterIcon/CounterIcon.spec.js +++ b/webapp/components/_new/generic/CounterIcon/CounterIcon.spec.js @@ -19,7 +19,7 @@ describe('CounterIcon.vue', () => { }) it('renders the icon', () => { - expect(wrapper.find(BaseIcon).exists()).toBe(true) + expect(wrapper.findComponent(BaseIcon).exists()).toBe(true) }) it('renders the count', () => { @@ -35,7 +35,7 @@ describe('CounterIcon.vue', () => { }) it('renders the icon', () => { - expect(wrapper.find(BaseIcon).exists()).toBe(true) + expect(wrapper.findComponent(BaseIcon).exists()).toBe(true) }) it('renders the capped count with a plus', () => { diff --git a/webapp/components/_new/generic/ProfileAvatar/ProfileAvatar.spec.js b/webapp/components/_new/generic/ProfileAvatar/ProfileAvatar.spec.js index 44d35bd71..413af5047 100644 --- a/webapp/components/_new/generic/ProfileAvatar/ProfileAvatar.spec.js +++ b/webapp/components/_new/generic/ProfileAvatar/ProfileAvatar.spec.js @@ -20,7 +20,7 @@ describe('ProfileAvatar', () => { }) it('renders an icon', () => { - expect(wrapper.find(BaseIcon).exists()).toBe(true) + expect(wrapper.findComponent(BaseIcon).exists()).toBe(true) }) describe('given a profile', () => { @@ -38,7 +38,7 @@ describe('ProfileAvatar', () => { it('renders an icon', () => { propsData = { profile: { name: null } } wrapper = Wrapper() - expect(wrapper.find(BaseIcon).exists()).toBe(true) + expect(wrapper.findComponent(BaseIcon).exists()).toBe(true) }) }) @@ -46,7 +46,7 @@ describe('ProfileAvatar', () => { it('renders an icon', () => { propsData = { profile: { name: 'Anonymous' } } wrapper = Wrapper() - expect(wrapper.find(BaseIcon).exists()).toBe(true) + expect(wrapper.findComponent(BaseIcon).exists()).toBe(true) }) }) diff --git a/webapp/components/features/ReportList/ReportList.spec.js b/webapp/components/features/ReportList/ReportList.spec.js index 84848ce82..17c609115 100644 --- a/webapp/components/features/ReportList/ReportList.spec.js +++ b/webapp/components/features/ReportList/ReportList.spec.js @@ -56,11 +56,11 @@ describe('ReportList', () => { }) it('renders DropdownFilter', () => { - expect(wrapper.find(DropdownFilter).exists()).toBe(true) + expect(wrapper.findComponent(DropdownFilter).exists()).toBe(true) }) it('renders ReportsTable', () => { - expect(wrapper.find(ReportsTable).exists()).toBe(true) + expect(wrapper.findComponent(ReportsTable).exists()).toBe(true) }) }) @@ -68,7 +68,7 @@ describe('ReportList', () => { beforeEach(async () => { wrapper = Wrapper() wrapper.setData({ reports }) - wrapper.find(ReportsTable).vm.$emit('confirm', reports[0]) + wrapper.findComponent(ReportsTable).vm.$emit('confirm', reports[0]) }) it('calls modal/SET_OPEN', () => { diff --git a/webapp/components/features/ReportRow/ReportRow.spec.js b/webapp/components/features/ReportRow/ReportRow.spec.js index 6a4bf922e..a1b405edc 100644 --- a/webapp/components/features/ReportRow/ReportRow.spec.js +++ b/webapp/components/features/ReportRow/ReportRow.spec.js @@ -84,7 +84,9 @@ describe('ReportRow', () => { wrapper = Wrapper() }) it('renders the disabled icon', () => { - expect(wrapper.find('.status-line').find(BaseIcon).props().name).toEqual('eye-slash') + expect(wrapper.find('.status-line').findComponent(BaseIcon).props().name).toEqual( + 'eye-slash', + ) }) it('renders its current status', () => { @@ -98,7 +100,7 @@ describe('ReportRow', () => { wrapper = Wrapper() }) it('renders the enabled icon', () => { - expect(wrapper.find('.status-line').find(BaseIcon).props().name).toEqual('eye') + expect(wrapper.find('.status-line').findComponent(BaseIcon).props().name).toEqual('eye') }) it('renders its current status', () => { @@ -119,7 +121,7 @@ describe('ReportRow', () => { }) it('renders a comments icon', () => { - const commentsIcon = wrapper.find(BaseIcon).props().name + const commentsIcon = wrapper.findComponent(BaseIcon).props().name expect(commentsIcon).toEqual('comments') }) @@ -141,7 +143,7 @@ describe('ReportRow', () => { }) it('renders a bookmark icon', () => { - const postIcon = wrapper.find(BaseIcon).props().name + const postIcon = wrapper.findComponent(BaseIcon).props().name expect(postIcon).toEqual('bookmark') }) @@ -163,7 +165,7 @@ describe('ReportRow', () => { }) it('renders a user icon', () => { - const userIcon = wrapper.find(BaseIcon).props().name + const userIcon = wrapper.findComponent(BaseIcon).props().name expect(userIcon).toEqual('user') }) diff --git a/webapp/components/features/SearchField/SearchField.spec.js b/webapp/components/features/SearchField/SearchField.spec.js index ec5276212..e66c31938 100644 --- a/webapp/components/features/SearchField/SearchField.spec.js +++ b/webapp/components/features/SearchField/SearchField.spec.js @@ -36,7 +36,7 @@ describe('SearchField.vue', () => { describe('Emitted events', () => { let searchableInputComponent beforeEach(() => { - searchableInputComponent = wrapper.find(SearchableInput) + searchableInputComponent = wrapper.findComponent(SearchableInput) }) describe('query event', () => {