Add tests for loading head.html

storybookjs · Apr 8, 2016 · d6794d1 · d6794d1
1 parent 908d405
commit d6794d1
Show file tree

Hide file tree

Showing 7 changed files with 91 additions and 14 deletions.
diff --git a/dist/server/get_head_html.js b/dist/server/get_head_html.js
@@ -0,0 +1,25 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports.default = function (configDirPath) {
+  var headHtmlPath = _path2.default.resolve(configDirPath, 'head.html');
+  var headHtml = '';
+  if (_fs2.default.existsSync(headHtmlPath)) {
+    headHtml = _fs2.default.readFileSync(headHtmlPath, 'utf8');
+  }
+
+  return headHtml;
+};
+
+var _path = require('path');
+
+var _path2 = _interopRequireDefault(_path);
+
+var _fs = require('fs');
+
+var _fs2 = _interopRequireDefault(_fs);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
diff --git a/dist/server/iframe.html.js b/dist/server/iframe.html.js
@@ -4,6 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-exports.default = function (extraHtml) {
-  return "\n    <!DOCTYPE html>\n    <html>\n      <head>\n        <title>React Storybook</title>\n        " + extraHtml + "\n      </head>\n      <body>\n        <div id=\"root\" />\n        <script src=\"/static/preview.bundle.js\"></script>\n      </body>\n    </html>\n  ";
+exports.default = function (headHtml) {
+  return "\n    <!DOCTYPE html>\n    <html>\n      <head>\n        <title>React Storybook</title>\n        " + headHtml + "\n      </head>\n      <body>\n        <div id=\"root\" />\n        <script src=\"/static/preview.bundle.js\"></script>\n      </body>\n    </html>\n  ";
 };
diff --git a/dist/server/index.js b/dist/server/index.js
@@ -53,6 +53,10 @@ var _fs = require('fs');
 
 var _fs2 = _interopRequireDefault(_fs);
 
+var _get_head_html = require('./get_head_html');
+
+var _get_head_html2 = _interopRequireDefault(_get_head_html);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 process.env.NODE_ENV = 'production';
@@ -121,12 +125,6 @@ if (_fs2.default.existsSync(customConfigPath)) {
   });
 }
 
-var headHtmlPath = _path2.default.resolve(configDirPath, 'head.html');
-var headHtml = '';
-if (_fs2.default.existsSync(headHtmlPath)) {
-  headHtml = _fs2.default.readFileSync(headHtmlPath);
-}
-
 var compiler = (0, _webpack2.default)(finalConfig);
 var devMiddlewareOptions = {
   noInfo: true,
@@ -139,6 +137,7 @@ app.get('/', function (req, res) {
   res.send((0, _index2.default)());
 });
 
+var headHtml = (0, _get_head_html2.default)(configDirPath);
 app.get('/iframe', function (req, res) {
   res.send((0, _iframe2.default)(headHtml));
 });

diff --git a/package.json b/package.json
@@ -56,6 +56,7 @@
     "eslint-plugin-babel": "^3.1.0",
     "eslint-plugin-react": "^4.2.3",
     "mocha": "^2.4.5",
+    "mock-fs": "^3.8.0",
     "nodemon": "^1.9.1",
     "react": "^0.14.8",
     "react-dom": "^0.14.8",

diff --git a/src/server/__tests__/get_head_html.js b/src/server/__tests__/get_head_html.js
@@ -0,0 +1,44 @@
+const { describe, it, beforeEach, afterEach } = global;
+import { expect } from 'chai';
+import getHeadHtml from '../get_head_html';
+import mock from 'mock-fs';
+
+const HEAD_HTML_CONTENTS = '<script>console.log("custom script!");</script>';
+
+describe('server.getHeadHtml', () => {
+  describe('when .storybook/head.html does not exist', () => {
+    beforeEach(() => {
+      mock({
+        config: {},
+      });
+    });
+
+    afterEach(() => {
+      mock.restore();
+    });
+
+    it('return an empty string', () => {
+      const result = getHeadHtml('./config');
+      expect(result).to.be.equal('');
+    });
+  });
+
+  describe('when .storybook/head.html exists', () => {
+    beforeEach(() => {
+      mock({
+        config: {
+          'head.html': HEAD_HTML_CONTENTS,
+        },
+      });
+    });
+
+    afterEach(() => {
+      mock.restore();
+    });
+
+    it('return the contents of the file', () => {
+      const result = getHeadHtml('./config');
+      expect(result).to.be.equal(HEAD_HTML_CONTENTS);
+    });
+  });
+});
diff --git a/src/server/get_head_html.js b/src/server/get_head_html.js
@@ -0,0 +1,12 @@
+import path from 'path';
+import fs from 'fs';
+
+export default function (configDirPath) {
+  const headHtmlPath = path.resolve(configDirPath, 'head.html');
+  let headHtml = '';
+  if (fs.existsSync(headHtmlPath)) {
+    headHtml = fs.readFileSync(headHtmlPath, 'utf8');
+  }
+
+  return headHtml;
+}
diff --git a/src/server/index.js b/src/server/index.js
@@ -13,6 +13,7 @@ import packageJson from '../../package.json';
 import config from './webpack.config';
 import path from 'path';
 import fs from 'fs';
+import getHeadHtml from './get_head_html';
 
 const logger = console;
 
@@ -94,12 +95,6 @@ if (fs.existsSync(customConfigPath)) {
   };
 }
 
-const headHtmlPath = path.resolve(configDirPath, 'head.html');
-let headHtml = '';
-if (fs.existsSync(headHtmlPath)) {
-  headHtml = fs.readFileSync(headHtmlPath);
-}
-
 const compiler = webpack(finalConfig);
 const devMiddlewareOptions = {
   noInfo: true,
@@ -112,6 +107,7 @@ app.get('/', function (req, res) {
   res.send(getIndexHtml());
 });
 
+const headHtml = getHeadHtml(configDirPath);
 app.get('/iframe', function (req, res) {
   res.send(getIframeHtml(headHtml));
 });