Tests add

.npmignore

@@ -10,4 +10,7 @@ node_modules/
 .gitignore
 .idea
 .npmignore
-*.iml
+*.iml
+.travis.yml
+test.js
+package-lock.json

.travis.yml

@@ -0,0 +1,5 @@
+language: node_js
+node_js:
+  - '8'
+  - '6'
+  - '4'

docs/index.html

@@ -24,6 +24,7 @@ <h1>
             <a href="https://www.npmjs.com/package/react-xmasonry"><img src="https://img.shields.io/npm/v/react-xmasonry.svg" alt="npm" class="badge"/></a>
             <a href="http://npm.anvaka.com/#/view/2d/react-xmasonry"><img src="https://img.shields.io/badge/dependencies-none-brightgreen.svg" alt="Dependencies" class="badge"/></a>
             <a href="https://www.codacy.com/app/ZitRos/react-xmasonry?utm_source=github.com&amp;utm_medium=referral&amp;utm_content=ZitRos/react-xmasonry&amp;utm_campaign=Badge_Grade"><img src="https://api.codacy.com/project/badge/Grade/c073dc0dc2744d5b950418bf5fbcc820" alt="Codacy Badge"/></a>
+            <a href="https://travis-ci.org/ZitRos/react-xmasonry"><img src="https://travis-ci.org/ZitRos/react-xmasonry.svg?branch=master" alt="Build Status" class="badge"/></a>
             <a href="https://www.npmjs.com/package/react-xmasonry"><img src="https://img.shields.io/npm/dm/react-xmasonry.svg" alt="npm" class="badge"/></a>
             <a href="https://github.com/ZitRos/react-xmasonry/blob/master/LICENSE"><img src="https://img.shields.io/github/license/mashape/apistatus.svg" alt="License" class="badge"/></a>
             <a href="https://github.com/ZitRos/react-xmasonry/blob/master/dist/index.js"><img src="http://img.badgesize.io/ZitRos/react-xmasonry/master/dist/index.js" alt="File Size" class="badge"/></a>

package.json

@@ -5,7 +5,8 @@
   "main": "dist/index.js",
   "module": "src/index.jsx",
   "scripts": {
-    "build": "webpack -p"
+    "build": "webpack -p",
+    "test": "ava"
   },
   "author": "ZitRo",
   "license": "MIT",
@@ -36,6 +37,7 @@
     "react": ">= 0.14.0"
   },
   "devDependencies": {
+    "ava": "^0.21.0",
     "babel-core": "^6.25.0",
     "babel-loader": "^7.1.1",
     "babel-preset-es2015": "^6.24.1",

readme.md

@@ -3,6 +3,7 @@
 [![npm](https://img.shields.io/npm/v/react-xmasonry.svg)](https://www.npmjs.com/package/react-xmasonry)
 [![Dependencies](https://img.shields.io/badge/dependencies-none-brightgreen.svg)](http://npm.anvaka.com/#/view/2d/react-xmasonry)
 [![Codacy Badge](https://api.codacy.com/project/badge/Grade/c073dc0dc2744d5b950418bf5fbcc820)](https://www.codacy.com/app/ZitRos/react-xmasonry?utm_source=github.com&utm_medium=referral&utm_content=ZitRos/react-xmasonry&utm_campaign=Badge_Grade)
+[![Build Status](https://travis-ci.org/ZitRos/react-xmasonry.svg?branch=master)](https://travis-ci.org/ZitRos/react-xmasonry)
 [![npm](https://img.shields.io/npm/dm/react-xmasonry.svg)](https://www.npmjs.com/package/react-xmasonry)
 [![License](https://img.shields.io/github/license/zitros/react-xmasonry.svg)](LICENSE)
 [![File Size](http://img.badgesize.io/ZitRos/react-xmasonry/master/dist/index.js)](https://github.com/ZitRos/react-xmasonry/blob/master/dist/index.js)

test.js

@@ -0,0 +1,87 @@
+import test from "ava";
+import * as pkg from "./package.json";
+import { existsSync } from "fs";
+import React from "react";
+import { renderToString } from "react-dom/server";
+import { XMasonry, XBlock } from "./dist/index.js";
+
+const elementToTest = React.createElement(XMasonry, { maxColumns: 2 },
+    React.createElement(XBlock, {}, [
+        React.createElement("h1", {}, "Heading-1!"),
+        React.createElement("div", {}, "Contents-1.")
+    ]),
+    React.createElement(XBlock, {}, [
+        React.createElement("h1", {}, "Heading-2!"),
+        React.createElement("div", {}, "Contents-2.")
+    ]),
+    React.createElement(XBlock, { width: 2 }, [
+        React.createElement("h1", {}, "Heading-3!"),
+        React.createElement("div", {}, "Contents-3.")
+    ]),
+    React.createElement(XBlock, { width: 5 }, [
+        React.createElement("h1", {}, "Heading-4!"),
+        React.createElement("div", {}, "Contents-4.")
+    ])
+);
+
+test(`Package metadata corresponds to file locations`, async (it) => {
+
+    it.is(true, existsSync(pkg.main));
+    it.is(true, existsSync(pkg.module));
+
+});
+
+test(`Server rendering renders contents`, (it) => {
+
+    const string = renderToString(React.cloneElement(elementToTest));
+
+    it.is(4, string.match(/Heading-/g).length);
+    it.is(4, string.match(/Contents-/g).length);
+
+});
+
+test(`Assigns widths to XBlocks`, (it) => {
+
+    const string = renderToString(React.cloneElement(elementToTest));
+
+    it.is(4, string.match(/width:[0-9]+px/g).length);
+
+});
+
+test(`Correct widths applied`, (it) => {
+
+    const string = renderToString(React.cloneElement(elementToTest));
+
+    const widths = string.match(/width:[0-9]+px/g)
+                         .map(s => +s.match(/[0-9]+/)[0])
+                         .sort((a, b) => a - b);
+    const oneColumnWidth = widths.reduce((min, v) => Math.min(min, v));
+
+    it.deepEqual([1, 1, 2, 2], widths.map(w => w / oneColumnWidth));
+
+});
+
+test(`Property maxColumns applies properly`, (it) => {
+
+    const string = renderToString(React.cloneElement(elementToTest));
+
+    const widths = string.match(/width:[0-9]+px/g).map(s => +s.match(/[0-9]+/)[0]);
+    const oneColumnWidth = widths.reduce((min, v) => Math.min(min, v));
+    const maxAllowedColumnWidth = oneColumnWidth * 2;
+    const hasLongColumns = widths.reduce((has, w) => has && w > maxAllowedColumnWidth, false);
+
+    it.is(false, hasLongColumns);
+
+});
+
+test(`Applies "xmasonry-static" and "xblock-static" classes when rendered on the server`, (it) => {
+
+    const string = renderToString(React.cloneElement(elementToTest));
+
+    const classes = string.match(/xmasonry(?:-static)?|xblock(?:-static)?/g)
+                          .filter((e, i, arr) => arr.indexOf(e) === i)
+                          .sort((a, b) => a > b ? 1 : a < b ? -1 : 0);
+
+    it.deepEqual(["xblock", "xblock-static", "xmasonry", "xmasonry-static"], classes);
+
+});