Add more tests

Author: alandipert

js-tests/js-tests.jsx

@@ -1,24 +1,91 @@
 import React from 'react';
+import ReactDOM from 'react';
+import { renderToString, renderToStaticMarkup } from 'react-dom/server';
+import parseXml from '@rgrove/parse-xml';
+import ReactHtmlParser from 'react-html-parser';
+
+/**
+ * Needed by react-tools.js
+ * In normal operation, these are added to the page as htmlDependencies.
+ */
+window.React = React;
+window.ReactDOM = ReactDOM;
+
+class Shout extends React.Component {
+    render() {
+        return <span>{this.props.message.toUpperCase()}</span>;
+    }
+}
+
+const FunctionalShout = ({ message }) => {
+    return <span>{message.toUpperCase()}</span>;
+}
+
+class TodoList extends React.Component {
+    render() {
+        return <ol>
+            {this.props.children.map((child, i) => {
+                return <li key={i}>{child}</li>;
+            })}
+        </ol>
+    }
+}
+
+// Converts a parse-xml style tree to an htmltools::tag style tree of JSON.
+function objectToTag(obj) {
+    return {
+        name: obj.name,
+        attribs: obj.attributes,
+        children: obj.children.map(child => {
+            if (child.type === 'text') {
+                return child.text;
+            } else {
+                return objectToTag(child);
+            }
+        })
+    }
+}
+
+// Converts a string of markup to an htmltools::tag style tree of JSON.
+function stringToTag(str) {
+    return objectToTag(parseXml(str).children[0]);
+}
+
+// Compares two parse-xml style trees for "deep" equality
+function xmlEqual(x1, x2) {
+    if (x1.type === 'text'
+        && x2.type === 'text'
+        && x1.text === x2.text)
+        return true;
+    return x1.name === x2.name
+        // Test attributes for equalitiy
+        && Object.keys(x1).length === Object.keys(x2).length
+        && Object.keys(x1).every(k => x1[k] === x2[k])
+        // Test children for equality
+        && x1.children.length === x2.children.length
+        && x1.children.every((child, i) => markupEqual(child, x2.children[i]))
+}
 
 describe('window.reactR', () => {
     describe('#hydrate()', () => {
         it('should throw an exception with an unknown component', () => {
             assert.throws(() => {
-                reactR.hydrate(
-                    {
-                        Foo: class Foo extends React.Component {
-                            render() {
-                                return <h1>Foo!</h1>;
-                            }
-                        }
-                    },
-                    {
-                        name: "Bar",
-                        attribs: {},
-                        children: {}
-                    }
-                )
+                reactR.hydrate({ Shout: Shout }, stringToTag('<Bar/>'))
             }, Error, /Unknown component/);
         });
+        it('hydrates an HTML5 component with a text child', () => {
+            const markup = '<h1>Hello</h1>';
+            assert.equal(
+                renderToString(ReactHtmlParser(markup)),
+                renderToString(reactR.hydrate({}, stringToTag(markup)))
+            )
+        })
+        it('hydrates nested HTML5 components', () => {
+            const markup = '<div><h1>Hello</h1><p>Oh, hello.</p></div>'
+            assert.equal(
+                renderToString(ReactHtmlParser(markup)),
+                renderToString(reactR.hydrate({}, stringToTag(markup)))
+            )
+        })
     });
 });

package.json

@@ -14,7 +14,9 @@
         "@babel/core": "^7.2.0",
         "babel-loader": "^8.0.4",
         "@babel/preset-env": "^7.2.0",
