import { mount, shallowMount, createLocalVue } from '@vue/test-utils' import RichContent from 'src/components/rich_content/rich_content.jsx' const localVue = createLocalVue() const attentions = [] const makeMention = (who) => { attentions.push({ statusnet_profile_url: `https://fake.tld/@${who}` }) return `@${who}` } const p = (...data) => `

${data.join('')}

` const compwrap = (...data) => `${data.join('')}` const mentionsLine = (times) => [ '' ].join('') describe('RichContent', () => { it('renders simple post without exploding', () => { const html = p('Hello world!') const wrapper = shallowMount(RichContent, { localVue, propsData: { attentions, handleLinks: true, greentext: true, emoji: [], html } }) expect(wrapper.html()).to.eql(compwrap(html)) }) it('unescapes everything as needed', () => { const html = [ p('Testing 'em all'), 'Testing 'em all' ].join('') const expected = [ p('Testing \'em all'), 'Testing \'em all' ].join('') const wrapper = shallowMount(RichContent, { localVue, propsData: { attentions, handleLinks: true, greentext: true, emoji: [], html } }) expect(wrapper.html()).to.eql(compwrap(expected)) }) it('replaces first mention with mentionsline', () => { const html = p( makeMention('John'), ' how are you doing today?' ) const wrapper = shallowMount(RichContent, { localVue, propsData: { attentions, handleLinks: true, greentext: true, emoji: [], html } }) expect(wrapper.html()).to.eql(compwrap(p( mentionsLine(1), ' how are you doing today?' ))) }) it('replaces mentions at the end of the hellpost', () => { const html = [ p('How are you doing today, fine gentlemen?'), p( makeMention('John'), makeMention('Josh'), makeMention('Jeremy') ) ].join('') const expected = [ p( 'How are you doing today, fine gentlemen?' ), // TODO fix this extra line somehow? p( '' ) ].join('') const wrapper = shallowMount(RichContent, { localVue, propsData: { attentions, handleLinks: true, greentext: true, emoji: [], html } }) expect(wrapper.html()).to.eql(compwrap(expected)) }) it('Does not touch links if link handling is disabled', () => { const html = [ [ makeMention('Jack'), 'let\'s meet up with ', makeMention('Janet') ].join(''), [ makeMention('John'), makeMention('Josh'), makeMention('Jeremy') ].join('') ].join('\n') const wrapper = shallowMount(RichContent, { localVue, propsData: { attentions, handleLinks: false, greentext: true, emoji: [], html } }) expect(wrapper.html()).to.eql(compwrap(html)) }) it('Adds greentext and cyantext to the post', () => { const html = [ '>preordering videogames', '>any year' ].join('\n') const expected = [ '>preordering videogames', '>any year' ].join('\n') const wrapper = shallowMount(RichContent, { localVue, propsData: { attentions, handleLinks: false, greentext: true, emoji: [], html } }) expect(wrapper.html()).to.eql(compwrap(expected)) }) it('Does not add greentext and cyantext if setting is set to false', () => { const html = [ '>preordering videogames', '>any year' ].join('\n') const wrapper = shallowMount(RichContent, { localVue, propsData: { attentions, handleLinks: false, greentext: false, emoji: [], html } }) expect(wrapper.html()).to.eql(compwrap(html)) }) it('Adds emoji to post', () => { const html = p('Ebin :DDDD :spurdo:') const expected = p( 'Ebin :DDDD ', '' ) const wrapper = shallowMount(RichContent, { localVue, propsData: { attentions, handleLinks: false, greentext: false, emoji: [{ url: 'about:blank', shortcode: 'spurdo' }], html } }) expect(wrapper.html()).to.eql(compwrap(expected)) }) it('Doesn\'t add nonexistent emoji to post', () => { const html = p('Lol :lol:') const wrapper = shallowMount(RichContent, { localVue, propsData: { attentions, handleLinks: false, greentext: false, emoji: [], html } }) expect(wrapper.html()).to.eql(compwrap(html)) }) it('Greentext + last mentions', () => { const html = [ '>quote', makeMention('lol'), '>quote', '>quote' ].join('\n') const expected = [ '>quote', mentionsLine(1) '>quote', '>quote' ].join('\n') const wrapper = shallowMount(RichContent, { localVue, propsData: { attentions, handleLinks: true, greentext: true, emoji: [], html } }) expect(wrapper.html()).to.eql(compwrap(expected)) }) it('One buggy example', () => { const html = [ 'Bruh', 'Bruh', [ makeMention('foo'), makeMention('bar'), makeMention('baz') ].join(''), 'Bruh' ].join('
') const expected = [ 'Bruh', 'Bruh', mentionsLine(3) 'Bruh' ].join('
') const wrapper = shallowMount(RichContent, { localVue, propsData: { attentions, handleLinks: true, greentext: true, emoji: [], html } }) expect(wrapper.html()).to.eql(compwrap(expected)) }) it('buggy example/hashtags', () => { const html = [ '

', '', 'NHCMDUXJPPZ6M3Z2CQ6D2EBRSWGE7MZY.jpg', ' ', '#nou', ' ', '#screencap', '

' ].join('') const expected = [ '

', '', 'NHCMDUXJPPZ6M3Z2CQ6D2EBRSWGE7MZY.jpg', ' ', '#nou', ' ', '#screencap', '

' ].join('') const wrapper = shallowMount(RichContent, { localVue, propsData: { attentions, handleLinks: true, greentext: true, emoji: [], html } }) expect(wrapper.html()).to.eql(compwrap(expected)) }) it('rich contents of a mention are handled properly', () => { const html = [ p( 'Testing' ), p( '', '', 'https://', '', 'lol.tld/', '', '', '' ) ].join('') const expected = [ p( 'Testing' ), p( '', '' ) ].join('') const wrapper = shallowMount(RichContent, { localVue, propsData: { attentions, handleLinks: true, greentext: true, emoji: [], html } }) expect(wrapper.html()).to.eql(compwrap(expected)) }) it('rich contents of a mention in beginning are handled properly', () => { attentions.push({ statusnet_profile_url: 'lol' }) const html = [ p( '', '', 'https://', '', 'lol.tld/', '', '', '' ), p( 'Testing' ) ].join('') const expected = [ p( '', '', '', '', // v-if placeholder '' ), p( 'Testing' ) ].join('') const wrapper = mount(RichContent, { localVue, stubs: { MentionLink: true }, propsData: { attentions, handleLinks: true, greentext: true, emoji: [], html } }) expect(wrapper.html()).to.eql(compwrap(expected)) }) it('rich contents of a link are handled properly', () => { const html = [ '

', 'Freenode is dead.

', '

', '', '', 'https://', '', 'isfreenodedeadyet.com/', '', '', '', '

' ].join('') const expected = [ '

', 'Freenode is dead.

', '

', '', '', 'https://', '', 'isfreenodedeadyet.com/', '', '', '', '

' ].join('') const wrapper = shallowMount(RichContent, { localVue, propsData: { attentions, handleLinks: true, greentext: true, emoji: [], html } }) expect(wrapper.html()).to.eql(compwrap(expected)) }) })