Fix lint, update tests

- to remove vue warnings
- favor one expectation per it block
This commit is contained in:
mattwr18 2019-10-08 20:47:13 +02:00
parent 3c04e1a328
commit bced6983ea
3 changed files with 117 additions and 73 deletions

View File

@ -2,10 +2,7 @@ import fs from 'fs'
import path from 'path' import path from 'path'
import minimatch from 'minimatch' import minimatch from 'minimatch'
let oEmbedProvidersFile = fs.readFileSync( let oEmbedProvidersFile = fs.readFileSync(path.join(__dirname, './providers.json'), 'utf8')
path.join(__dirname, './providers.json'),
'utf8',
)
// some providers allow a format parameter // some providers allow a format parameter
// we need JSON // we need JSON

View File

@ -3,7 +3,7 @@ import Vuex from 'vuex'
import Styleguide from '@human-connection/styleguide' import Styleguide from '@human-connection/styleguide'
import EmbedComponent from './EmbedComponent' import EmbedComponent from './EmbedComponent'
let Wrapper, wrapper, propsData, getters, mocks let wrapper, propsData, getters, mocks
const someUrl = 'https://www.youtube.com/watch?v=qkdXAtO40Fo' const someUrl = 'https://www.youtube.com/watch?v=qkdXAtO40Fo'
const localVue = createLocalVue() const localVue = createLocalVue()
@ -11,9 +11,25 @@ localVue.use(Vuex)
localVue.use(Styleguide) localVue.use(Styleguide)
describe('EmbedComponent.vue', () => { describe('EmbedComponent.vue', () => {
const Wrapper = () => {
const store = new Vuex.Store({
getters,
})
return mount(EmbedComponent, { propsData, localVue, store, mocks })
}
beforeEach(() => { beforeEach(() => {
mocks = { mocks = {
$t: a => a, $t: a => a,
$apollo: {
mutate: jest
.fn()
.mockResolvedValueOnce({ data: { UpdateUser: { allowEmbedIframes: true } } }),
},
$toast: {
success: jest.fn(),
error: jest.fn(),
},
} }
propsData = {} propsData = {}
getters = { getters = {
@ -21,12 +37,6 @@ describe('EmbedComponent.vue', () => {
return { id: 'u5', allowEmbedIframes: false } return { id: 'u5', allowEmbedIframes: false }
}, },
} }
Wrapper = ({ propsData }) => {
const store = new Vuex.Store({
getters,
})
return mount(EmbedComponent, { propsData, localVue, store, mocks })
}
}) })
describe('given a href only for a link ', () => { describe('given a href only for a link ', () => {
@ -48,7 +58,7 @@ describe('EmbedComponent.vue', () => {
sources: ['resource', 'oembed'], sources: ['resource', 'oembed'],
html: null, html: null,
} }
wrapper = Wrapper({ propsData }) wrapper = Wrapper()
}) })
it('shows the title', () => { it('shows the title', () => {
@ -64,12 +74,8 @@ describe('EmbedComponent.vue', () => {
}) })
it('shows preview Images for link', () => { it('shows preview Images for link', () => {
expect(wrapper.find('.embed-preview-image--clickable')).toEqual({ expect(wrapper.find('.embed-preview-image').exists()).toBe(true)
selector: '.embed-preview-image--clickable',
})
}) })
}) })
describe('given a href with embed html', () => { describe('given a href with embed html', () => {
@ -81,7 +87,7 @@ describe('EmbedComponent.vue', () => {
description: description:
'Shes incapable of controlling her limbs when her kitty is around. The obsession grows every day. Ps. Thats a sleep sack shes in. Not a starfish outfit. Al...', 'Shes incapable of controlling her limbs when her kitty is around. The obsession grows every day. Ps. Thats a sleep sack shes in. Not a starfish outfit. Al...',
} }
wrapper = Wrapper({ propsData }) wrapper = Wrapper()
}) })
it('show the title', () => { it('show the title', () => {
@ -94,67 +100,107 @@ describe('EmbedComponent.vue', () => {
) )
}) })
describe('onEmbed returned embed data with html', () => { describe('onEmbed returned embed data with html', () => {
beforeEach(() => { beforeEach(() => {
propsData.embedData = { propsData.embedData = {
__typename: 'Embed', __typename: 'Embed',
type: 'video', type: 'video',
title: 'Baby Loves Cat', title: 'Baby Loves Cat',
author: 'Merkley Family', author: 'Merkley Family',
publisher: 'YouTube', publisher: 'YouTube',
date: '2015-08-16T00:00:00.000Z', date: '2015-08-16T00:00:00.000Z',
description: description:
'Shes incapable of controlling her limbs when her kitty is around. The obsession grows every day. Ps. Thats a sleep sack shes in. Not a starfish outfit. Al...', 'Shes incapable of controlling her limbs when her kitty is around. The obsession grows every day. Ps. Thats a sleep sack shes in. Not a starfish outfit. Al...',
url: someUrl, url: someUrl,
image: 'https://i.ytimg.com/vi/qkdXAtO40Fo/maxresdefault.jpg', image: 'https://i.ytimg.com/vi/qkdXAtO40Fo/maxresdefault.jpg',
audio: null, audio: null,
video: null, video: null,
lang: 'de', lang: 'de',
sources: ['resource', 'oembed'], sources: ['resource', 'oembed'],
html: html:
'<iframe width="480" height="270" src="https://www.youtube.com/embed/qkdXAtO40Fo?feature=oembed" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>', '<iframe width="480" height="270" src="https://www.youtube.com/embed/qkdXAtO40Fo?feature=oembed" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe>',
} }
wrapper = Wrapper({ propsData }) wrapper = Wrapper()
}) })
it('shows a simple link when a user closes the embed preview', () => { it('shows a simple link when a user closes the embed preview', () => {
wrapper.find('.embed-close-button').trigger('click') wrapper.find('.embed-close-button').trigger('click')
expect(wrapper.vm.showLinkOnly).toBe(true) expect(wrapper.vm.showLinkOnly).toBe(true)
}) })
it('opens the data privacy overlay when a user clicks on the preview image', () => { it('opens the data privacy overlay when a user clicks on the preview image', () => {
wrapper.find('.embed-preview-image--clickable').trigger('click') wrapper.find('.embed-preview-image--clickable').trigger('click')
expect(wrapper.vm.showOverlay).toBe(true) expect(wrapper.vm.showOverlay).toBe(true)
}) })
it("click show iframe, but don't select to change setting permanetly", () => { describe('shows iframe', () => {
wrapper.setData({ showOverlay: true }) beforeEach(() => {
wrapper.find('.ds-button-primary').trigger('click') wrapper.setData({ showOverlay: true })
expect(wrapper.vm.showEmbed).toBe(true) })
expect(wrapper.vm.checkedAlwaysAllowEmbeds).toBe(false)
})
it('click show iframe and change setting permanetly', () => { it('when user agress', () => {
wrapper.setData({ showOverlay: true }) wrapper.find('.ds-button-primary').trigger('click')
wrapper.find('input[type=checkbox]').trigger('click') expect(wrapper.vm.showEmbed).toBe(true)
wrapper.find('.ds-button-primary').trigger('click') })
expect(wrapper.vm.showEmbed).toBe(true)
expect(wrapper.vm.checkedAlwaysAllowEmbeds).toBe(true)
})
it('click cancel do not show iframe', () => { it('does not show iframe when user clicks to cancel', () => {
wrapper.setData({ showOverlay: true }) wrapper.find('.ds-button-ghost').trigger('click')
wrapper.find('.ds-button-ghost').trigger('click') expect(wrapper.vm.showEmbed).toBe(false)
expect(wrapper.vm.showOverlay).toBe(false) })
expect(wrapper.vm.showEmbed).toBe(false)
})
it('show only iframe if allowEmbedIframes true', () => { describe("doesn't set permanently", () => {
wrapper.setData({ allowEmbedIframes: true }) beforeEach(() => {
expect(wrapper.find('.embed-html')).toEqual({ selector: '.embed-html' }) wrapper.find('.ds-button-primary').trigger('click')
expect(wrapper.find('.embed-preview-image--clickable')).toEqual({}) })
it("if user doesn't give consent", () => {
expect(wrapper.vm.checkedAlwaysAllowEmbeds).toBe(false)
})
it("doesn't update the user's profile", () => {
expect(mocks.$apollo.mutate).not.toHaveBeenCalled()
})
})
describe('sets permanently', () => {
beforeEach(() => {
wrapper.find('input[type=checkbox]').trigger('click')
wrapper.find('.ds-button-primary').trigger('click')
})
it('changes setting permanetly when user requests', () => {
expect(wrapper.vm.checkedAlwaysAllowEmbeds).toBe(true)
})
it("updates the user's profile", () => {
expect(mocks.$apollo.mutate).toHaveBeenCalledTimes(1)
})
})
})
describe('immediately shows', () => {
beforeEach(() => {
getters = {
'auth/user': () => {
return { id: 'u5', allowEmbedIframes: true }
},
}
wrapper = Wrapper()
})
it('sets showEmbed to true', () => {
expect(wrapper.vm.showEmbed).toBe(true)
})
it('the iframe returned from oEmbed', () => {
expect(wrapper.find('iframe').html()).toEqual(propsData.embedData.html)
})
it('does not display image to click', () => {
expect(wrapper.find('.embed-preview-image--clickable').exists()).toBe(false)
})
})
}) })
}) })
})
}) })
}) })

View File

@ -145,6 +145,7 @@ export default {
this.$toast.success(this.$t('contribution.success')) this.$toast.success(this.$t('contribution.success'))
this.showEmbed = this.currentUser.allowEmbedIframes this.showEmbed = this.currentUser.allowEmbedIframes
} catch (err) { } catch (err) {
console.log(err)
this.$toast.error(err.message) this.$toast.error(err.message)
} }
}, },