Update jest to the latest version 🚀

__mocks__/fs.js

@@ -0,0 +1,23 @@
+const fs = jest.genMockFromModule('fs');
+
+// This is a custom function that our tests can use during setup to specify
+// what the files on the "mock" filesystem should look like when any of the
+// `fs` APIs are used.
+let mockFiles = Object.create(null);
+
+// eslint-disable-next-line no-underscore-dangle
+function __setMockFiles(newMockFiles) {
+  mockFiles = newMockFiles;
+}
+
+// A custom version of `readdirSync` that reads from the special mocked out
+// file list set via __setMockFiles
+const readFileSync = (filePath = '') => mockFiles[filePath];
+const existsSync = filePath => !!mockFiles[filePath];
+
+// eslint-disable-next-line no-underscore-dangle
+fs.__setMockFiles = __setMockFiles;
+fs.readFileSync = readFileSync;
+fs.existsSync = existsSync;
+
+module.exports = fs;

app/react/package.json

@@ -74,7 +74,6 @@
   },
   "devDependencies": {
     "babel-cli": "^6.24.1",
-    "mock-fs": "^4.3.0",
     "nodemon": "^1.11.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1"

app/react/src/server/babel_config.test.js

@@ -1,16 +1,26 @@
-import mock from 'mock-fs';
 import loadBabelConfig from './babel_config';
 
+// eslint-disable-next-line global-require
+jest.mock('fs', () => require('../../../../__mocks__/fs'));
+jest.mock('path', () => ({
+  resolve: () => '.babelrc',
+}));
+
+const setup = ({ files }) => {
+  // eslint-disable-next-line no-underscore-dangle, global-require
+  require('fs').__setMockFiles(files);
+};
+
 describe('babel_config', () => {
   // As the 'fs' is going to be mocked, let's call require.resolve
   // so the require.cache has the correct route to the file.
   // In fact let's use it in the tests :)
   const babelPluginReactDocgenPath = require.resolve('babel-plugin-react-docgen');
 
   it('should return the config with the extra plugins when `plugins` is an array.', () => {
-    // Mock a simple `.babelrc` config file.
-    mock({
-      '.babelrc': `{
+    setup({
+      files: {
+        '.babelrc': `{
         "presets": [
           "env",
           "foo-preset"
@@ -19,72 +29,82 @@ describe('babel_config', () => {
           "foo-plugin"
         ]
       }`,
+      },
     });
 
     const config = loadBabelConfig('.foo');
 
-    expect(config.plugins).toEqual([
-      'foo-plugin',
-      [
-        babelPluginReactDocgenPath,
-        {
-          DOC_GEN_COLLECTION_NAME: 'STORYBOOK_REACT_CLASSES',
-        },
+    expect(config).toEqual({
+      babelrc: false,
+      plugins: [
+        'foo-plugin',
+        [
+          babelPluginReactDocgenPath,
+          {
+            DOC_GEN_COLLECTION_NAME: 'STORYBOOK_REACT_CLASSES',
+          },
+        ],
       ],
-    ]);
-
-    mock.restore();
+      presets: ['env', 'foo-preset'],
+    });
   });
 
   it('should return the config with the extra plugins when `plugins` is not an array.', () => {
-    // Mock a `.babelrc` config file with plugins key not being an array.
-    mock({
-      '.babelrc': `{
-        "presets": [
-          "env",
-          "foo-preset"
-        ],
-        "plugins": "bar-plugin"
-      }`,
+    setup({
+      files: {
+        '.babelrc': `{
+            "presets": [
+              "env",
+              "foo-preset"
+            ],
+            "plugins": "bar-plugin"
+          }`,
+      },
     });
 
     const config = loadBabelConfig('.bar');
 
-    expect(config.plugins).toEqual([
-      'bar-plugin',
-      [
-        babelPluginReactDocgenPath,
-        {
-          DOC_GEN_COLLECTION_NAME: 'STORYBOOK_REACT_CLASSES',
-        },
+    expect(config).toEqual({
+      babelrc: false,
+      plugins: [
+        'bar-plugin',
+        [
+          babelPluginReactDocgenPath,
+          {
+            DOC_GEN_COLLECTION_NAME: 'STORYBOOK_REACT_CLASSES',
+          },
+        ],
       ],
-    ]);
-
-    mock.restore();
+      presets: ['env', 'foo-preset'],
+    });
   });
 
   it('should return the config only with the extra plugins when `plugins` is not present.', () => {
     // Mock a `.babelrc` config file with no plugins key.
-    mock({
-      '.babelrc': `{
-        "presets": [
-          "env",
-          "foo-preset"
-        ]
-      }`,
+    setup({
+      files: {
+        '.babelrc': `{
+            "presets": [
+              "env",
+              "foo-preset"
+            ]
+          }`,
+      },
     });
 
     const config = loadBabelConfig('.biz');
 
-    expect(config.plugins).toEqual([
-      [
-        babelPluginReactDocgenPath,
-        {
-          DOC_GEN_COLLECTION_NAME: 'STORYBOOK_REACT_CLASSES',
-        },
+    expect(config).toEqual({
+      babelrc: false,
+      plugins: [
+        [
+          babelPluginReactDocgenPath,
+          {
+            DOC_GEN_COLLECTION_NAME: 'STORYBOOK_REACT_CLASSES',
+          },
+        ],
       ],
-    ]);
-
-    mock.restore();
+      presets: ['env', 'foo-preset'],
+    });
   });
 });

app/react/src/server/utils.test.js

@@ -1,42 +1,69 @@
-import mock from 'mock-fs';
-import { getPreviewHeadHtml } from './utils';
+import { getPreviewHeadHtml, getManagerHeadHtml } from './utils';
 
-const HEAD_HTML_CONTENTS = '<script>console.log("custom script!");</script>';
+// eslint-disable-next-line global-require
+jest.mock('fs', () => require('../../../../__mocks__/fs'));
+jest.mock('path', () => ({
+  resolve: (a, p) => p,
+}));
 
-describe('server.getPreviewHeadHtml', () => {
-  describe('when .storybook/head.html does not exist', () => {
-    beforeEach(() => {
-      mock({
-        config: {},
-      });
-    });
+const setup = ({ files }) => {
+  // eslint-disable-next-line no-underscore-dangle, global-require
+  require('fs').__setMockFiles(files);
+};
+
+const HEAD_HTML_CONTENTS = 'UNITTEST_HEAD_HTML_CONTENTS';
 
-    afterEach(() => {
-      mock.restore();
+describe('getPreviewHeadHtml', () => {
+  it('returns an empty string without head.html present', () => {
+    setup({
+      files: {},
     });
 
-    it('return an empty string', () => {
-      const result = getPreviewHeadHtml('./config');
-      expect(result).toEqual('');
+    const result = getPreviewHeadHtml('first');
+    expect(result).toEqual('');
+  });
+
+  it('return contents of head.html when present', () => {
+    setup({
+      files: {
+        'head.html': HEAD_HTML_CONTENTS,
+      },
     });
+
+    const result = getPreviewHeadHtml('second');
+    expect(result).toEqual(HEAD_HTML_CONTENTS);
   });
 
-  describe('when .storybook/head.html exists', () => {
-    beforeEach(() => {
-      mock({
-        config: {
-          'head.html': HEAD_HTML_CONTENTS,
-        },
-      });
+  it('returns contents of preview-head.html when present', () => {
+    setup({
+      files: {
+        'preview-head.html': HEAD_HTML_CONTENTS,
+      },
     });
 
-    afterEach(() => {
-      mock.restore();
+    const result = getPreviewHeadHtml('second');
+    expect(result).toEqual(HEAD_HTML_CONTENTS);
+  });
+});
+
+describe('getManagerHeadHtml', () => {
+  it('returns an empty string without manager-head.html present', () => {
+    setup({
+      files: {},
     });
 
-    it('return the contents of the file', () => {
-      const result = getPreviewHeadHtml('./config');
-      expect(result).toEqual(HEAD_HTML_CONTENTS);
+    const result = getManagerHeadHtml('first');
+    expect(result).toEqual('');
+  });
+
+  it('returns contents of manager-head.html when present', () => {
+    setup({
+      files: {
+        'manager-head.html': HEAD_HTML_CONTENTS,
+      },
     });
+
+    const result = getManagerHeadHtml('second');
+    expect(result).toEqual(HEAD_HTML_CONTENTS);
   });
 });

app/vue/package.json

@@ -78,7 +78,6 @@
   },
   "devDependencies": {
     "babel-cli": "^6.24.1",
-    "mock-fs": "^4.3.0",
     "nodemon": "^1.11.0"
   }
 }