refactor(project): add tests and other things

Author: olavoparno

.eslintrc.js

@@ -2,11 +2,16 @@ module.exports = {
   env: {
     browser: true,
     es2020: true,
+    'jest/globals': true
+  },
+  globals: {
+    JestMockFn: true,
   },
   extends: [
     'plugin:react/recommended',
     'airbnb',
     'plugin:prettier/recommended',
+    'plugin:jest/recommended'
   ],
   parserOptions: {
     ecmaFeatures: {
@@ -15,7 +20,7 @@ module.exports = {
     ecmaVersion: 11,
     sourceType: 'module',
   },
-  plugins: ['react', 'react-hooks', 'prettier'],
+  plugins: ['jest', 'react', 'react-hooks', 'prettier'],
   settings: {
     'import/resolver': {
       node: {

.gitignore

@@ -22,3 +22,5 @@ yarn-debug.log*
 yarn-error.log*
 
 .vercel
+
+coverage

.versionrc.js

@@ -0,0 +1,13 @@
+module.exports = {
+  types: [
+    {type: 'feat', section: 'Features'},
+    {type: 'fix', section: 'Bug Fixes'},
+    {type: 'test', section: 'Tests'},
+    {type: 'docs', section: 'Documentation'},
+    {type: 'build', section: 'Build System'},
+    {type: 'perf', section: 'Performance Issues'},
+    {type: 'style', section: 'Styling'},
+    {type: 'ci', section: 'Pipelines'},
+    {type: 'refactor', section: 'Refactors'},
+  ],
+};

README.md

@@ -8,6 +8,10 @@
 
 ---
 
+| Statements                                                            | Branches                                                            | Functions                                                            | Lines                                                            |
+| --------------------------------------------------------------------- | ------------------------------------------------------------------- | -------------------------------------------------------------------- | ---------------------------------------------------------------- |
+| ![Statements](https://img.shields.io/badge/Coverage-64.65%25-red.svg) | ![Branches](https://img.shields.io/badge/Coverage-59.38%25-red.svg) | ![Functions](https://img.shields.io/badge/Coverage-57.58%25-red.svg) | ![Lines](https://img.shields.io/badge/Coverage-64.44%25-red.svg) |
+
 ## Table of Contents
 
 - [Running example](#running-example)
@@ -20,9 +24,9 @@
 
 ## Running example
 
-| Plain                           |
-| ------------------------------- |
-| ![Example](./assets/readme.gif) |
+| Plain                                                           |
+| --------------------------------------------------------------- |
+| ![Example](./assets/readme.gif)                                 |
 | [Preview!](https://codesandbox.io/s/react-use-downloader-0zzoq) |
 
 ---
@@ -38,8 +42,8 @@ npm install --save react-use-downloader
 ## Usage
 
 ```jsx
-import React from "react";
-import useDownloader from "react-use-downloader";
+import React from 'react';
+import useDownloader from 'react-use-downloader';
 
 export default function App() {
   const {
@@ -49,21 +53,21 @@ export default function App() {
     download,
     cancel,
     error,
-    isInProgress
+    isInProgress,
   } = useDownloader();
 
-  const fileUrl = "https://olavoparno.github.io/saywololo/sounds/Wololo1.wav";
+  const fileUrl =
+    'https://upload.wikimedia.org/wikipedia/commons/4/4d/%D0%93%D0%BE%D0%B2%D0%B5%D1%80%D0%BB%D0%B0_%D1%96_%D0%9F%D0%B5%D1%82%D1%80%D0%BE%D1%81_%D0%B2_%D0%BF%D1%80%D0%BE%D0%BC%D1%96%D0%BD%D1%8F%D1%85_%D0%B2%D1%80%D0%B0%D0%BD%D1%96%D1%88%D0%BD%D1%8C%D0%BE%D0%B3%D0%BE_%D1%81%D0%BE%D0%BD%D1%86%D1%8F.jpg';
+  const filename = 'beautiful-carpathia.jpg';
 
   return (
     <div className="App">
       <p>Download is in {isInProgress ? 'in progress' : 'stopped'}</p>
-      <button onClick={() => download(fileUrl, "filename")}>
+      <button onClick={() => download(fileUrl, filename)}>
         Click to download the file
       </button>
       <button onClick={() => cancel()}>Cancel the download</button>
-      <p>
-        Download size in bytes {size}
-      </p>
+      <p>Download size in bytes {size}</p>
       <label for="file">Downloading progress:</label>
       <progress id="file" value={percentage} max="100" />
       <p>Elapsed time in seconds {elapsed}</p>
@@ -93,14 +97,14 @@ export default function App() {
 
 ```jsx
 const {
-    size,
-    elapsed,
-    percentage,
-    download,
-    cancel,
-    error,
-    isInProgress
-  } = useDownloader();
+  size,
+  elapsed,
+  percentage,
+  download,
+  cancel,
+  error,
+  isInProgress,
+} = useDownloader();
 ```
 
 ---

babel.config.js

@@ -0,0 +1,4 @@
+module.exports = {
+  presets: ["@babel/preset-env"],
+  plugins: ["@babel/plugin-transform-runtime"]
+};

jest.config.js

@@ -0,0 +1,8 @@
+module.exports = {
+  transform: {
+    "^.+\\.(js|jsx)$": "babel-jest"
+  },
+  coverageReporters: [
+    "json-summary"
+  ],
+};