From cc2ae2babbe60fc5c772168490efdb03ed96dea4 Mon Sep 17 00:00:00 2001 From: aem Date: Tue, 28 Jun 2016 14:38:35 -0400 Subject: [PATCH 1/2] support all inline styles --- package.json | 2 +- src/constants.js | 18 ++++++++++++ src/docsSoap.js | 53 ++++++++++++++++++++++++++---------- test/docsSoapSpec.js | 31 +++++++++++++-------- test/fixtures/documents.json | 2 +- 5 files changed, 78 insertions(+), 28 deletions(-) create mode 100644 src/constants.js diff --git a/package.json b/package.json index 68d869a..2a2a9db 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "docs-soap", - "version": "0.1.2", + "version": "0.1.3", "description": "A utility for cleaning Google Docs clipboard content into valid HTML", "author": "aem ", "keywords": [ diff --git a/src/constants.js b/src/constants.js new file mode 100644 index 0000000..37b71d2 --- /dev/null +++ b/src/constants.js @@ -0,0 +1,18 @@ +export const styles = { + BOLD: '700', + ITALIC: 'italic', + UNDERLINE: 'underline', + STRIKETHROUGH: 'line-through', + SUPERSCRIPT: 'super', + SUBSCRIPT: 'sub' +}; + +export const elements = { + ANCHOR: 'a', + BOLD: 'strong', + ITALIC: 'em', + UNDERLINE: 'u', + STRIKETHROUGH: 'del', + SUPERSCRIPT: 'sup', + SUBSCRIPT: 'sub' +}; \ No newline at end of file diff --git a/src/docsSoap.js b/src/docsSoap.js index 683ee91..0a71e06 100644 --- a/src/docsSoap.js +++ b/src/docsSoap.js @@ -1,19 +1,8 @@ -const parseHTML = require('./parseHTML'); - -const styles = { - BOLD: '700', - ITALIC: 'italic', - UNDERLINE: 'underline' -}; - -const elements = { - BOLD: 'strong', - ITALIC: 'i', - UNDERLINE: 'u' -}; +import { elements, styles } from './constants'; +import parseHTML from './parseHTML'; const wrapNodeAnchor = (node, href) => { - const anchor = document.createElement('a'); + const anchor = document.createElement(elements.ANCHOR); anchor.href = href; anchor.appendChild(node.cloneNode(true)); return anchor; @@ -40,6 +29,15 @@ const applyBlockStyles = dirty => { if (inner && inner.style && inner.style.textDecoration === styles.UNDERLINE) { newNode = wrapNodeInline(newNode, elements.UNDERLINE); } + if (inner && inner.style && inner.style.textDecoration === styles.STRIKETHROUGH) { + newNode = wrapNodeInline(newNode, elements.STRIKETHROUGH); + } + if (inner && inner.style && inner.style.verticalAlign === styles.SUPERSCRIPT) { + newNode = wrapNodeInline(newNode, elements.SUPERSCRIPT); + } + if (inner && inner.style && inner.style.verticalAlign === styles.SUBSCRIPT) { + newNode = wrapNodeInline(newNode, elements.SUBSCRIPT); + } } if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.fontWeight === styles.BOLD) { newNode = wrapNodeInline(newNode, elements.BOLD); @@ -50,6 +48,15 @@ const applyBlockStyles = dirty => { if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.textDecoration === styles.UNDERLINE) { newNode = wrapNodeInline(newNode, elements.UNDERLINE); } + if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.textDecoration === styles.STRIKETHROUGH) { + newNode = wrapNodeInline(newNode, elements.STRIKETHROUGH); + } + if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.verticalAlign === styles.SUPERSCRIPT) { + newNode = wrapNodeInline(newNode, elements.SUPERSCRIPT); + } + if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.verticalAlign === styles.SUBSCRIPT) { + newNode = wrapNodeInline(newNode, elements.SUBSCRIPT); + } return newNode; }; @@ -67,6 +74,15 @@ const applyInlineStyles = dirty => { if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.textDecoration === styles.UNDERLINE) { newNode = wrapNodeInline(newNode, elements.UNDERLINE); } + if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.textDecoration === styles.STRIKETHROUGH) { + newNode = wrapNodeInline(newNode, elements.STRIKETHROUGH); + } + if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.verticalAlign === styles.SUPERSCRIPT) { + newNode = wrapNodeInline(newNode, elements.SUPERSCRIPT); + } + if (node.childNodes[0] && node.childNodes[0].style && node.childNodes[0].style.verticalAlign === styles.SUBSCRIPT) { + newNode = wrapNodeInline(newNode, elements.SUBSCRIPT); + } } if (node.style && node.style.fontWeight === styles.BOLD) { newNode = wrapNodeInline(newNode, elements.BOLD); @@ -77,6 +93,15 @@ const applyInlineStyles = dirty => { if (node.style && node.style.textDecoration === styles.UNDERLINE) { newNode = wrapNodeInline(newNode, elements.UNDERLINE); } + if (node.style && node.style.textDecoration === styles.STRIKETHROUGH) { + newNode = wrapNodeInline(newNode, elements.STRIKETHROUGH); + } + if (node.style && node.style.verticalAlign === styles.SUPERSCRIPT) { + newNode = wrapNodeInline(newNode, elements.SUPERSCRIPT); + } + if (node.style && node.style.verticalAlign === styles.SUBSCRIPT) { + newNode = wrapNodeInline(newNode, elements.SUBSCRIPT); + } return newNode; }; diff --git a/test/docsSoapSpec.js b/test/docsSoapSpec.js index f7da5ef..5559db2 100644 --- a/test/docsSoapSpec.js +++ b/test/docsSoapSpec.js @@ -1,5 +1,6 @@ 'use es6'; +import { elements } from '../src/constants' import documents from './fixtures/documents'; import docsSoap from '../dist/index'; import expect from 'expect'; @@ -11,23 +12,29 @@ describe('Google Docs Converter', () => { it('converts inline styles from google docs properly', () => { 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); + expect(rawContents.querySelectorAll(elements.BOLD).length).toBe(0); + expect(rawContents.querySelectorAll(elements.ITALIC).length).toBe(0); + expect(rawContents.querySelectorAll(elements.UNDERLINE).length).toBe(0); + expect(rawContents.querySelectorAll(elements.STRIKETHROUGH).length).toBe(0); + expect(rawContents.querySelectorAll(elements.SUPERSCRIPT).length).toBe(0); + expect(rawContents.querySelectorAll(elements.SUBSCRIPT).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); + expect(doc.querySelectorAll(elements.BOLD).length).toBe(1); + expect(doc.querySelectorAll(elements.ITALIC).length).toBe(1); + expect(doc.querySelectorAll(elements.UNDERLINE).length).toBe(1); + expect(doc.querySelectorAll(elements.STRIKETHROUGH).length).toBe(1); + expect(doc.querySelectorAll(elements.SUPERSCRIPT).length).toBe(1); + expect(doc.querySelectorAll(elements.SUBSCRIPT).length).toBe(1); }); it('converts links from google docs properly', () => { const rawContents = parseHTML(documents.links); - expect(rawContents.querySelectorAll('strong').length).toBe(0); - expect(rawContents.querySelectorAll('i').length).toBe(0); - expect(rawContents.querySelectorAll('a').length).toBe(4); + expect(rawContents.querySelectorAll(elements.BOLD).length).toBe(0); + expect(rawContents.querySelectorAll(elements.ITALIC).length).toBe(0); + expect(rawContents.querySelectorAll(elements.ANCHOR).length).toBe(4); const doc = parseHTML(docsSoap(documents.links)); - expect(doc.querySelectorAll('strong').length).toBe(2); - expect(doc.querySelectorAll('i').length).toBe(2); - expect(doc.querySelectorAll('a').length).toBe(4); + expect(doc.querySelectorAll(elements.BOLD).length).toBe(2); + expect(doc.querySelectorAll(elements.ITALIC).length).toBe(2); + expect(doc.querySelectorAll(elements.ANCHOR).length).toBe(4); }); }); diff --git a/test/fixtures/documents.json b/test/fixtures/documents.json index ec9252b..a3c9d6e 100644 --- a/test/fixtures/documents.json +++ b/test/fixtures/documents.json @@ -1,4 +1,4 @@ { - "inlineStyles": "

Some bold text

Some italicized text

Some underlined text", + "inlineStyles": "

Some bold text

Some italicized text

Some underlined text

Some strikethrough text

Some superscript

Some subscript", "links": "

this is a link

this is a bold link

this is an italicized link

this is a bold, italicized link" } From 5999f91007f5d31ca86713255e11dfb15f2458f8 Mon Sep 17 00:00:00 2001 From: aem Date: Tue, 28 Jun 2016 14:41:51 -0400 Subject: [PATCH 2/2] eof newline --- src/constants.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/constants.js b/src/constants.js index 37b71d2..0e8de3e 100644 --- a/src/constants.js +++ b/src/constants.js @@ -15,4 +15,4 @@ export const elements = { STRIKETHROUGH: 'del', SUPERSCRIPT: 'sup', SUBSCRIPT: 'sub' -}; \ No newline at end of file +};