Merge pull request #190 from livingdocsIO/test-refactorings

Refactor Tests and update test and example dependencies

Author: peyerluk

package-lock.json

@@ -18,33 +18,33 @@
     "css-loader": "^0.25.0",
     "eslint": "^5.2.0",
     "eslint-config-standard": "^11.0.0",
-    "eslint-plugin-import": "^2.19.1",
+    "eslint-plugin-import": "^2.22.1",
     "eslint-plugin-node": "^7.0.1",
     "eslint-plugin-promise": "^3.8.0",
-    "eslint-plugin-react": "^7.17.0",
+    "eslint-plugin-react": "^7.21.5",
     "eslint-plugin-standard": "^3.1.0",
     "font-awesome": "^4.6.1",
     "gh-pages": "^0.11.0",
     "jasmine-core": "^2.99.1",
-    "jquery": "^3.4.1",
+    "jquery": "^3.5.1",
     "karma": "^1.7.1",
     "karma-chrome-launcher": "^2.0.0",
     "karma-coverage": "^1.0.0",
     "karma-firefox-launcher": "^1.3.0",
     "karma-jasmine": "^1.0.2",
     "karma-safari-launcher": "^1.0.0",
-    "karma-sourcemap-loader": "^0.3.7",
+    "karma-sourcemap-loader": "^0.3.8",
     "karma-webpack": "^1.8.1",
     "lodash.clonedeep": "^4.5.0",
     "normalize.css": "^8.0.1",
     "open-browser-webpack-plugin": "0.0.5",
-    "prismjs": "^1.4.1",
-    "react": "^15.3.2",
+    "prismjs": "^1.22.0",
+    "react": "^15.7.0",
     "react-addons-css-transition-group": "^15.3.2",
-    "react-dom": "^15.3.2",
-    "rimraf": "^3.0.0",
+    "react-dom": "^15.7.0",
+    "rimraf": "^3.0.2",
     "sinon": "^7.4.1",
-    "style-loader": "^1.0.1",
+    "style-loader": "^1.3.0",
     "url-loader": "^2.1.0",
     "webpack": "^1.13.0",
     "webpack-dev-server": "^1.14.1"

package.json

@@ -2,45 +2,47 @@ import $ from 'jquery'
 
 import Editable from '../src/core'
 
