Support shallow assertions of components with complex props

Author: developit

package.json

@@ -35,7 +35,7 @@
     "preact": "^5.6.0"
   },
   "dependencies": {
-    "preact-render-to-string": "^2.7.0"
+    "preact-render-to-string": "^3.0.0"
   },
   "greenkeeper": {
     "ignore": [

src/index.js

@@ -10,6 +10,8 @@ export const options = {};
 // options to pass to renderToString() when doing a deep comparison
 const RENDER_OPTS = {
 	sortAttributes: true,
+	xml: true,
+	jsx: true,
 	pretty: true
 };
 

test/index.js

@@ -78,5 +78,17 @@ describe('preact-jsx-chai', () => {
 			expect(<Outer />).to.eql(<span b1="b">1</span>);
 			expect(<Outer a />).not.to.eql(<Outer b />);
 		});
+
+		it('should shallow-compare components with complex props', () => {
+			let counter = 0;
+			const Outer = () => <Inner b={['a','b','c']} c={{ foo:'bar' }} />;
+			const Inner = ({ b }) => <span b1={b+''}>{++counter}</span>;
+			expect(<Outer a />).to.equal(<Inner b={['a','b','c']} c={{ foo:'bar' }} />);
+
+			// make sure inequality within an attribute generates a failed assertion:
+			expect( () => {
+				expect(<Outer a />).to.equal(<Inner b={['a','c','c']} c={{ foo:'bar' }} />);
+			}).to.throw(/"b".*?"c"/);	// really loose here, but it would fail if the assertion stopped working
+		});
 	});
 });