Update Travis to upload our coverage

.travis.yml

@@ -1,3 +1,13 @@
+sudo: false
 language: node_js
 node_js:
-  - "8.0"
+  - '10'
+notifications:
+  email: false
+cache:
+  directories: -node_modules
+script:
+  - npm run test
+  - npm run coverage
+after_sucess:
+  - npm run report-coverage

README.md

@@ -1,81 +1,97 @@
-
 <p align="center">
   <img src="https://github.com/ooade/react-rough/raw/master/logo.png" height="150" />
   <h3 align="center">React Bindings for <a href="https://github.com/pshihn/rough">Rough.js</a></h3>
   <p align="center">
-  <a href="https://www.npmjs.org/package/react-rough"><img src="https://img.shields.io/npm/v/react-rough.svg?style=flat" alt="npm"></a> <a href="https://travis-ci.org/ooade/react-rough"><img src="https://travis-ci.org/ooade/react-rough.svg?branch=master" alt="travis"></a>
+  <a href="https://www.npmjs.org/package/react-rough"><img src="https://img.shields.io/npm/v/react-rough.svg?style=flat" alt="npm"></a>
+  <a href="https://travis-ci.org/ooade/react-rough"><img src="https://travis-ci.org/ooade/react-rough.svg?branch=master" alt="travis"></a>
+  <a href="https://github.com/ooade/react-rough"><img src="https://img.shields.io/codecov/c/github/ooade/react-rough.svg?style=flat-square" alt="code coverage"></a>
   <a href="https://snyk.io/test/github/ooade/react-rough"><img src="https://snyk.io/test/github/ooade/react-rough/badge.svg" alt="Known Vulnerabilities" data-canonical-src="https://snyk.io/test/github/ooade/react-rough" style="max-width:100%;"></a>
   <a href="http://makeapullrequest.com"><img src="https://img.shields.io/badge/PR(s)-welcome-brightgreen.svg?style=flat" alt="pullrequest"></a>
   <a href="http://www.firsttimersonly.com"><img src="https://img.shields.io/badge/first--timers--only-friendly-blue.svg" alt="firsttimersonly"></a>
   </p>
 </p>
 
 ## Usage
+
 Grab the Shape to be rendered from ReactRough, pass some options to it, pass an optional [onRender](https://github.com/ooade/react-rough/blob/master/src/index.js#L17) hook to spin up some animation logic or so.
 
-**Latest Release (next):** Check [this](https://github.com/ooade/react-rough/releases/tag/v1.0.0-alpha.1) guide which uses a very simple render prop approach. 
+**Latest Release (next):** Check [this](https://github.com/ooade/react-rough/releases/tag/v1.0.0-alpha.1) guide which uses a very simple render prop approach.
 
 ### Render a Rectangle
+
 ```js
 import { Rectangle } from 'react-rough';
 
 const options = {
-  data: [10, 10, 200, 200], // x, y, width, height
-  fill: 'red',
-  fillWeight: 3
-}
+	data: [10, 10, 200, 200], // x, y, width, height
+	fill: 'red',
+	fillWeight: 3
+};
 
-render(
-  <Rectangle width={220} height={220} options={options}/>
-);
+render(<Rectangle width={220} height={220} options={options} />);
 ```
 
 When you grab a shape from ReactRough, it renders each shape to a canvas element. So how can we render different shapes on a single canvas element? We'll answer that below.
 
 ### Render shapes on one canvas element
+
 ```js
 import { ReactRough, Rectangle, Circle } from 'react-rough';
 
 render(
-  <ReactRough width={500} height={500}>
-    <Rectangle options={{
-        data: [10, 10, 200, 200], // x, y, width, height
-        fill: 'red',
-        fillWeight: 3
-      }}/>
-    <Circle options={{
-      data: [80, 120, 50], // centerX, centerY, radius
-      fill: 'blue'
-    }}/>
-  </ReactRough>
+	<ReactRough width={500} height={500}>
+		<Rectangle
+			options={{
+				data: [10, 10, 200, 200], // x, y, width, height
+				fill: 'red',
+				fillWeight: 3
+			}}
+		/>
+		<Circle
+			options={{
+				data: [80, 120, 50], // centerX, centerY, radius
+				fill: 'blue'
+			}}
+		/>
+	</ReactRough>
 );
 ```
 
 ### onRender hook
+
 We can have the hook on a shape element, ReactRough element or both. Here's an example on a shape element.
+
 ```js
 const increaseWidth = rect => {
-  if (rect.width < 200) {
-    rect.width = rect.width + 10;
-    setTimeout(() => increaseWidth(rect), 100);
-  }
+	if (rect.width < 200) {
+		rect.width = rect.width + 10;
+		setTimeout(() => increaseWidth(rect), 100);
+	}
 };
 
 const options = {
-  data: [10,10,20,100],
-  fill: 'red',
-  hachureGap: 8
+	data: [10, 10, 20, 100],
+	fill: 'red',
+	hachureGap: 8
 };
 
-render (
-  <Rectangle width={220} height={220} options={options} onRender={increaseWidth}/>
+render(
+	<Rectangle
+		width={220}
+		height={220}
+		options={options}
+		onRender={increaseWidth}
+	/>
 );
 ```
+
 This increases the rectangle's width from 20px to 200px. Wanna see it in action on a ReactRough component? Check out our ReactRough animated logo example.
 
 ## Examples
- - [ReactRough animated logo](https://jsfiddle.net/ooade/f8cmbfwL/)
- - Add yours...
+
+- [ReactRough animated logo](https://jsfiddle.net/ooade/f8cmbfwL/)
+- Add yours...
 
 ## License
+
 MIT

package.json

@@ -11,6 +11,7 @@
 		"coverage": "jest --coverage",
 		"build": "npm-run-all rollup minify:*",
 		"rollup": "rollup -c rollup.config.js",
+		"report-coverage": "cat ./coverage/lcov.info | codecov",
 		"minify:cjs": "uglifyjs $npm_package_main -cm -o $npm_package_main --source-map",
 		"minify:umd": "uglifyjs $npm_package_umd -cm toplevel -o $npm_package_umd --source-map"
 	},
@@ -33,6 +34,7 @@
 		"@babel/preset-react": "^7.0.0",
 		"babel-cli": "^6.26.0",
 		"babel-plugin-transform-react-remove-prop-types": "^0.4.24",
+		"codecov.io": "^0.1.6",
 		"enzyme": "^3.8.0",
 		"enzyme-adapter-react-16": "^1.8.0",
 		"eslint": "^5.13.0",