Merge pull request #10 from edoroshenko/fix-server-side-rendering

Fix SSR

.travis.yml

@@ -0,0 +1,3 @@
+language: node_js
+node_js:
+  - "lts/*"

package.json

@@ -25,9 +25,11 @@
     "eslint-plugin-import": "^2.2.0",
     "eslint-plugin-jsx-a11y": "^4.0.0",
     "eslint-plugin-react": "^6.10.3",
+    "jest": "^21.2.1",
     "npmpub": "^3.1.0",
     "prop-types": "^15.5.8",
-    "react": "^16.0.0"
+    "react": "^16.0.0",
+    "react-dom": "^16.1.1"
   },
   "peerDependencies": {
     "prop-types": "^15.5.0",
@@ -37,8 +39,9 @@
   "scripts": {
     "clean": "rm -rf lib",
     "lint": "eslint src/",
-    "build": "babel ./src --out-dir ./lib --source-maps -d ./lib",
+    "build": "babel ./src --out-dir ./lib --source-maps -d ./lib --ignore spec.js",
     "prepublish": "npm run clean && npm run build",
-    "release": "npmpub"
+    "release": "npmpub",
+    "test": "jest"
   }
 }

src/ResponsiveMasonry.js

@@ -8,7 +8,7 @@ class MasonryResponsive extends React.Component {
     super(props)
 
     this.state = {
-      columnsCount: null,
+      columnsCount: DEFAULT_COLUMNS_COUNT,
     }
 
     this.handleResize = this.handleResize.bind(this)

src/__tests__/ResponsiveMasonry.spec.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import { renderToString } from 'react-dom/server';
+import Masonry, { ResponsiveMasonry } from '../';
+
+describe('server-side rendering', () => {
+  it('should render on server', () => {
+    const content = 'Custom content inside ResponsiveMasonry wrapper';
+    const result = renderToString(<ResponsiveMasonry>
+      <Masonry><div>{content}</div></Masonry>
+    </ResponsiveMasonry>);
+
+    expect(result.match(RegExp(content))).not.toBeNull();
+  })
+});