5 changed files with 187 additions and 0 deletions
Unified View
Diff Options
-
+2 -0.gitignore
-
+28 -0Readme.md
-
+39 -0package.json
-
+29 -0src/index.js
-
+89 -0test/index.js
+ 2
- 0
.gitignore
View File
| @@ -0,0 +1,2 @@ | |||||
| node_modules | |||||
| /lib | |||||
+ 28
- 0
Readme.md
View File
| @@ -0,0 +1,28 @@ | |||||
| # document-outerhtml | |||||
| Like [Element.outerHTML][], but for the whole [Document][]. | |||||
| This means it returns a string containing the `<html>.....</html>` with all the content between, plus the `<!DOCTYPE ....>` declaration (if present), and any comments and stray elements or text nodes. | |||||
| # Install | |||||
| npm install document-outerhtml | |||||
| # Usage | |||||
| import documentOuterHTML from 'document-outerhtml' | |||||
| const html = documentOuterHTML(document) | |||||
| # Licence | |||||
| [CC0](https://creativecommons.org/publicdomain/zero/1.0/); do whatever you want with this code. | |||||
| # See also | |||||
| - [XMLSerializer.serializeToString][]; does nearly the same thing, except it creates XML. | |||||
| [Element.outerHTML]: https://developer.mozilla.org/en-US/docs/Web/API/Element/outerHTML | |||||
| [Document]: https://developer.mozilla.org/en-US/docs/Web/API/Document | |||||
| [XMLSerializer.serializeToString]: https://developer.mozilla.org/en-US/docs/Web/API/XMLSerializer/serializeToString | |||||
+ 39
- 0
package.json
View File
| @@ -0,0 +1,39 @@ | |||||
| { | |||||
| "name": "document-outerhtml", | |||||
| "version": "0.0.0", | |||||
| "description": "Like Element.outerHTML, but for the whole Document.", | |||||
| "keywords": [ | |||||
| "dom" | |||||
| ], | |||||
| "main": "lib", | |||||
| "scripts": { | |||||
| "build": "babel -d lib src", | |||||
| "prepublish": "npm run build", | |||||
| "test": "ava" | |||||
| }, | |||||
| "author": "Gerben <gerben@treora.com>", | |||||
| "license": "CC0-1.0", | |||||
| "files": [ | |||||
| "lib" | |||||
| ], | |||||
| "devDependencies": { | |||||
| "ava": "^1.0.0-beta.3", | |||||
| "babel-cli": "^6.26.0", | |||||
| "babel-preset-env": "^1.6.1", | |||||
| "babel-register": "^6.26.0", | |||||
| "window": "^4.2.5" | |||||
| }, | |||||
| "babel": { | |||||
| "presets": [ | |||||
| "env" | |||||
| ] | |||||
| }, | |||||
| "ava": { | |||||
| "require": [ | |||||
| "babel-register" | |||||
| ] | |||||
| }, | |||||
| "dependencies": { | |||||
| "doctype-to-string": "^0.1.1" | |||||
| } | |||||
| } | |||||
+ 29
- 0
src/index.js
View File
| @@ -0,0 +1,29 @@ | |||||
| import doctypeToString from 'doctype-to-string' | |||||
| export default function documentOuterHTML(document) { | |||||
| if (!document | |||||
| || document.nodeType === undefined | |||||
| || document.nodeType !== document.DOCUMENT_NODE | |||||
| ) { | |||||
| throw new TypeError('Expected a Document') | |||||
| } | |||||
| const html = [...document.childNodes] | |||||
| .map(node => nodeToString(node)) | |||||
| .join('\n') | |||||
| return html | |||||
| } | |||||
| function nodeToString(node) { | |||||
| switch (node.nodeType) { | |||||
| case node.ELEMENT_NODE: | |||||
| return node.outerHTML | |||||
| case node.TEXT_NODE: | |||||
| return node.textContent | |||||
| case node.COMMENT_NODE: | |||||
| return `<!--${node.textContent}-->` | |||||
| case node.DOCUMENT_TYPE_NODE: | |||||
| return doctypeToString(node) | |||||
| default: | |||||
| throw new TypeError(`Unexpected node type: ${node.nodeType}`) | |||||
| } | |||||
| } | |||||
+ 89
- 0
test/index.js
View File
| @@ -0,0 +1,89 @@ | |||||
| import test from 'ava' | |||||
| import Window from 'window'; | |||||
| import documentOuterHTML from '../src' | |||||
| function makeDocument(html) { | |||||
| const window = new Window() | |||||
| const parser = new window.DOMParser() | |||||
| const doc = parser.parseFromString( | |||||
| html, | |||||
| 'text/html' | |||||
| ) | |||||
| return doc | |||||
| } | |||||
| function normalise(html) { | |||||
| // Remove whitespace around string and between tags. | |||||
| return html.trim().replace(/>\s+</g, '><') | |||||
| } | |||||
| test('should work with only an html node', t => { | |||||
| const html = ` | |||||
| <html> | |||||
| <head></head> | |||||
| <body><p>blub.</p></body> | |||||
| </html> | |||||
| ` | |||||
| const doc = makeDocument(html) | |||||
| t.is( | |||||
| normalise(documentOuterHTML(doc)), | |||||
| normalise(html) | |||||
| ) | |||||
| }) | |||||
| test('should work with comments', t => { | |||||
| const html = ` | |||||
| <!-- comment before --> | |||||
| <html> | |||||
| <head></head> | |||||
| <body><p>blub.</p></body> | |||||
| </html> | |||||
| <!-- comment after --> | |||||
| ` | |||||
| const doc = makeDocument(html) | |||||
| t.is( | |||||
| normalise(documentOuterHTML(doc)), | |||||
| normalise(html) | |||||
| ) | |||||
| }) | |||||
| test('should work with doctype', t => { | |||||
| const html = ` | |||||
| <!DOCTYPE html> | |||||
| <html> | |||||
| <head></head> | |||||
| <body><p>blub.</p></body> | |||||
| </html> | |||||
| ` | |||||
| const doc = makeDocument(html) | |||||
| t.is( | |||||
| normalise(documentOuterHTML(doc)), | |||||
| normalise(html) | |||||
| ) | |||||
| }) | |||||
| test('should work without a documentElement', t => { | |||||
| const html = ` | |||||
| <!DOCTYPE html> | |||||
| <!-- some comment --> | |||||
| ` | |||||
| const doc = makeDocument(html) | |||||
| // The html (+head&body) element will have been created automatically. Remove it. | |||||
| doc.removeChild(doc.documentElement) | |||||
| t.is( | |||||
| normalise(documentOuterHTML(doc)), | |||||
| normalise(html) | |||||
| ) | |||||
| }) | |||||
| test('should even work on a completely empty document', t => { | |||||
| const html = `` | |||||
| const doc = makeDocument(html) | |||||
| // The html (+head&body) element will have been created automatically. Remove it. | |||||
| doc.removeChild(doc.documentElement) | |||||
| t.is( | |||||
| normalise(documentOuterHTML(doc)), | |||||
| normalise(html) | |||||
| ) | |||||
| }) | |||||