diff --git a/README.md b/README.md index 7f11dd4..a222c3c 100644 --- a/README.md +++ b/README.md @@ -5,10 +5,11 @@ This project was developed for use in a client-side project. To use in a Node en ### Exported API ```js +export default docsSoap(html: string) -> string; export { docsSoap(html: string) -> string, parseHTML(html: string) -> HTMLElement -} +}; ``` ### Testing diff --git a/package.json b/package.json index 7f03101..68d869a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "docs-soap", - "version": "0.1.1", + "version": "0.1.2", "description": "A utility for cleaning Google Docs clipboard content into valid HTML", "author": "aem ", "keywords": [ diff --git a/src/docsSoap.js b/src/docsSoap.js index e0cd80d..683ee91 100644 --- a/src/docsSoap.js +++ b/src/docsSoap.js @@ -1,7 +1,16 @@ const parseHTML = require('./parseHTML'); -const DOCS_BOLD_WEIGHT = '700'; -const ITALIC_STYLE = 'italic'; +const styles = { + BOLD: '700', + ITALIC: 'italic', + UNDERLINE: 'underline' +}; + +const elements = { + BOLD: 'strong', + ITALIC: 'i', + UNDERLINE: 'u' +}; const wrapNodeAnchor = (node, href) => { const anchor = document.createElement('a'); @@ -10,16 +19,10 @@ const wrapNodeAnchor = (node, href) => { return anchor; }; -const wrapNodeItalic = node => { - const italic = document.createElement('i'); - italic.appendChild(node.cloneNode(true)); - return italic; -}; - -const wrapNodeStrong = node => { - const strong = document.createElement('strong'); - strong.appendChild(node.cloneNode(true)); - return strong; +const wrapNodeInline = (node, style) => { + const el = document.createElement(style); + el.appendChild(node.cloneNode(true)); + return el; }; const applyBlockStyles = dirty => { @@ -28,18 +31,24 @@ const applyBlockStyles = dirty => { if (node.childNodes[0] && node.childNodes[0].nodeName === 'A') { newNode = wrapNodeAnchor(newNode.cloneNode(true), node.childNodes[0].href); const inner = node.childNodes[0].childNodes[0]; - if (inner && inner.style && inner.style.fontWeight === DOCS_BOLD_WEIGHT) { - newNode = wrapNodeStrong(newNode); + if (inner && inner.style && inner.style.fontWeight === styles.BOLD) { + newNode = wrapNodeInline(newNode, elements.BOLD); } - if (inner && inner.style && inner.style.fontStyle === ITALIC_STYLE) { - newNode = wrapNodeItalic(newNode); + if (inner && inner.style && inner.style.fontStyle === styles.ITALIC) { + newNode = wrapNodeInline(newNode, elements.ITALIC); } + if (inner && inner.style && inner.style.textDecoration === styles.UNDERLINE) { + newNode = wrapNodeInline(newNode, elements.UNDERLINE); + } + } + if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.fontWeight === styles.BOLD) { + newNode = wrapNodeInline(newNode, elements.BOLD); } - if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.fontWeight === DOCS_BOLD_WEIGHT) { - newNode = wrapNodeStrong(newNode); + if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.fontStyle === styles.ITALIC) { + newNode = wrapNodeInline(newNode, elements.ITALIC); } - if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.fontStyle === ITALIC_STYLE) { - newNode = wrapNodeItalic(newNode); + if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.textDecoration === styles.UNDERLINE) { + newNode = wrapNodeInline(newNode, elements.UNDERLINE); } return newNode; }; @@ -49,18 +58,24 @@ const applyInlineStyles = dirty => { let newNode = document.createTextNode(node.textContent); if (node.nodeName === 'A') { newNode = wrapNodeAnchor(newNode, node.href); - if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.fontWeight === DOCS_BOLD_WEIGHT) { - newNode = wrapNodeStrong(newNode); + if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.fontWeight === styles.BOLD) { + newNode = wrapNodeInline(newNode, elements.BOLD); } - if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.fontStyle === ITALIC_STYLE) { - newNode = wrapNodeItalic(newNode); + if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.fontStyle === styles.ITALIC) { + newNode = wrapNodeInline(newNode, elements.ITALIC); } + if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.textDecoration === styles.UNDERLINE) { + newNode = wrapNodeInline(newNode, elements.UNDERLINE); + } + } + if (node.style && node.style.fontWeight === styles.BOLD) { + newNode = wrapNodeInline(newNode, elements.BOLD); } - if (node.style && node.style.fontWeight === DOCS_BOLD_WEIGHT) { - newNode = wrapNodeStrong(newNode); + if (node.style && node.style.fontStyle === styles.ITALIC) { + newNode = wrapNodeInline(newNode, elements.ITALIC); } - if (node.style && node.style.fontStyle === ITALIC_STYLE) { - newNode = wrapNodeItalic(newNode); + if (node.style && node.style.textDecoration === styles.UNDERLINE) { + newNode = wrapNodeInline(newNode, elements.UNDERLINE); } return newNode; }; diff --git a/test/docsSoapSpec.js b/test/docsSoapSpec.js index f74493a..f7da5ef 100644 --- a/test/docsSoapSpec.js +++ b/test/docsSoapSpec.js @@ -1,7 +1,7 @@ 'use es6'; import documents from './fixtures/documents'; -import docsSoap from '../src/index'; +import docsSoap from '../dist/index'; import expect from 'expect'; import jsdom from 'mocha-jsdom'; import parseHTML from '../src/parseHTML'; @@ -13,9 +13,11 @@ describe('Google Docs Converter', () => { const rawContents = parseHTML(documents.inlineStyles); expect(rawContents.querySelectorAll('strong').length).toBe(0); expect(rawContents.querySelectorAll('i').length).toBe(0); + expect(rawContents.querySelectorAll('u').length).toBe(0); const doc = parseHTML(docsSoap(documents.inlineStyles)); expect(doc.querySelectorAll('strong').length).toBe(1); expect(doc.querySelectorAll('i').length).toBe(1); + expect(doc.querySelectorAll('u').length).toBe(1); }); it('converts links from google docs properly', () => { diff --git a/test/fixtures/documents.json b/test/fixtures/documents.json index 2a3cf5e..ec9252b 100644 --- a/test/fixtures/documents.json +++ b/test/fixtures/documents.json @@ -1,4 +1,4 @@ { - "inlineStyles": "

Some bold text

Some italicized text", - "links": "

this is a link

this is a bold link

this is an italicized link

this is a bold, italicized link" + "inlineStyles": "

Some bold text

Some italicized text

Some underlined text", + "links": "

this is a link

this is a bold link

this is an italicized link

this is a bold, italicized link" }