restructure and tests

squash! restructure and tests

test/unit/specs/components/rich_content.spec.js

@@ -0,0 +1,357 @@
+import { shallowMount, createLocalVue } from '@vue/test-utils'
+import RichContent from 'src/components/rich_content/rich_content.jsx'
+
+const localVue = createLocalVue()
+
+const makeMention = (who) => `<span class="h-card"><a class="u-url mention" href="https://fake.tld/@${who}">@<span>${who}</span></a></span>`
+const stubMention = (who) => `<span class="h-card"><mentionlink-stub url="https://fake.tld/@${who}" content="@<span>${who}</span>"></mentionlink-stub></span>`
+const lastMentions = (...data) => `<span class="lastMentions">${data.join('')}</span>`
+const p = (...data) => `<p>${data.join('')}</p>`
+const compwrap = (...data) => `<span class="RichContent">${data.join('')}</span>`
+const removedMentionSpan = '<span class="h-card"></span>'
+
+describe('RichContent', () => {
+  it('renders simple post without exploding', () => {
+    const html = p('Hello world!')
+    const wrapper = shallowMount(RichContent, {
+      localVue,
+      propsData: {
+        handleLinks: true,
+        greentext: true,
+        emoji: [],
+        html
+      }
+    })
+
+    expect(wrapper.html()).to.eql(compwrap(html))
+  })
+
+  it('removes mentions from the beginning of post', () => {
+    const html = p(
+      makeMention('John'),
+      ' how are you doing thoday?'
+    )
+    const expected = p(
+      removedMentionSpan,
+      'how are you doing thoday?'
+    )
+    const wrapper = shallowMount(RichContent, {
+      localVue,
+      propsData: {
+        handleLinks: true,
+        greentext: true,
+        emoji: [],
+        html
+      }
+    })
+
+    expect(wrapper.html()).to.eql(compwrap(expected))
+  })
+
+  it('removes mentions from the end of the hellpost (<p>)', () => {
+    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: {
+        handleLinks: true,
+        greentext: true,
+        emoji: [],
+        html
+      }
+    })
+
+    expect(wrapper.html()).to.eql(compwrap(expected))
+  })
+
+  it('removes mentions from the end of the hellpost (<br>)', () => {
+    const html = [
+      'How are you doing today, fine gentlemen?',
+      [
+        makeMention('John'),
+        makeMention('Josh'),
+        makeMention('Jeremy')
+      ].join('')
+    ].join('<br>')
+    const expected = [
+      'How are you doing today, fine gentlemen?',
+      // TODO fix this extra line somehow?
+      '<br>'
+    ].join('')
+
+    const wrapper = shallowMount(RichContent, {
+      localVue,
+      propsData: {
+        handleLinks: true,
+        greentext: true,
+        emoji: [],
+        html
+      }
+    })
+
+    expect(wrapper.html()).to.eql(compwrap(expected))
+  })
+
+  it('removes mentions from the end of the hellpost (\\n)', () => {
+    const html = [
+      'How are you doing today, fine gentlemen?',
+      [
+        makeMention('John'),
+        makeMention('Josh'),
+        makeMention('Jeremy')
+      ].join('')
+    ].join('\n')
+    const expected = [
+      'How are you doing today, fine gentlemen?',
+      // TODO fix this extra line somehow?
+      ''
+    ].join('\n')
+
+    const wrapper = shallowMount(RichContent, {
+      localVue,
+      propsData: {
+        handleLinks: true,
+        greentext: true,
+        emoji: [],
+        html
+      }
+    })
+
+    expect(wrapper.html()).to.eql(compwrap(expected))
+  })
+
+  it('Does not remove mentions in the middle or at the end of text string', () => {
+    const html = [
+      [
+        makeMention('Jack'),
+        'let\'s meet up with ',
+        makeMention('Janet')
+      ].join(''),
+      [
+        'cc: ',
+        makeMention('John'),
+        makeMention('Josh'),
+        makeMention('Jeremy')
+      ].join('')
+    ].join('\n')
+    const expected = [
+      [
+        removedMentionSpan,
+        'let\'s meet up with ',
+        stubMention('Janet')
+      ].join(''),
+      [
+        'cc: ',
+        stubMention('John'),
+        stubMention('Josh'),
+        stubMention('Jeremy')
+      ].join('')
+    ].join('\n')
+
+    const wrapper = shallowMount(RichContent, {
+      localVue,
+      propsData: {
+        handleLinks: true,
+        greentext: true,
+        emoji: [],
+        html
+      }
+    })
+
+    expect(wrapper.html()).to.eql(compwrap(expected))
+  })
+
+  it('removes mentions from the end if there\'s only one first mention', () => {
+    const html = [
+      p(
+        makeMention('Todd'),
+        'so anyway you are wrong'
+      ),
+      p(
+        makeMention('Tom'),
+        makeMention('Trace'),
+        makeMention('Theodor')
+      )
+    ].join('')
+    const expected = [
+      p(
+        removedMentionSpan,
+        'so anyway you are wrong'
+      ),
+      // TODO fix this extra line somehow?
+      p()
+    ].join('')
+
+    const wrapper = shallowMount(RichContent, {
+      localVue,
+      propsData: {
+        handleLinks: true,
+        greentext: true,
+        emoji: [],
+        html
+      }
+    })
+
+    expect(wrapper.html()).to.eql(compwrap(expected))
+  })
+
+  it('does not remove mentions from the end if there\'s more than one first mention', () => {
+    const html = [
+      p(
+        makeMention('Zacharie'),
+        makeMention('Zinaide'),
+        'you guys have cool names, and so do these guys: '
+      ),
+      p(
+        makeMention('Watson'),
+        makeMention('Wallace'),
+        makeMention('Wakamoto')
+      )
+    ].join('')
+    const expected = [
+      p(
+        removedMentionSpan,
+        removedMentionSpan,
+        'you guys have cool names, and so do these guys: '
+      ),
+      p(
+        lastMentions(
+          stubMention('Watson'),
+          stubMention('Wallace'),
+          stubMention('Wakamoto')
+        )
+      )
+    ].join('')
+
+    const wrapper = shallowMount(RichContent, {
+      localVue,
+      propsData: {
+        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: {
+        handleLinks: false,
+        greentext: true,
+        emoji: [],
+        html
+      }
+    })
+
+    expect(wrapper.html()).to.eql(compwrap(html))
+  })
+
+  it('Adds greentext and cyantext to the post', () => {
+    const html = [
+      '&gt;preordering videogames',
+      '&gt;any year'
+    ].join('\n')
+    const expected = [
+      '<span class="greentext">&gt;preordering videogames</span>',
+      '<span class="greentext">&gt;any year</span>'
+    ].join('\n')
+
+    const wrapper = shallowMount(RichContent, {
+      localVue,
+      propsData: {
+        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 = [
+      '&gt;preordering videogames',
+      '&gt;any year'
+    ].join('\n')
+
+    const wrapper = shallowMount(RichContent, {
+      localVue,
+      propsData: {
+        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 ',
+      '<anonymous-stub alt=":spurdo:" src="about:blank" title=":spurdo:" class="emoji img"></anonymous-stub>'
+    )
+
+    const wrapper = shallowMount(RichContent, {
+      localVue,
+      propsData: {
+        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: {
+        handleLinks: false,
+        greentext: false,
+        emoji: [],
+        html
+      }
+    })
+
+    expect(wrapper.html()).to.eql(compwrap(html))
+  })
+})

test/unit/specs/services/html_converter/html_line_converter.spec.js

@@ -2,7 +2,7 @@ import { convertHtmlToLines } from 'src/services/html_converter/html_line_conver
 
 const mapOnlyText = (processor) => (input) => input.text ? processor(input.text) : input
 
-describe('TinyPostHTMLProcessor', () => {
+describe('html_line_converter', () => {
   describe('with processor that keeps original line should not make any changes to HTML when', () => {
     const processorKeep = (line) => line
     it('fed with regular HTML with newlines', () => {

test/unit/specs/services/html_converter/html_tree_converter.spec.js

@@ -1,6 +1,6 @@
-import { convertHtmlToTree, processTextForEmoji, getAttrs } from 'src/services/html_converter/html_tree_converter.service.js'
+import { convertHtmlToTree } from 'src/services/html_converter/html_tree_converter.service.js'
 
-describe('MiniHtmlConverter', () => {
+describe('html_tree_converter', () => {
   describe('convertHtmlToTree', () => {
     it('converts html into a tree structure', () => {
       const input = '1 <p>2</p> <b>3<img src="a">4</b>5'
@@ -129,38 +129,4 @@ describe('MiniHtmlConverter', () => {
       ])
     })
   })
-
-  describe('processTextForEmoji', () => {
-    it('processes all emoji in text', () => {
-      const input = 'Hello from finland! :lol: We have best water! :lmao:'
-      const emojis = [
-        { shortcode: 'lol', src: 'LOL' },
-        { shortcode: 'lmao', src: 'LMAO' }
-      ]
-      const processor = ({ shortcode, src }) => ({ shortcode, src })
-      expect(processTextForEmoji(input, emojis, processor)).to.eql([
-        'Hello from finland! ',
-        { shortcode: 'lol', src: 'LOL' },
-        ' We have best water! ',
-        { shortcode: 'lmao', src: 'LMAO' }
-      ])
-    })
-    it('leaves text as is', () => {
-      const input = 'Number one: that\'s terror'
-      const emojis = []
-      const processor = ({ shortcode, src }) => ({ shortcode, src })
-      expect(processTextForEmoji(input, emojis, processor)).to.eql([
-        'Number one: that\'s terror'
-      ])
-    })
-  })
-
-  describe('getAttrs', () => {
-    it('extracts arguments from tag', () => {
-      const input = '<img src="boop" cool ebin=\'true\'>'
-      const output = { src: 'boop', cool: true, ebin: 'true' }
-
-      expect(getAttrs(input)).to.eql(output)
-    })
-  })
 })

test/unit/specs/services/html_converter/utility.spec.js

@@ -0,0 +1,37 @@
+import { processTextForEmoji, getAttrs } from 'src/services/html_converter/utility.service.js'
+
+describe('html_converter utility', () => {
+  describe('processTextForEmoji', () => {
+    it('processes all emoji in text', () => {
+      const input = 'Hello from finland! :lol: We have best water! :lmao:'
+      const emojis = [
+        { shortcode: 'lol', src: 'LOL' },
+        { shortcode: 'lmao', src: 'LMAO' }
+      ]
+      const processor = ({ shortcode, src }) => ({ shortcode, src })
+      expect(processTextForEmoji(input, emojis, processor)).to.eql([
+        'Hello from finland! ',
+        { shortcode: 'lol', src: 'LOL' },
+        ' We have best water! ',
+        { shortcode: 'lmao', src: 'LMAO' }
+      ])
+    })
+    it('leaves text as is', () => {
+      const input = 'Number one: that\'s terror'
+      const emojis = []
+      const processor = ({ shortcode, src }) => ({ shortcode, src })
+      expect(processTextForEmoji(input, emojis, processor)).to.eql([
+        'Number one: that\'s terror'
+      ])
+    })
+  })
+
+  describe('getAttrs', () => {
+    it('extracts arguments from tag', () => {
+      const input = '<img src="boop" cool ebin=\'true\'>'
+      const output = { src: 'boop', cool: true, ebin: 'true' }
+
+      expect(getAttrs(input)).to.eql(output)
+    })
+  })
+})