Added Snapshot tests

.babelrc

@@ -1,7 +1,3 @@
 {
-  "presets": ["es2015-rollup"],
-  "plugins": [
-    "transform-react-jsx",
-    "transform-object-rest-spread"
-  ]
+  "presets": ["env", "react"]
 }

README.md

@@ -48,5 +48,4 @@ Than use it
 See [releases](https://github.com/dominikbulaj/react-scroll-into-view/releases) tab
 
 ## TODO
-* tests
 * support for all [element.scrollIntoView](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView) parameters

package.json

@@ -5,7 +5,7 @@
   "main": "dist/index.js",
   "scripts": {
     "build": "rollup -c",
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "jest"
   },
   "repository": {
     "type": "git",
@@ -23,10 +23,17 @@
   "homepage": "https://github.com/dominikbulaj/react-scroll-into-view#readme",
   "devDependencies": {
     "babel-cli": "^6.26.0",
+    "babel-jest": "^23.6.0",
     "babel-plugin-transform-object-rest-spread": "^6.26.0",
     "babel-plugin-transform-react-jsx": "^6.24.1",
+    "babel-preset-env": "^1.7.0",
     "babel-preset-es2015-rollup": "^3.0.0",
+    "babel-preset-react": "^6.24.1",
+    "jest": "^23.6.0",
     "prop-types": "^15.6.1",
+    "react": "^16.5.2",
+    "react-dom": "^16.5.2",
+    "react-test-renderer": "^16.5.2",
     "recompose": "^0.26.0",
     "rollup": "^0.57.1",
     "rollup-plugin-babel": "^3.0.3",

rollup.config.js

@@ -15,8 +15,12 @@ export default {
     }),
     resolve(),
     babel({
-      exclude: 'node_modules/**'
+      babelrc: false,
+      presets: ['es2015-rollup'],
+      exclude: 'node_modules/**',
+      plugins: ['transform-react-jsx', 'transform-object-rest-spread'],
     }),
+
     uglify()
   ],
   external: ['react']

src/__snapshots__/index.test.js.snap

@@ -0,0 +1,58 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ScrollInto renders with children 1`] = `
+<div
+  className=""
+  onClick={[Function]}
+  style={Object {}}
+>
+  <div>
+    Some child content
+  </div>
+</div>
+`;
+
+exports[`ScrollInto renders with custom className 1`] = `
+<div
+  className="custom-class"
+  onClick={[Function]}
+  style={Object {}}
+>
+  <div>
+    Some child content
+  </div>
+</div>
+`;
+
+exports[`ScrollInto renders with custom styles 1`] = `
+<div
+  className=""
+  onClick={[Function]}
+  style={
+    Object {
+      "display": "inline",
+    }
+  }
+>
+  <div>
+    Some child content
+  </div>
+</div>
+`;
+
+exports[`ScrollInto renders with custom styles and className 1`] = `
+<div
+  className="pinky"
+  onClick={[Function]}
+  style={
+    Object {
+      "color": "red",
+      "display": "inline",
+    }
+  }
+>
+  <div>
+    Some child content
+  </div>
+</div>
+`;

src/index.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import {compose, defaultProps, withHandlers} from 'recompose'
+import { compose, defaultProps, withHandlers } from 'recompose'
 
 const ScrollInto = ({children, scrollIntoView, style, className}) => (
   <div style={style} className={className} onClick={scrollIntoView}>
@@ -16,16 +16,12 @@ ScrollInto.propTypes = {
   className: PropTypes.string,
 }
 
-ScrollInto.defaultProps = {
-  className: '',
-  style: {}
-}
-
 export default compose(
   defaultProps({
     smooth: true,
     style: {},
-    alignToTop: false
+    alignToTop: false,
+    className: ''
   }),
   withHandlers({
     scrollIntoView: ({selector, smooth, alignToTop}) => _ => {

src/index.test.js

@@ -0,0 +1,55 @@
+import React from 'react'
+import ScrollInto from './index'
+import renderer from 'react-test-renderer'
+
+test('ScrollInto renders with children', () => {
+  const component = renderer.create(
+    <ScrollInto selector="test">
+      <div>
+        Some child content
+      </div>
+    </ScrollInto>,
+  )
+
+  let tree = component.toJSON()
+  expect(tree).toMatchSnapshot()
+})
+
+test('ScrollInto renders with custom className', () => {
+  const component = renderer.create(
+    <ScrollInto selector="test" className="custom-class">
+      <div>
+        Some child content
+      </div>
+    </ScrollInto>,
+  )
+
+  let tree = component.toJSON()
+  expect(tree).toMatchSnapshot()
+})
+
+test('ScrollInto renders with custom styles', () => {
+  const component = renderer.create(
+    <ScrollInto selector="test" style={{display: 'inline'}}>
+      <div>
+        Some child content
+      </div>
+    </ScrollInto>,
+  )
+
+  let tree = component.toJSON()
+  expect(tree).toMatchSnapshot()
+})
+
+test('ScrollInto renders with custom styles and className', () => {
+  const component = renderer.create(
+    <ScrollInto selector="test" style={{display: 'inline', color: 'red'}} className="pinky">
+      <div>
+        Some child content
+      </div>
+    </ScrollInto>,
+  )
+
+  let tree = component.toJSON()
+  expect(tree).toMatchSnapshot()
+})