0.1.2

- will recursively generate output directory if it doesn't exist - bundles font-awesome with output - adds storybook
gabrielcsapo · Sep 18, 2017 · a54ca83 · a54ca83
1 parent bb0ee99
commit a54ca83
Show file tree

Hide file tree

Showing 36 changed files with 5,853 additions and 193 deletions.
diff --git a/.eslintignore b/.eslintignore
@@ -1,3 +1,3 @@
 node_modules
-src
 coverage
+docs
diff --git a/.eslintrc b/.eslintrc
@@ -1,7 +1,29 @@
 {
-  "extends": "eslint:recommended",
-  "env": {
-      "es6": true,
-      "node": true
-  }
+    "extends": [
+        "eslint:recommended",
+        "plugin:react/recommended"
+    ],
+    "globals": {
+        "config": true,
+        "report": true
+    },
+    "env": {
+        "es6": true,
+        "node": true,
+        "browser": true
+    },
+    "rules": {
+      "react/prop-types": 0,
+      "react/jsx-key": 0
+    },
+    "parserOptions": {
+        "ecmaVersion": 6,
+        "sourceType": "module",
+        "ecmaFeatures": {
+            "jsx": true
+        }
+    },
+    "plugins": [
+        "react"
+    ]
 }
diff --git a/.storybook/config.js b/.storybook/config.js
@@ -0,0 +1,11 @@
+import '../src/style.css';
+import 'font-awesome/css/font-awesome.css';
+import 'psychic-ui/dist/psychic-min.css';
+
+import { configure } from '@storybook/react';
+
+function loadStories() {
+  require('../stories');
+}
+
+configure(loadStories, module);
diff --git a/.storybook/webpack.config.js b/.storybook/webpack.config.js
@@ -0,0 +1,27 @@
+module.exports = {
+  plugins: [],
+  module: {
+    rules: [{
+        test: /\.css$/,
+        use: [{
+            loader: "style-loader"
+          },
+          {
+            loader: "css-loader"
+          }
+        ]
+      }, {
+        test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
+        use: [{
+          loader: "url-loader?limit=10000&mimetype=application/font-woff"
+        }]
+      },
+      {
+        test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
+        use: [{
+          loader: "file-loader"
+        }]
+      }
+    ]
+  }
+};
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,9 @@
+# 0.1.2 (09/17/2017)
+
+- will recursively generate output directory if it doesn't exist
+- bundles font-awesome with output
+- adds storybook
+
 # 0.1.1 (09/13/2017)
 
 - fixes error when data is undefined and the extra event is triggered

