From 97699bbda6077a6f3adfb6a6f2079a0890818a5d Mon Sep 17 00:00:00 2001 From: Sam Beckham Date: Fri, 2 Aug 2019 13:11:37 +0000 Subject: Syncs the vue test utils helpers --- spec/frontend/helpers/vue_test_utils_helper.js | 18 +++++++- .../frontend/helpers/vue_test_utils_helper_spec.js | 48 ++++++++++++++++++++++ spec/javascripts/helpers/vue_test_utils_helper.js | 38 ++--------------- .../helpers/vue_test_utils_helper_spec.js | 48 ---------------------- 4 files changed, 68 insertions(+), 84 deletions(-) create mode 100644 spec/frontend/helpers/vue_test_utils_helper_spec.js delete mode 100644 spec/javascripts/helpers/vue_test_utils_helper_spec.js diff --git a/spec/frontend/helpers/vue_test_utils_helper.js b/spec/frontend/helpers/vue_test_utils_helper.js index 121e99c9783..68326e37ae7 100644 --- a/spec/frontend/helpers/vue_test_utils_helper.js +++ b/spec/frontend/helpers/vue_test_utils_helper.js @@ -1,5 +1,3 @@ -/* eslint-disable import/prefer-default-export */ - const vNodeContainsText = (vnode, text) => (vnode.text && vnode.text.includes(text)) || (vnode.children && vnode.children.filter(child => vNodeContainsText(child, text)).length); @@ -19,3 +17,19 @@ export const shallowWrapperContainsSlotText = (shallowWrapper, slotName, text) = Boolean( shallowWrapper.vm.$slots[slotName].filter(vnode => vNodeContainsText(vnode, text)).length, ); + +/** + * Returns a promise that waits for a mutation to be fired before resolving + * NOTE: There's no reject action here so it will hang if it waits for a mutation that won't happen. + * @param {Object} store - The Vue store that contains the mutations + * @param {String} expectedMutationType - The Mutation to wait for + */ +export const waitForMutation = (store, expectedMutationType) => + new Promise(resolve => { + const unsubscribe = store.subscribe(mutation => { + if (mutation.type === expectedMutationType) { + unsubscribe(); + resolve(); + } + }); + }); diff --git a/spec/frontend/helpers/vue_test_utils_helper_spec.js b/spec/frontend/helpers/vue_test_utils_helper_spec.js new file mode 100644 index 00000000000..41714066da5 --- /dev/null +++ b/spec/frontend/helpers/vue_test_utils_helper_spec.js @@ -0,0 +1,48 @@ +import { shallowMount } from '@vue/test-utils'; +import { shallowWrapperContainsSlotText } from './vue_test_utils_helper'; + +describe('Vue test utils helpers', () => { + describe('shallowWrapperContainsSlotText', () => { + const mockText = 'text'; + const mockSlot = `
${mockText}
`; + let mockComponent; + + beforeEach(() => { + mockComponent = shallowMount( + { + render(h) { + h(`
mockedComponent
`); + }, + }, + { + slots: { + default: mockText, + namedSlot: mockSlot, + }, + }, + ); + }); + + it('finds text within shallowWrapper default slot', () => { + expect(shallowWrapperContainsSlotText(mockComponent, 'default', mockText)).toBe(true); + }); + + it('finds text within shallowWrapper named slot', () => { + expect(shallowWrapperContainsSlotText(mockComponent, 'namedSlot', mockText)).toBe(true); + }); + + it('returns false when text is not present', () => { + const searchText = 'absent'; + + expect(shallowWrapperContainsSlotText(mockComponent, 'default', searchText)).toBe(false); + expect(shallowWrapperContainsSlotText(mockComponent, 'namedSlot', searchText)).toBe(false); + }); + + it('searches with case-sensitivity', () => { + const searchText = mockText.toUpperCase(); + + expect(shallowWrapperContainsSlotText(mockComponent, 'default', searchText)).toBe(false); + expect(shallowWrapperContainsSlotText(mockComponent, 'namedSlot', searchText)).toBe(false); + }); + }); +}); diff --git a/spec/javascripts/helpers/vue_test_utils_helper.js b/spec/javascripts/helpers/vue_test_utils_helper.js index 68326e37ae7..5b749b11246 100644 --- a/spec/javascripts/helpers/vue_test_utils_helper.js +++ b/spec/javascripts/helpers/vue_test_utils_helper.js @@ -1,35 +1,5 @@ -const vNodeContainsText = (vnode, text) => - (vnode.text && vnode.text.includes(text)) || - (vnode.children && vnode.children.filter(child => vNodeContainsText(child, text)).length); +// No new code should be added to this file. Instead, modify the +// file this one re-exports from. For more detail about why, see: +// https://gitlab.com/gitlab-org/gitlab-ce/merge_requests/31349 -/** - * Determines whether a `shallowMount` Wrapper contains text - * within one of it's slots. This will also work on Wrappers - * acquired with `find()`, but only if it's parent Wrapper - * was shallowMounted. - * NOTE: Prefer checking the rendered output of a component - * wherever possible using something like `text()` instead. - * @param {Wrapper} shallowWrapper - Vue test utils wrapper (shallowMounted) - * @param {String} slotName - * @param {String} text - */ -export const shallowWrapperContainsSlotText = (shallowWrapper, slotName, text) => - Boolean( - shallowWrapper.vm.$slots[slotName].filter(vnode => vNodeContainsText(vnode, text)).length, - ); - -/** - * Returns a promise that waits for a mutation to be fired before resolving - * NOTE: There's no reject action here so it will hang if it waits for a mutation that won't happen. - * @param {Object} store - The Vue store that contains the mutations - * @param {String} expectedMutationType - The Mutation to wait for - */ -export const waitForMutation = (store, expectedMutationType) => - new Promise(resolve => { - const unsubscribe = store.subscribe(mutation => { - if (mutation.type === expectedMutationType) { - unsubscribe(); - resolve(); - } - }); - }); +export * from '../../frontend/helpers/vue_test_utils_helper'; diff --git a/spec/javascripts/helpers/vue_test_utils_helper_spec.js b/spec/javascripts/helpers/vue_test_utils_helper_spec.js deleted file mode 100644 index 41714066da5..00000000000 --- a/spec/javascripts/helpers/vue_test_utils_helper_spec.js +++ /dev/null @@ -1,48 +0,0 @@ -import { shallowMount } from '@vue/test-utils'; -import { shallowWrapperContainsSlotText } from './vue_test_utils_helper'; - -describe('Vue test utils helpers', () => { - describe('shallowWrapperContainsSlotText', () => { - const mockText = 'text'; - const mockSlot = `
${mockText}
`; - let mockComponent; - - beforeEach(() => { - mockComponent = shallowMount( - { - render(h) { - h(`
mockedComponent
`); - }, - }, - { - slots: { - default: mockText, - namedSlot: mockSlot, - }, - }, - ); - }); - - it('finds text within shallowWrapper default slot', () => { - expect(shallowWrapperContainsSlotText(mockComponent, 'default', mockText)).toBe(true); - }); - - it('finds text within shallowWrapper named slot', () => { - expect(shallowWrapperContainsSlotText(mockComponent, 'namedSlot', mockText)).toBe(true); - }); - - it('returns false when text is not present', () => { - const searchText = 'absent'; - - expect(shallowWrapperContainsSlotText(mockComponent, 'default', searchText)).toBe(false); - expect(shallowWrapperContainsSlotText(mockComponent, 'namedSlot', searchText)).toBe(false); - }); - - it('searches with case-sensitivity', () => { - const searchText = mockText.toUpperCase(); - - expect(shallowWrapperContainsSlotText(mockComponent, 'default', searchText)).toBe(false); - expect(shallowWrapperContainsSlotText(mockComponent, 'namedSlot', searchText)).toBe(false); - }); - }); -}); -- cgit v1.2.1