From 64786bb95ffe79835b3ba32a3a7d1c544cdbe757 Mon Sep 17 00:00:00 2001
From: AWolf81 <awolf2904@gmail.com>
Date: Wed, 27 Mar 2019 21:52:23 +0100
Subject: [PATCH 1/2] added test

---
 .../AppSettingsModal/AppSettingsModal.js      |   2 +-
 .../AppSettingsModal/AppSettingsModal.test.js | 123 ++++++++++++++++++
 .../AppSettingsModal.test.js.snap             |  93 +++++++++++++
 3 files changed, 217 insertions(+), 1 deletion(-)
 create mode 100644 src/components/AppSettingsModal/AppSettingsModal.test.js
 create mode 100644 src/components/AppSettingsModal/__snapshots__/AppSettingsModal.test.js.snap

diff --git a/src/components/AppSettingsModal/AppSettingsModal.js b/src/components/AppSettingsModal/AppSettingsModal.js
index 13ecd774..bb10b2dc 100644
--- a/src/components/AppSettingsModal/AppSettingsModal.js
+++ b/src/components/AppSettingsModal/AppSettingsModal.js
@@ -40,7 +40,7 @@ type State = {
   activeField: FormFields,
 };
 
-class AppSettingsModal extends PureComponent<Props, State> {
+export class AppSettingsModal extends PureComponent<Props, State> {
   state = {
     newSettings: this.props.settings,
     activeField: 'directoryPicker',
diff --git a/src/components/AppSettingsModal/AppSettingsModal.test.js b/src/components/AppSettingsModal/AppSettingsModal.test.js
new file mode 100644
index 00000000..9c29eb03
--- /dev/null
+++ b/src/components/AppSettingsModal/AppSettingsModal.test.js
@@ -0,0 +1,123 @@
+import React from 'react';
+import { remote } from 'electron'; // mocked
+import fs from 'fs';
+import { mount, shallow } from 'enzyme';
+
+import { AppSettingsModal } from './AppSettingsModal';
+import Toggle from '../Toggle';
+import DirectoryPicker from '../DirectoryPicker';
+import ProjectTypeSelection from '../ProjectTypeSelection';
+
+const { dialog } = remote;
+
+describe('AppSettingsModal component', () => {
+  let wrapper;
+  let instance;
+  let mockedHideModal;
+  let mockedSaveAppSettings;
+
+  const DEFAULT_SETTINGS = {
+    general: {
+      defaultProjectPath: 'user/guppy',
+      defaultProjectType: 'create-react-app',
+    },
+    privacy: {
+      enableUsageTracking: true,
+    },
+  };
+
+  beforeEach(() => {
+    fs.existsSync = jest.fn(() => true);
+    mockedHideModal = jest.fn();
+    mockedSaveAppSettings = jest.fn();
+    wrapper = shallow(
+      <AppSettingsModal
+        isVisible={true}
+        settings={DEFAULT_SETTINGS}
+        hideModal={mockedHideModal}
+        saveAppSettings={mockedSaveAppSettings}
+      />
+    );
+    instance = wrapper.instance();
+  });
+
+  it('should render', () => {
+    expect(wrapper).toMatchSnapshot();
+  });
+
+  it('should show dialog if path not exists', () => {
+    fs.existsSync = jest.fn(() => false);
+    instance.saveSettings({ preventDefault: jest.fn() });
+
+    expect(dialog.showErrorBox).toHaveBeenCalledWith(
+      "Path doesn't exist.",
+      'Please check your default project path or use the directory picker to select the path.'
+    );
+  });
+
+  it('should update & save settings', () => {
+    instance.updateSetting('general.defaultProjectType', 'gatsby');
+
+    instance.saveSettings({ preventDefault: jest.fn() });
+    expect(mockedSaveAppSettings).toHaveBeenCalledWith({
+      ...DEFAULT_SETTINGS,
+      general: {
+        ...DEFAULT_SETTINGS.general,
+        defaultProjectType: 'gatsby',
+      },
+    });
+  });
+
+  it('should update path setting', () => {
+    const picker = wrapper.find(DirectoryPicker);
+    const pickedPath = '/new/path';
+    instance.updateSetting = jest.fn();
+    picker.prop('onSelect')(pickedPath);
+
+    expect(instance.updateSetting).toHaveBeenCalledWith(
+      'general.defaultProjectPath',
+      pickedPath
+    );
+  });
+
+  describe('activeField update', () => {
+    beforeEach(() => {
+      // Mounted to DOM as we'd like to trigger events
+      wrapper = mount(
+        <AppSettingsModal
+          isVisible={true}
+          settings={DEFAULT_SETTINGS}
+          hideModal={mockedHideModal}
+          saveAppSettings={mockedSaveAppSettings}
+        />
+      );
+      instance = wrapper.instance();
+    });
+
+    it('should set "tracking" on privacy toggle', () => {
+      const toggle = wrapper.find(Toggle);
+      toggle.simulate('click');
+      expect(wrapper.state('activeField')).toEqual('tracking');
+    });
+
+    it('should set "directory" on focus', () => {
+      const picker = wrapper.find(DirectoryPicker);
+      wrapper.setState({ activeField: 'tracking' }); // Preset to tracking
+      expect(wrapper.state('activeField')).toEqual('tracking');
+      picker.prop('onFocus')();
+      expect(wrapper.state('activeField')).toEqual('directoryPicker');
+    });
+
+    it('should set "projectType" on select', () => {
+      const selection = wrapper.find(ProjectTypeSelection);
+      instance.updateSetting = jest.fn();
+      selection.prop('onProjectTypeSelect')('gatsby');
+
+      expect(wrapper.state('activeField')).toEqual('projectType');
+      expect(instance.updateSetting).toHaveBeenCalledWith(
+        'general.defaultProjectType',
+        'gatsby'
+      );
+    });
+  });
+});
diff --git a/src/components/AppSettingsModal/__snapshots__/AppSettingsModal.test.js.snap b/src/components/AppSettingsModal/__snapshots__/AppSettingsModal.test.js.snap
new file mode 100644
index 00000000..aeb5c768
--- /dev/null
+++ b/src/components/AppSettingsModal/__snapshots__/AppSettingsModal.test.js.snap
@@ -0,0 +1,93 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`AppSettingsModal component should render 1`] = `
+<Modal
+  isVisible={true}
+  onDismiss={[MockFunction]}
+  width={750}
+>
+  <ModalHeader
+    theme="standard"
+    title="Preferences"
+  />
+  <styled.section>
+    <form
+      onSubmit={[Function]}
+    >
+      <Styled(Heading)>
+        General
+      </Styled(Heading)>
+      <PixelShifter
+        reason="Slightly intend in section"
+        x={5}
+      >
+        <FormField
+          focusOnClick={false}
+          label="Default Project Path"
+          spacing={30}
+        >
+          <styled.div
+            size={5}
+          />
+          <DirectoryPicker
+            inputEditable={true}
+            isFocused={true}
+            onFocus={[Function]}
+            onSelect={[Function]}
+            path="user/guppy"
+            pathToSelectMessage="Select the directory"
+          />
+        </FormField>
+        <FormField
+          isFocused={false}
+          label="Default Project Type"
+          spacing={30}
+        >
+          <ProjectTypeSelection
+            onProjectTypeSelect={[Function]}
+            projectType="create-react-app"
+          />
+        </FormField>
+      </PixelShifter>
+      <Styled(Heading)>
+        Privacy
+      </Styled(Heading)>
+      <PixelShifter
+        reason="Slightly intend in section"
+        x={5}
+      >
+        <FormField
+          focusOnClick={false}
+          isFocused={false}
+          label="Enable anonymous usage tracking"
+          spacing={30}
+        >
+          <Toggle
+            isToggled={true}
+            onToggle={[Function]}
+            padding={2}
+            size={32}
+          />
+        </FormField>
+      </PixelShifter>
+      <styled.div
+        size={10}
+      />
+      <styled.div>
+        <FillButton
+          colors={
+            Array [
+              "#00C853",
+              "#69db0d",
+            ]
+          }
+          size="large"
+          textColor="#FFF"
+        >
+          Save
+        </FillButton>
+      </styled.div>
+    </form>
+  </styled.section>
+</Modal>
+`;

From c534176cf580c951fe5e578686d8c15e15f09e42 Mon Sep 17 00:00:00 2001
From: AWolf81 <awolf2904@gmail.com>
Date: Wed, 27 Mar 2019 23:10:54 +0100
Subject: [PATCH 2/2] restored fs after test

---
 src/components/AppSettingsModal/AppSettingsModal.test.js | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/components/AppSettingsModal/AppSettingsModal.test.js b/src/components/AppSettingsModal/AppSettingsModal.test.js
index 9c29eb03..bfb23540 100644
--- a/src/components/AppSettingsModal/AppSettingsModal.test.js
+++ b/src/components/AppSettingsModal/AppSettingsModal.test.js
@@ -15,6 +15,7 @@ describe('AppSettingsModal component', () => {
   let instance;
   let mockedHideModal;
   let mockedSaveAppSettings;
+  let mockFs;
 
   const DEFAULT_SETTINGS = {
     general: {
@@ -27,7 +28,7 @@ describe('AppSettingsModal component', () => {
   };
 
   beforeEach(() => {
-    fs.existsSync = jest.fn(() => true);
+    mockFs = jest.spyOn(fs, 'existsSync').mockImplementation(() => true);
     mockedHideModal = jest.fn();
     mockedSaveAppSettings = jest.fn();
     wrapper = shallow(
@@ -41,12 +42,16 @@ describe('AppSettingsModal component', () => {
     instance = wrapper.instance();
   });
 
+  afterEach(() => {
+    mockFs.mockRestore();
+  });
+
   it('should render', () => {
     expect(wrapper).toMatchSnapshot();
   });
 
   it('should show dialog if path not exists', () => {
-    fs.existsSync = jest.fn(() => false);
+    jest.spyOn(fs, 'existsSync').mockImplementation(() => false);
     instance.saveSettings({ preventDefault: jest.fn() });
 
     expect(dialog.showErrorBox).toHaveBeenCalledWith(