diff --git a/README.md b/README.md
@@ -28,14 +28,8 @@ Options:
   -h, --help        output usage information
 ```
 
-## Example
-
 > This will generate a tap-html.html file
 
 ```
 tape test/**.js | tap-html --out ./tap-html.html
 ```
-
-## Example
-
-![example](./examples/example.png)
diff --git a/docs/example.png b/docs/example.png
diff --git a/docs/example/674f50d287a8c48dc19ba404d20fe713.eot b/docs/example/674f50d287a8c48dc19ba404d20fe713.eot
diff --git a/docs/example/912ec66d7572ff821749319396470bde.svg b/docs/example/912ec66d7572ff821749319396470bde.svg
diff --git a/docs/example/af7ae505a9eed503f8b8e6982036873e.woff2 b/docs/example/af7ae505a9eed503f8b8e6982036873e.woff2
diff --git a/docs/example/b06871f281fee6b241d60582ae9369b9.ttf b/docs/example/b06871f281fee6b241d60582ae9369b9.ttf
diff --git a/docs/example/fee66e712a8a08eef5805a46892932ad.woff b/docs/example/fee66e712a8a08eef5805a46892932ad.woff
diff --git a/docs/example/index.html b/docs/example/index.html
diff --git a/docs/index.html b/docs/index.html
diff --git a/docs/psychic-min.css b/docs/psychic-min.css
diff --git a/docs/storybook/674f50d287a8c48dc19ba404d20fe713.eot b/docs/storybook/674f50d287a8c48dc19ba404d20fe713.eot
diff --git a/docs/storybook/912ec66d7572ff821749319396470bde.svg b/docs/storybook/912ec66d7572ff821749319396470bde.svg
diff --git a/docs/storybook/af7ae505a9eed503f8b8e6982036873e.woff2 b/docs/storybook/af7ae505a9eed503f8b8e6982036873e.woff2
diff --git a/docs/storybook/b06871f281fee6b241d60582ae9369b9.ttf b/docs/storybook/b06871f281fee6b241d60582ae9369b9.ttf
diff --git a/docs/storybook/favicon.ico b/docs/storybook/favicon.ico
diff --git a/docs/storybook/fee66e712a8a08eef5805a46892932ad.woff b/docs/storybook/fee66e712a8a08eef5805a46892932ad.woff
diff --git a/docs/storybook/iframe.html b/docs/storybook/iframe.html
@@ -0,0 +1,23 @@
+
+    <!DOCTYPE html>
+    <html>
+      <head>
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <base target="_parent">
+        <script>
+          if (window.parent !== window) {
+            window.__REACT_DEVTOOLS_GLOBAL_HOOK__ = window.parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
+          }
+        </script>
+        <title>Storybook</title>
+
+
+      </head>
+      <body>
+        <div id="root"></div>
+        <div id="error-display"></div>
+        <script src="static/preview.81e78ba2fb3159f5c441.bundle.js"></script>
+      </body>
+    </html>
+
diff --git a/docs/storybook/index.html b/docs/storybook/index.html
@@ -0,0 +1,46 @@
+
+    <!DOCTYPE html>
+    <html>
+      <head>
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <meta name="storybook-version" content="3.2.8">
+        <meta content="IE=edge" http-equiv="X-UA-Compatible" />
+        <title>Storybook</title>
+        <style>
+          /*
+            When resizing panels, the drag event breaks if the cursor
+            moves over the iframe. Add the 'dragging' class to the body
+            at drag start and remove it when the drag ends.
+           */
+          .dragging iframe {
+            pointer-events: none;
+          }
+
+          /* Styling the fuzzy search box placeholders */
+          .searchBox::-webkit-input-placeholder { /* Chrome/Opera/Safari */
+            color: #ddd;
+            font-size: 16px;
+          }
+
+          .searchBox::-moz-placeholder { /* Firefox 19+ */
+            color: #ddd;
+            font-size: 16px;
+          }
+
+          .searchBox:focus{
+            border-color: #EEE !important;
+          }
+
+          .btn:hover{
+            background-color: #eee
+          }
+        </style>
+
+      </head>
+      <body style="margin: 0;">
+        <div id="root"></div>
+        <script src="static/manager.ea32815e8d91d93bc7b0.bundle.js"></script>
+      </body>
+    </html>
+
diff --git a/docs/storybook/static/manager.ea32815e8d91d93bc7b0.bundle.js b/docs/storybook/static/manager.ea32815e8d91d93bc7b0.bundle.js
diff --git a/docs/storybook/static/preview.81e78ba2fb3159f5c441.bundle.js b/docs/storybook/static/preview.81e78ba2fb3159f5c441.bundle.js
diff --git a/examples/example.png b/examples/example.png
diff --git a/lib/generate.js b/lib/generate.js
@@ -7,84 +7,100 @@ const HtmlWebpackInlineSourcePlugin = require('html-webpack-inline-source-plugin
 
 module.exports = (report, outfile) => {
   // this should be configurable
-  const output = process.cwd();
-
-  const msf = new MemoryFileSystem();
+  const output = path.dirname(outfile) || process.cwd();
 
   var compiler = webpack({
-      entry: path.resolve(__dirname, '..', 'src', 'index.js'),
-      context: path.resolve(__dirname, '..'),
-      output: {
-          path: output,
-          filename: 'bundle.js'
-      },
-      module: {
-          rules: [{
-                  test: /\.css$/,
-                  use: [{
-                          loader: "style-loader"
-                      },
-                      {
-                          loader: "css-loader"
-                      }
-                  ]
-              },
-              {
-                  test: /\.js$/,
-                  exclude: /node_modules(?!\/tap-html)/,
-                  use: {
-                      loader: 'babel-loader',
-                      options: {
-                          presets: ['es2015', 'react']
-                      }
-                  }
-              }
+    entry: path.resolve(__dirname, '..', 'src', 'index.js'),
+    context: path.resolve(__dirname, '..'),
+    output: {
+      path: output,
+      filename: 'bundle.js'
+    },
+    module: {
+      rules: [{
+          test: /\.css$/,
+          use: [{
+              loader: "style-loader"
+            },
+            {
+              loader: "css-loader"
+            }
           ]
-      },
-      resolve: {
-          extensions: [ '.js', '.json', '.jsx', '.css' ],
-          modules: [path.resolve(__dirname, 'node_modules'), 'node_modules']
-      },
-      plugins: [
-          new webpack.DefinePlugin({
-              'process.env': {
-                  'NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'production')
-              },
-              report: JSON.stringify(report)
-          }),
-          new webpack.HotModuleReplacementPlugin(),
-          new webpack.optimize.UglifyJsPlugin({
-              comments: false,
-              compress: {
-                  unused: true,
-                  dead_code: true,
-                  warnings: false,
-                  drop_debugger: true,
-                  conditionals: true,
-                  evaluate: true,
-                  sequences: true,
-                  booleans: true,
-              }
-          }),
-          new webpack.optimize.AggressiveMergingPlugin(),
-          new HtmlWebpackPlugin({
-              filename: `${output}/tap-html.html`,
-              inlineSource: '.(js|css)$',
-              template: './src/template.html'
-          }),
-          new HtmlWebpackInlineSourcePlugin()
+        },
+        {
+          test: /\.js$/,
+          exclude: /node_modules(?!\/tap-html)/,
+          use: {
+            loader: 'babel-loader',
+            options: {
+              presets: ['es2015', 'react']
+            }
+          }
+        },
+        {
+          test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
+          use: [{
+            loader: "url-loader?limit=10000&mimetype=application/font-woff"
+          }]
+        },
+        {
+          test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
+          use: [{
+            loader: "file-loader"
+          }]
+        }
       ]
+    },
+    resolve: {
+      extensions: ['.js', '.json', '.jsx', '.css'],
+      modules: [path.resolve(__dirname, 'node_modules'), 'node_modules']
+    },
+    plugins: [
+      new webpack.DefinePlugin({
+        'process.env': {
+          'NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'production')
+        },
+        report: JSON.stringify(report)
+      }),
+      new webpack.HotModuleReplacementPlugin(),
+      new webpack.optimize.UglifyJsPlugin({
+        comments: false,
+        compress: {
+          unused: true,
+          dead_code: true,
+          warnings: false,
+          drop_debugger: true,
+          conditionals: true,
+          evaluate: true,
+          sequences: true,
+          booleans: true,
+        }
+      }),
+      new webpack.optimize.AggressiveMergingPlugin(),
+      new HtmlWebpackPlugin({
+        filename: outfile || `${output}/tap-html.html`,
+        inlineSource: '.(js|css|eot|woff2|woff|ttf|svg)$',
+        template: './src/template.html'
+      }),
+      new HtmlWebpackInlineSourcePlugin()
+    ]
   });
 
-  compiler.outputFileSystem = msf;
+  if(!outfile) {
+    const msf = new MemoryFileSystem();
+    compiler.outputFileSystem = msf;
+  }
 
   compiler.run(function(err) {
-      if (err) console.error(err); // eslint-disable-line
-      const report = msf.readFileSync(path.resolve(output, 'tap-html.html'));
-      if(outfile) {
-        fs.writeFileSync(outfile, report);
-      } else {
-        console.log(report.toString('utf8')); // eslint-disable-line
+    if (err) console.error(err); // eslint-disable-line
+    if (outfile) {
+      try {
+        fs.unlinkSync(path.resolve(output, 'bundle.js'));
+      } catch(ex) {
+        // noop
       }
+    } else {
+      console.log(msf.readFileSync(path.resolve(output, 'tap-html.html')).toString('utf8')); // eslint-disable-line
+    }
   });
 }
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "tap-html",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "description": "📊 an html tap reporter",
   "author": "Gabriel J. Csapo <[email protected]>",
   "license": "ISC",
@@ -15,8 +15,10 @@
   "main": "index.js",
   "scripts": {
     "lint": "eslint .",
-    "test": "tape test/index.js | ./bin/index.js --out ./docs/index.html",
-    "coverage": "tap test --coverage --coverage-report=lcov"
+    "test": "tape test/index.js | ./bin/index.js --out ./docs/example/index.html",
+    "coverage": "tap test --coverage --coverage-report=lcov",
+    "storybook": "start-storybook -p 6006",
+    "build-storybook": "build-storybook --output-dir=./docs/storybook"
   },
   "bin": {
     "tap-html": "./bin/index.js"
@@ -29,6 +31,7 @@
     "commander": "^2.11.0",
     "css-loader": "^0.28.4",
     "duplexer": "^0.1.1",
+    "file-loader": "^0.11.2",
     "html-webpack-inline-source-plugin": "0.0.9",
     "html-webpack-plugin": "^2.29.0",
     "memory-fs": "^0.4.1",
@@ -39,10 +42,14 @@
     "style-loader": "^0.18.2",
     "tap-parser": "^6.0.1",
     "through2": "^2.0.3",
-    "webpack": "^3.0.0"
+    "url-loader": "^0.5.9",
+    "webpack": "^3.6.0"
   },
   "devDependencies": {
-    "eslint": "^4.0.0",
+    "@storybook/react": "^3.2.8",
+    "eslint": "^4.7.0",
+    "eslint-plugin-react": "^7.3.0",
+    "font-awesome": "^4.7.0",
     "tap": "^10.7.2",
     "tape": "^4.6.3"
   }