-describe('Editable', () => {
+describe('Editable', function () {
   let editable, $div
 
-  afterEach(() => {
+  afterEach(function () {
     if (editable) {
       editable.off()
       editable = undefined
     }
   })
 
-  describe('global variable', () => {
-    it('is not defined', () => {
+  describe('global variable', function () {
+
+    it('is not defined', function () {
       expect(window.Editable).toBeUndefined()
     })
 
-    it('creates a new Editable instance', () => {
+    it('creates a new Editable instance', function () {
       editable = new Editable()
       expect(editable.on).toBeDefined()
     })
 
     // Test no variables are leaking into global namespace
-    it('does not define dispatcher globally', () => {
+    it('does not define dispatcher globally', function () {
       expect(window.dispatcher).not.toBeDefined()
     })
   })
 
-  describe('with an element added', () => {
-    beforeEach(() => {
+  describe('with an element added', function () {
+
+    beforeEach(function () {
       $div = $('<div>').appendTo(document.body)
       editable = new Editable()
       editable.add($div)
     })
 
-    afterEach(() => {
+    afterEach(function () {
       $div.remove()
     })
 
-    describe('getContent()', () => {
-      it('getContent() returns its content', () => {
+    describe('getContent()', function () {
+      it('getContent() returns its content', function () {
         $div.html('a')
         const content = editable.getContent($div[0])
 
@@ -49,65 +51,68 @@ describe('Editable', () => {
       })
     })
 
-    describe('appendTo()', () => {
-      it('appends a document fragment', () => {
+    describe('appendTo()', function () {
+
+      it('appends a document fragment', function () {
         $div.html('a')
         const frag = document.createDocumentFragment()
         frag.appendChild(document.createTextNode('b'))
         editable.appendTo($div[0], frag)
         expect($div[0].innerHTML).toEqual('ab')
       })
 
-      it('appends text from a string', () => {
+      it('appends text from a string', function () {
         $div.html('a')
         editable.appendTo($div[0], 'b')
         expect($div[0].innerHTML).toEqual('ab')
       })
 
-      it('appends html from a string', () => {
+      it('appends html from a string', function () {
         $div.html('a')
         editable.appendTo($div[0], '<span>b</span>c')
         expect($div[0].innerHTML).toEqual('a<span>b</span>c')
       })
 
-      it('returns a curosr a the right position', () => {
+      it('returns a curosr a the right position', function () {
         $div.html('a')
         const cursor = editable.appendTo($div[0], 'b')
         expect(cursor.beforeHtml()).toEqual('a')
         expect(cursor.afterHtml()).toEqual('b')
       })
     })
 
-    describe('prependTo()', () => {
-      it('prepends a document fragment', () => {
+    describe('prependTo()', function () {
+
+      it('prepends a document fragment', function () {
         const frag = document.createDocumentFragment()
         frag.appendChild(document.createTextNode('b'))
         $div.html('a')
         editable.prependTo($div[0], frag)
         expect($div[0].innerHTML).toEqual('ba')
       })
 
-      it('prepends text from a string', () => {
+      it('prepends text from a string', function () {
         $div.html('a')
         editable.prependTo($div[0], 'b')
         expect($div[0].innerHTML).toEqual('ba')
       })
 
-      it('prepends html from a string', () => {
+      it('prepends html from a string', function () {
         $div.html('A sentence.')
         editable.prependTo($div[0], '<span>So</span> be it. ')
         expect($div[0].innerHTML).toEqual('<span>So</span> be it. A sentence.')
       })
 
-      it('returns a curosr a the right position', () => {
+      it('returns a curosr a the right position', function () {
         $div.html('a')
         const cursor = editable.prependTo($div[0], 'b')
         expect(cursor.beforeHtml()).toEqual('b')
         expect(cursor.afterHtml()).toEqual('a')
       })
     })
 
-    describe('change event', () => {
+    describe('change event', function () {
+
       it('gets triggered after format change', (done) => {
         editable.change((element) => {
           expect(element).toEqual($div[0])

spec/api.spec.js

@@ -2,10 +2,11 @@ import { parseContent, updateConfig } from '../src/clipboard'
 import cloneDeep from 'lodash.clonedeep'
 import * as config from '../src/config'
 
-describe('Clipboard', () => {
-  describe('parseContent()', () => {
+describe('Clipboard', function () {
 
-    afterEach(() => {
+  describe('parseContent()', function () {
+
+    afterEach(function () {
       updateConfig(config)
     })
 
@@ -22,23 +23,23 @@ describe('Clipboard', () => {
     // Copy Elements
     // -------------
 
-    it('gets a plain text', () => {
+    it('gets a plain text', function () {
       expect(extractSingleBlock('a')).toEqual('a')
     })
 
-    it('trims text', () => {
+    it('trims text', function () {
       expect(extractSingleBlock(' a ')).toEqual('a')
     })
 
-    it('keeps a <a> element with an href attribute with an absolute link', () => {
+    it('keeps a <a> element with an href attribute with an absolute link', function () {
       expect(extractSingleBlock('<a href="http://link.com">a</a>')).toEqual('<a href="http://link.com">a</a>')
     })
 
-    it('keeps a <a> element with an href attribute with an relative link', () => {
+    it('keeps a <a> element with an href attribute with an relative link', function () {
       expect(extractSingleBlock('<a href="/link/1337">a</a>')).toEqual('<a href="/link/1337">a</a>')
     })
 
-    it('keeps a <a> element with an a list of whitelisted-attributes', () => {
+    it('keeps a <a> element with an a list of whitelisted-attributes', function () {
       const updatedConfig = cloneDeep(config)
       updatedConfig.pastedHtmlRules.allowedElements = { a: { href: true, rel: true, target: true } }
 
@@ -50,7 +51,7 @@ describe('Clipboard', () => {
       ).toEqual('<a target="_blank" rel="nofollow" href="/link/1337">a</a>')
     })
 
-    it('removes attributes that arent whitelisted for an <a> element ', () => {
+    it('removes attributes that arent whitelisted for an <a> element ', function () {
       const updatedConfig = cloneDeep(config)
       updatedConfig.pastedHtmlRules.allowedElements = { a: { href: true } }
       updateConfig(updatedConfig)
@@ -61,28 +62,28 @@ describe('Clipboard', () => {
       ).toEqual('<a href="/link/1337">a</a>')
     })
 
-    it('keeps a <strong> element', () => {
+    it('keeps a <strong> element', function () {
       expect(extractSingleBlock('<strong>a</strong>')).toEqual('<strong>a</strong>')
     })
 
-    it('keeps an <em> element', () => {
+    it('keeps an <em> element', function () {
       expect(extractSingleBlock('<em>a</em>')).toEqual('<em>a</em>')
     })
 
-    it('keeps a <br> element', () => {
+    it('keeps a <br> element', function () {
       expect(extractSingleBlock('a<br>b')).toEqual('a<br>b')
     })
 
     // Split Blocks
     // ------------
 
-    it('creates two blocks from two paragraphs', () => {
+    it('creates two blocks from two paragraphs', function () {
       const blocks = extract('<p>a</p><p>b</p>')
       expect(blocks[0]).toEqual('a')
       expect(blocks[1]).toEqual('b')
     })
 
-    it('creates two blocks from an <h1> followed by an <h2>', () => {
+    it('creates two blocks from an <h1> followed by an <h2>', function () {
       const blocks = extract('<h1>a</h1><h2>b</h2>')
       expect(blocks[0]).toEqual('a')
       expect(blocks[1]).toEqual('b')
@@ -91,74 +92,74 @@ describe('Clipboard', () => {
     // Clean Whitespace
     // ----------------
 
-    var checkWhitespace = function (a, b) {
+    function checkWhitespace (a, b) {
       expect(escape(extractSingleBlock(a))).toEqual(escape(b))
     }
 
-    it('replaces a single &nbsp; character', () => {
+    it('replaces a single &nbsp; character', function () {
       checkWhitespace('a&nbsp;b', 'a b')
     })
 
-    it('replaces a series of &nbsp; with alternating whitespace and &nbsp;', () => {
+    it('replaces a series of &nbsp; with alternating whitespace and &nbsp;', function () {
       checkWhitespace('a&nbsp;&nbsp;&nbsp;&nbsp;b', 'a \u00A0 \u00A0b')
     })
 
-    it('replaces a single &nbsp; character before a <span>', () => {
+    it('replaces a single &nbsp; character before a <span>', function () {
       checkWhitespace('a&nbsp;<span>b</span>', 'a b')
     })
 
-    it('collapses multiple whitespaces', () => {
+    it('collapses multiple whitespaces', function () {
       checkWhitespace('A  B   C    D', 'A B C D')
     })
 
-    it('removes newlines', () => {
+    it('removes newlines', function () {
       checkWhitespace('A\nB \n C', 'A B C')
     })
 
     // Remove Elements
     // ---------------
 
-    it('removes a <span> element', () => {
+    it('removes a <span> element', function () {
       expect(extractSingleBlock('<span>a</span>')).toEqual('a')
     })
 
-    it('removes an <a> element without an href attribute', () => {
+    it('removes an <a> element without an href attribute', function () {
       expect(extractSingleBlock('<a>a</a>')).toEqual('a')
     })
 
 
-    it('removes an <a> element with an empty href attribute', () => {
+    it('removes an <a> element with an empty href attribute', function () {
       expect(extractSingleBlock('<a href>a</a>')).toEqual('a')
     })
 
-    it('removes an <a> element with an empty href attribute', () => {
+    it('removes an <a> element with an empty href attribute', function () {
       expect(extractSingleBlock('<a href="">a</a>')).toEqual('a')
     })
 
-    it('removes an empty <strong> element', () => {
+    it('removes an empty <strong> element', function () {
       expect(extractSingleBlock('<strong></strong>')).toEqual(undefined)
     })
 
-    it('removes a <strong> element with only whitespace', () => {
+    it('removes a <strong> element with only whitespace', function () {
       expect(extractSingleBlock('<strong> </strong>')).toEqual(undefined)
     })
 
-    it('removes an empty <strong> element but keeps its whitespace', () => {
+    it('removes an empty <strong> element but keeps its whitespace', function () {
       expect(extractSingleBlock('a<strong> </strong>b')).toEqual('a b')
     })
 
-    it('removes an attribute from an <em> element', () => {
+    it('removes an attribute from an <em> element', function () {
       expect(extractSingleBlock('<em data-something="x">a</em>')).toEqual('<em>a</em>')
     })
 
     // Transform Elements
     // ------------------
 
-    it('transforms a <b> into a <strong>', () => {
+    it('transforms a <b> into a <strong>', function () {
       expect(extractSingleBlock('<b>a</b>')).toEqual('<strong>a</strong>')
     })
 
-    it('changes absolute links to relative ones with the keepInternalRelativeLinks flag set to true', () => {
+    it('changes absolute links to relative ones with the keepInternalRelativeLinks flag set to true', function () {
       const updatedConfig = cloneDeep(config)
       updatedConfig.pastedHtmlRules.keepInternalRelativeLinks = true
       updateConfig(updatedConfig)
@@ -168,15 +169,15 @@ describe('Clipboard', () => {
     // Escape Content
     // --------------
 
-    it('escapes the string "<b>a</b>"', () => {
+    it('escapes the string "<b>a</b>"', function () {
       // append the string to test as text node so the browser escapes it.
       const div = document.createElement('div')
       div.appendChild(document.createTextNode('<b>a</b>'))
 
       expect(parseContent(div)[0]).toEqual('&lt;b&gt;a&lt;/b&gt;')
     })
 
-    it('removes blacklisted HTML elements (e.g. <style>)', () => {
+    it('removes blacklisted HTML elements (e.g. <style>)', function () {
       const div = document.createElement('div')
       div.innerHTML = `
         <style type="text/css">