From 7cc139e879ac7ea912e82ea7eff14f7b67eddb4a Mon Sep 17 00:00:00 2001 From: ogerly Date: Tue, 8 Oct 2019 13:20:07 +0200 Subject: [PATCH] add test embeds and links --- webapp/components/Editor/nodes/Embed.spec.js | 5 - .../components/Embed/EmbedComponent.spec.js | 151 ++++++++++++++++++ webapp/components/Embed/EmbedComponent.vue | 2 +- 3 files changed, 152 insertions(+), 6 deletions(-) create mode 100644 webapp/components/Embed/EmbedComponent.spec.js diff --git a/webapp/components/Editor/nodes/Embed.spec.js b/webapp/components/Editor/nodes/Embed.spec.js index a2ae2e7e5..639f99338 100644 --- a/webapp/components/Editor/nodes/Embed.spec.js +++ b/webapp/components/Editor/nodes/Embed.spec.js @@ -14,11 +14,6 @@ describe('Embed.vue', () => { beforeEach(() => { propsData = {} component = new Embed() - // computed = { - // currentUser: () => { - // return { id: 'im a user', allowEmbedIframes: false } - // }, - // } Wrapper = ({ propsData }) => { return shallowMount(component.view, { propsData }) } diff --git a/webapp/components/Embed/EmbedComponent.spec.js b/webapp/components/Embed/EmbedComponent.spec.js new file mode 100644 index 000000000..46a9df1b0 --- /dev/null +++ b/webapp/components/Embed/EmbedComponent.spec.js @@ -0,0 +1,151 @@ +import { mount, createLocalVue } from '@vue/test-utils' +import Vuex from 'vuex' +import Styleguide from '@human-connection/styleguide' +import EmbedComponent from './EmbedComponent' + +let Wrapper, wrapper, propsData, getters, mocks +const someUrl = 'https://www.youtube.com/watch?v=qkdXAtO40Fo' +const localVue = createLocalVue() + +localVue.use(Vuex) +localVue.use(Styleguide) + +describe('EmbedComponent.vue', () => { + beforeEach(() => { + mocks = { + $t: a => a, + } + propsData = {} + getters = { + 'auth/user': () => { + 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 ', () => { + beforeEach(() => { + propsData.embedData = { + __typename: 'Embed', + type: 'link', + title: '👻 ✉️ Bruno... le ciel sur répondeur ! 🔮 🧠 - Clément FREZE', + author: null, + publisher: 'PeerTube.social', + date: null, + description: + 'Salut tout le monde ! Aujourd’hui, une vidéo sur le scepticisme, nous allons parler médiumnité avec le cas de Bruno CHARVET : « Bruno, un nouveau message ». Merci de rester respectueux dans les commentaires : SOURCES : Les sources des vi...', + url: 'https://peertube.social/videos/watch/f3cb1945-a8f7-481f-a465-946c6f884e50', + image: 'https://peertube.social/static/thumbnails/f3cb1945-a8f7-481f-a465-946c6f884e50.jpg', + audio: null, + video: null, + lang: 'fr', + sources: ['resource', 'oembed'], + html: null, + } + wrapper = Wrapper({ propsData }) + }) + + it.only('show the title', () => { + expect(wrapper.find('h4').text()).toBe( + '👻 ✉️ Bruno... le ciel sur répondeur ! 🔮 🧠 - Clément FREZE', + ) + }) + + it.only('show the desciption', () => { + expect(wrapper.find('.embed-content p').text()).toBe( + 'Salut tout le monde ! Aujourd’hui, une vidéo sur le scepticisme, nous allons parler médiumnité avec le cas de Bruno CHARVET : « Bruno, un nouveau message ». Merci de rester respectueux dans les commentaires : SOURCES : Les sources des vi...', + ) + }) + + it.only('show preview Images for link', () => { + expect(wrapper.find('.embed-preview-image--clickable')).toEqual({ + selector: '.embed-preview-image--clickable', + }) + }) + }) + + describe('given a href wite embed html', () => { + describe('onEmbed returned title and description', () => { + beforeEach(() => { + propsData.embedData = { + __typename: 'Embed', + title: 'Baby Loves Cat', + description: + 'She’s incapable of controlling her limbs when her kitty is around. The obsession grows every day. Ps. That’s a sleep sack she’s in. Not a starfish outfit. Al...', + } + wrapper = Wrapper({ propsData }) + }) + + it.only('show the title', () => { + expect(wrapper.find('h4').text()).toBe('Baby Loves Cat') + }) + + it.only('show the desciption', () => { + expect(wrapper.find('.embed-content p').text()).toBe( + 'She’s incapable of controlling her limbs when her kitty is around. The obsession grows every day. Ps. That’s a sleep sack she’s in. Not a starfish outfit. Al...', + ) + }) + }) + + describe('onEmbed returned embed data with html', () => { + beforeEach(() => { + propsData.embedData = { + __typename: 'Embed', + type: 'video', + title: 'Baby Loves Cat', + author: 'Merkley Family', + publisher: 'YouTube', + date: '2015-08-16T00:00:00.000Z', + description: + 'She’s incapable of controlling her limbs when her kitty is around. The obsession grows every day. Ps. That’s a sleep sack she’s in. Not a starfish outfit. Al...', + url: someUrl, + image: 'https://i.ytimg.com/vi/qkdXAtO40Fo/maxresdefault.jpg', + audio: null, + video: null, + lang: 'de', + sources: ['resource', 'oembed'], + html: + '', + } + wrapper = Wrapper({ propsData }) + }) + + it('shows a simple link when a user closes the embed preview', () => { + wrapper.find('.embed-close-button').trigger('click') + expect(wrapper.vm.showLinkOnly).toBe(true) + }) + + it.only('opens the data privacy overlay when a user clicks on the preview image', () => { + wrapper.find('.embed-preview-image--clickable').trigger('click') + expect(wrapper.vm.showOverlay).toBe(true) + }) + + it.only('click show iframe and change NOT setting permanetly', () => { + wrapper.setData({ showOverlay: true }) + wrapper.find('.ds-button-primary').trigger('click') + expect(wrapper.vm.showEmbed).toBe(true) + expect(wrapper.vm.checkedAlwaysAllowEmbeds).toBe(false) + }) + + it.only('click show iframe and change setting permanetly', () => { + wrapper.setData({ showOverlay: true }) + wrapper.find('input[type=checkbox]').trigger('click') + wrapper.find('.ds-button-primary').trigger('click') + expect(wrapper.vm.showEmbed).toBe(true) + expect(wrapper.vm.checkedAlwaysAllowEmbeds).toBe(true) + }) + + it.only('show only iframe if allowEmbedIframes true', () => { + wrapper.setData({ allowEmbedIframes: true }) + expect(wrapper.find('.embed-html')).toEqual({ selector: '.embed-html' }) + expect(wrapper.find('.embed-preview-image--clickable')).toEqual({}) + }) + }) + }) +}) diff --git a/webapp/components/Embed/EmbedComponent.vue b/webapp/components/Embed/EmbedComponent.vue index d7707d9bb..5dc8ad00c 100644 --- a/webapp/components/Embed/EmbedComponent.vue +++ b/webapp/components/Embed/EmbedComponent.vue @@ -71,7 +71,7 @@ export default { } }, created() { - if (this.embedData.options) { + if (this.currentUser.allowEmbedIframes) { this.showEmbed = this.currentUser.allowEmbedIframes this.checkedAlwaysAllowEmbeds = this.currentUser.allowEmbedIframes }