-        "@babel/preset-react": "^7.0.0"
+        "@babel/preset-react": "^7.0.0",
+        "@rgrove/parse-xml": "^1.1.1",
+        "react-html-parser": "^2.0.2"
     },
     "scripts": {
         "test": "karma start --single-run --browsers ChromeHeadless karma.conf.js"

yarn.lock

@@ -641,6 +641,13 @@
     lodash "^4.17.10"
     to-fast-properties "^2.0.0"
 
+"@rgrove/parse-xml@^1.1.1":
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/@rgrove/parse-xml/-/parse-xml-1.1.1.tgz#9415b98995e0f2ac86b84d9501af2053b22f4621"
+  integrity sha512-3wFRoPyAnb7w5oLdUuiXoMN5s19RZjTmdN7pz4G8XDVgjpXFCP6gUvb5k/GtzZwwFRNCYpBFxCEykcYdeWLiPQ==
+  dependencies:
+    babel-runtime "^6.23.0"
+
 abbrev@1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8"
@@ -836,7 +843,7 @@ babel-loader@^8.0.4:
     mkdirp "^0.5.1"
     util.promisify "^1.0.0"
 
-babel-runtime@^6.0.0:
+babel-runtime@^6.0.0, babel-runtime@^6.23.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.26.0.tgz#965c7058668e82b55d7bfe04ff2337bc8b5647fe"
   integrity sha1-llxwWGaOgrVde/4E/yM3vItWR/4=
@@ -1569,11 +1576,44 @@ dom-serialize@^2.2.0:
     extend "^3.0.0"
     void-elements "^2.0.0"
 
+dom-serializer@0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.1.0.tgz#073c697546ce0780ce23be4a28e293e40bc30c82"
+  integrity sha1-BzxpdUbOB4DOI75KKOKT5AvDDII=
+  dependencies:
+    domelementtype "~1.1.1"
+    entities "~1.1.1"
+
 domain-browser@^1.1.1:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/domain-browser/-/domain-browser-1.2.0.tgz#3d31f50191a6749dd1375a7f522e823d42e54eda"
   integrity sha512-jnjyiM6eRyZl2H+W8Q/zLMA481hzi0eszAaBUzIVnmYVDBbnLxVNnfu1HgEBvCbL+71FrxMl3E6lpKH7Ge3OXA==
 
+domelementtype@1, domelementtype@^1.3.0:
+  version "1.3.1"
+  resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-1.3.1.tgz#d048c44b37b0d10a7f2a3d5fee3f4333d790481f"
+  integrity sha512-BSKB+TSpMpFI/HOxCNr1O8aMOTZ8hT3pM3GQ0w/mWRmkhEDSFJkkyzz4XQsBV44BChwGkrDfMyjVD0eA2aFV3w==
+
+domelementtype@~1.1.1:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-1.1.3.tgz#bd28773e2642881aec51544924299c5cd822185b"
+  integrity sha1-vSh3PiZCiBrsUVRJJCmcXNgiGFs=
+
+domhandler@^2.3.0:
+  version "2.4.2"
+  resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-2.4.2.tgz#8805097e933d65e85546f726d60f5eb88b44f803"
+  integrity sha512-JiK04h0Ht5u/80fdLMCEmV4zkNh2BcoMFBmZ/91WtYZ8qVXSKjiw7fXMgFPnHcSZgOo3XdinHvmnDUeMf5R4wA==
+  dependencies:
+    domelementtype "1"
+
+domutils@^1.5.1:
+  version "1.7.0"
+  resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.7.0.tgz#56ea341e834e06e6748af7a1cb25da67ea9f8c2a"
+  integrity sha512-Lgd2XcJ/NjEw+7tFvfKxOzCYKZsdct5lczQ2ZaQY8Djz7pfAD3Gbp8ySJWtreII/vDlMVmxwa6pHmdxIYgttDg==
+  dependencies:
+    dom-serializer "0"
+    domelementtype "1"
+
 [email protected]:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/ee-first/-/ee-first-1.1.1.tgz#590c61156b0ae2f4f0255732a158b266bc56b21d"
@@ -1662,6 +1702,11 @@ ent@~2.2.0:
   resolved "https://registry.yarnpkg.com/ent/-/ent-2.2.0.tgz#e964219325a21d05f44466a2f686ed6ce5f5dd1d"
   integrity sha1-6WQhkyWiHQX0RGai9obtbOX13R0=
 
+entities@^1.1.1, entities@~1.1.1:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/entities/-/entities-1.1.2.tgz#bdfa735299664dfafd34529ed4f8522a275fea56"
+  integrity sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w==
+
 errno@^0.1.3:
   version "0.1.7"
   resolved "https://registry.yarnpkg.com/errno/-/errno-0.1.7.tgz#4684d71779ad39af177e3f007996f7c67c852618"
@@ -2194,6 +2239,18 @@ hosted-git-info@^2.1.4:
   resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-2.7.1.tgz#97f236977bd6e125408930ff6de3eec6281ec047"
   integrity sha512-7T/BxH19zbcCTa8XkMlbK5lTo1WtgkFi3GvdWEyNuc4Vex7/9Dqbnpsf4JMydcfj9HCg4zUWFTL3Za6lapg5/w==
 
+htmlparser2@^3.9.0:
+  version "3.10.0"
+  resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-3.10.0.tgz#5f5e422dcf6119c0d983ed36260ce9ded0bee464"
+  integrity sha512-J1nEUGv+MkXS0weHNWVKJJ+UrLfePxRWpN3C9bEi9fLxL2+ggW94DQvgYVXsaT30PGwYRIZKNZXuyMhp3Di4bQ==
+  dependencies:
+    domelementtype "^1.3.0"
+    domhandler "^2.3.0"
+    domutils "^1.5.1"
+    entities "^1.1.1"
+    inherits "^2.0.1"
+    readable-stream "^3.0.6"
+
 [email protected], http-errors@~1.6.3:
   version "1.6.3"
   resolved "https://registry.yarnpkg.com/http-errors/-/http-errors-1.6.3.tgz#8b55680bb4be283a0b5bf4ea2e38580be1d9320d"
@@ -3505,6 +3562,13 @@ react-dom@^16.7.0:
     prop-types "^15.6.2"
     scheduler "^0.12.0"
 
+react-html-parser@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/react-html-parser/-/react-html-parser-2.0.2.tgz#6dbe1ddd2cebc1b34ca15215158021db5fc5685e"
+  integrity sha512-XeerLwCVjTs3njZcgCOeDUqLgNIt/t+6Jgi5/qPsO/krUWl76kWKXMeVs2LhY2gwM6X378DkhLjur0zUQdpz0g==
+  dependencies:
+    htmlparser2 "^3.9.0"
+
 react@^16.7.0:
   version "16.7.0"
   resolved "https://registry.yarnpkg.com/react/-/react-16.7.0.tgz#b674ec396b0a5715873b350446f7ea0802ab6381"
@@ -3545,6 +3609,15 @@ readable-stream@^2.0.1, readable-stream@^2.0.2, readable-stream@^2.0.6, readable
     string_decoder "~1.1.1"
     util-deprecate "~1.0.1"
 
+readable-stream@^3.0.6:
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-3.1.1.tgz#ed6bbc6c5ba58b090039ff18ce670515795aeb06"
+  integrity sha512-DkN66hPyqDhnIQ6Jcsvx9bFjhw214O4poMBcIMgPVpQvNy9a0e0Uhg5SqySyDKAmUlwt8LonTBz1ezOnM8pUdA==
+  dependencies:
+    inherits "^2.0.3"
+    string_decoder "^1.1.1"
+    util-deprecate "^1.0.1"
+
 readdirp@^2.0.0:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-2.2.1.tgz#0e87622a3325aa33e892285caf8b4e846529a525"
@@ -3996,7 +4069,7 @@ string-width@^1.0.1:
     is-fullwidth-code-point "^2.0.0"
     strip-ansi "^4.0.0"
 
-string_decoder@^1.0.0:
+string_decoder@^1.0.0, string_decoder@^1.1.1:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-1.2.0.tgz#fe86e738b19544afe70469243b2a1ee9240eae8d"
   integrity sha512-6YqyX6ZWEYguAxgZzHGL7SsCeGx3V2TtOTqZz1xSTSWnqsbWwbptafNyvf/ACquZUXV3DANr5BDIwNYe1mN42w==
@@ -4273,7 +4346,7 @@ [email protected]:
     lru-cache "4.1.x"
     tmp "0.0.x"
 
-util-deprecate@~1.0.1:
+util-deprecate@^1.0.1, util-deprecate@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
   integrity sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=