From f55b4b61d4fe04967cea8ad94f585eeaa698e185 Mon Sep 17 00:00:00 2001
From: Yann Braga <yannbf@gmail.com>
Date: Mon, 21 Sep 2020 18:09:37 +0200
Subject: [PATCH] test(preset-react): update tests for new implementation

---
 .../src/server/framework-preset-react.test.ts | 100 +++++++++++++-----
 1 file changed, 71 insertions(+), 29 deletions(-)

diff --git a/app/react/src/server/framework-preset-react.test.ts b/app/react/src/server/framework-preset-react.test.ts
index 5592bf4aa46..653fd063b3f 100644
--- a/app/react/src/server/framework-preset-react.test.ts
+++ b/app/react/src/server/framework-preset-react.test.ts
@@ -1,54 +1,96 @@
 import webpack from 'webpack';
+import ReactRefreshWebpackPlugin from '@pmmmwh/react-refresh-webpack-plugin';
 import * as preset from './framework-preset-react';
 import type { StorybookOptions } from './types';
 
+const mockApply = jest.fn();
+jest.mock('@pmmmwh/react-refresh-webpack-plugin', () => {
+  return jest.fn().mockImplementation(() => {
+    return { apply: mockApply };
+  });
+});
+
 describe('framework-preset-react', () => {
-  const babelLoaderPath = require.resolve('babel-loader');
   const reactRefreshPath = require.resolve('react-refresh/babel');
   const webpackConfigMock: webpack.Configuration = {
-    mode: 'development',
     plugins: [],
     module: {
       rules: [],
     },
   };
+  const babelConfigMock = {};
+
+  const storybookOptions: Partial<StorybookOptions> = {
+    configType: 'DEVELOPMENT',
+    presets: {
+      apply: async () => ({
+        fastRefresh: true,
+      }),
+    },
+    presetsList: [],
+  };
+
+  const storybookOptionsDisabledRefresh: Partial<StorybookOptions> = {
+    configType: 'DEVELOPMENT',
+    presets: {
+      apply: async () => ({
+        fastRefresh: false,
+      }),
+    },
+  };
+
+  describe('babel', () => {
+    it('should return a config with fast refresh plugin when fast refresh is enabled', async () => {
+      const config = await preset.babel(babelConfigMock, storybookOptions as StorybookOptions);
+
+      expect(config.plugins).toEqual([reactRefreshPath]);
+    });
+
+    it('should return unchanged config without fast refresh plugin when fast refresh is disabled', async () => {
+      const config = await preset.babel(
+        babelConfigMock,
+        storybookOptionsDisabledRefresh as StorybookOptions
+      );
+
+      expect(config).toEqual(babelConfigMock);
+    });
+
+    it('should return unchanged config without fast refresh plugin when mode is not development', async () => {
+      const config = await preset.babel(babelConfigMock, {
+        ...storybookOptions,
+        configType: 'PRODUCTION',
+      } as StorybookOptions);
+
+      expect(config).toEqual(babelConfigMock);
+    });
+  });
 
   describe('webpackFinal', () => {
-    it('should return a config with fast refresh plugin when fast refresh is enabled', () => {
-      const config = preset.webpackFinal(webpackConfigMock, {
-        reactOptions: { fastRefresh: true },
-      } as StorybookOptions);
+    it('should return a config with fast refresh plugin when fast refresh is enabled', async () => {
+      const config = await preset.webpackFinal(
+        webpackConfigMock,
+        storybookOptions as StorybookOptions
+      );
 
-      expect(config.module.rules).toEqual([
-        {
-          test: /\.[jt]sx?$/,
-          exclude: /node_modules/,
-          use: [
-            {
-              loader: babelLoaderPath,
-              options: {
-                plugins: [reactRefreshPath],
-              },
-            },
-          ],
-        },
-      ]);
+      expect(config.plugins).toEqual([new ReactRefreshWebpackPlugin()]);
     });
 
-    it('should not return a config with fast refresh plugin when fast refresh is disabled', () => {
-      const config = preset.webpackFinal(webpackConfigMock, {
-        reactOptions: { fastRefresh: false },
-      } as StorybookOptions);
+    it('should return unchanged config without fast refresh plugin when fast refresh is disabled', async () => {
+      const config = await preset.webpackFinal(
+        webpackConfigMock,
+        storybookOptionsDisabledRefresh as StorybookOptions
+      );
 
-      expect(config.module.rules).toEqual([]);
+      expect(config).toEqual(webpackConfigMock);
     });
 
-    it('should not return a config with fast refresh plugin when mode is not development', () => {
-      const config = preset.webpackFinal({ ...webpackConfigMock, mode: 'production' }, {
-        reactOptions: { fastRefresh: true },
+    it('should return unchanged config without fast refresh plugin when mode is not development', async () => {
+      const config = await preset.webpackFinal(webpackConfigMock, {
+        ...storybookOptions,
+        configType: 'PRODUCTION',
       } as StorybookOptions);
 
-      expect(config.module.rules).toEqual([]);
+      expect(config).toEqual(webpackConfigMock);
     });
   });
 });