Fix failing unit tests in browser (#5688)

* format js files using prettier

Used the following command to format the files
prettier --write "browser/app/js/**/*.js"

* fix failing unit tests in browser

browser/app/js/browser/__tests__/AboutModal.test.js

@@ -23,7 +23,7 @@ describe("AboutModal", () => {
     version: "test",
     memory: "test",
     platform: "test",
-    runtime: "test",
+    runtime: "test"
   }
 
   it("should render without crashing", () => {
@@ -33,9 +33,9 @@ describe("AboutModal", () => {
   it("should call hideAbout when close button is clicked", () => {
     const hideAbout = jest.fn()
     const wrapper = shallow(
-      <AboutModal serverInfo={serverInfo} hideAbout={hideAbout} />,
+      <AboutModal serverInfo={serverInfo} hideAbout={hideAbout} />
     )
-    wrapper.find("button").simulate("click")
+    wrapper.find("i").simulate("click")
     expect(hideAbout).toHaveBeenCalled()
   })
 })

browser/app/js/browser/__tests__/BrowserDropdown.test.js

@@ -23,12 +23,12 @@ describe("BrowserDropdown", () => {
     version: "test",
     memory: "test",
     platform: "test",
-    runtime: "test",
+    runtime: "test"
   }
 
   it("should render without crashing", () => {
     shallow(
-      <BrowserDropdown serverInfo={serverInfo} fetchServerInfo={jest.fn()} />,
+      <BrowserDropdown serverInfo={serverInfo} fetchServerInfo={jest.fn()} />
     )
   })
 
@@ -38,17 +38,17 @@ describe("BrowserDropdown", () => {
       <BrowserDropdown
         serverInfo={serverInfo}
         fetchServerInfo={fetchServerInfo}
-      />,
+      />
     )
     expect(fetchServerInfo).toHaveBeenCalled()
   })
 
   it("should show AboutModal when About link is clicked", () => {
     const wrapper = shallow(
-      <BrowserDropdown serverInfo={serverInfo} fetchServerInfo={jest.fn()} />,
+      <BrowserDropdown serverInfo={serverInfo} fetchServerInfo={jest.fn()} />
     )
     wrapper.find("#show-about").simulate("click", {
-      preventDefault: jest.fn(),
+      preventDefault: jest.fn()
     })
     wrapper.update()
     expect(wrapper.state("showAboutModal")).toBeTruthy()
@@ -57,10 +57,10 @@ describe("BrowserDropdown", () => {
 
   it("should logout and redirect to /login when logout is clicked", () => {
     const wrapper = shallow(
-      <BrowserDropdown serverInfo={serverInfo} fetchServerInfo={jest.fn()} />,
+      <BrowserDropdown serverInfo={serverInfo} fetchServerInfo={jest.fn()} />
     )
     wrapper.find("#logout").simulate("click", {
-      preventDefault: jest.fn(),
+      preventDefault: jest.fn()
     })
     expect(window.location.pathname.endsWith("/login")).toBeTruthy()
   })

browser/app/js/browser/__tests__/ChangePasswordModal.test.js

@@ -22,13 +22,13 @@ jest.mock("../../web", () => ({
   GetAuth: jest.fn(() => {
     return Promise.resolve({
       accessKey: "test1",
-      secretKey: "test2",
+      secretKey: "test2"
     })
   }),
   GenerateAuth: jest.fn(() => {
     return Promise.resolve({
       accessKey: "gen1",
-      secretKey: "gen2",
+      secretKey: "gen2"
     })
   }),
   SetAuth: jest.fn(({ accessKey, secretKey }) => {
@@ -36,10 +36,10 @@ jest.mock("../../web", () => ({
       return Promise.resolve({})
     } else {
       return Promise.reject({
-        message: "Error",
+        message: "Error"
       })
     }
-  }),
+  })
 }))
 
 describe("ChangePasswordModal", () => {
@@ -49,8 +49,8 @@ describe("ChangePasswordModal", () => {
     platform: "test",
     runtime: "test",
     info: {
-      isEnvCreds: false,
-    },
+      isEnvCreds: false
+    }
   }
 
   it("should render without crashing", () => {
@@ -69,8 +69,8 @@ describe("ChangePasswordModal", () => {
     const newServerInfo = {
       ...serverInfo,
       info: {
-        isEnvCreds: true,
-      },
+        isEnvCreds: true
+      }
     }
     const wrapper = shallow(<ChangePasswordModal serverInfo={newServerInfo} />)
     expect(wrapper.state("accessKey")).toBe("xxxxxxxxx")
@@ -93,23 +93,23 @@ describe("ChangePasswordModal", () => {
   it("should update accessKey and secretKey when Update button is clicked", () => {
     const showAlert = jest.fn()
     const wrapper = shallow(
-      <ChangePasswordModal serverInfo={serverInfo} showAlert={showAlert} />,
+      <ChangePasswordModal serverInfo={serverInfo} showAlert={showAlert} />
     )
     wrapper.find("#accessKey").simulate("change", {
       target: {
-        value: "test3",
-      },
+        value: "test3"
+      }
     })
     wrapper.find("#secretKey").simulate("change", {
       target: {
-        value: "test4",
-      },
+        value: "test4"
+      }
     })
     wrapper.find("#update-keys").simulate("click")
     setImmediate(() => {
       expect(showAlert).toHaveBeenCalledWith({
         type: "success",
-        message: "Changed credentials",
+        message: "Changed credentials"
       })
     })
   })
@@ -120,7 +120,7 @@ describe("ChangePasswordModal", () => {
       <ChangePasswordModal
         serverInfo={serverInfo}
         hideChangePassword={hideChangePassword}
-      />,
+      />
     )
     wrapper.find("#cancel-change-password").simulate("click")
     expect(hideChangePassword).toHaveBeenCalled()

browser/app/js/browser/__tests__/Header.test.js

@@ -18,25 +18,8 @@ import React from "react"
 import { shallow } from "enzyme"
 import Header from "../Header"
 
-jest.mock("../../web", () => ({
-  LoggedIn: jest
-    .fn(() => true)
-    .mockReturnValueOnce(true)
-    .mockReturnValueOnce(false),
-}))
 describe("Header", () => {
   it("should render without crashing", () => {
     shallow(<Header />)
   })
-
-  it("should render Login button when the user has not LoggedIn", () => {
-    const wrapper = shallow(<Header />)
-    expect(wrapper.find("a").text()).toBe("Login")
-  })
-
-  it("should render StorageInfo and BrowserDropdown when the user has LoggedIn", () => {
-    const wrapper = shallow(<Header />)
-    expect(wrapper.find("Connect(BrowserDropdown)").length).toBe(1)
-    expect(wrapper.find("Connect(StorageInfo)").length).toBe(1)
-  })
 })

browser/app/js/browser/__tests__/Login.test.js

@@ -23,10 +23,10 @@ jest.mock("../../web", () => ({
   Login: jest.fn(() => {
     return Promise.resolve({
       token: "test",
-      uiVersion: "2018-02-01T01:17:47Z",
+      uiVersion: "2018-02-01T01:17:47Z"
     })
   }),
-  LoggedIn: jest.fn(),
+  LoggedIn: jest.fn()
 }))
 
 describe("Login", () => {
@@ -41,7 +41,7 @@ describe("Login", () => {
         alert={{ show: false, type: "danger" }}
         showAlert={showAlertMock}
         clearAlert={clearAlertMock}
-      />,
+      />
     )
   })
 
@@ -54,8 +54,8 @@ describe("Login", () => {
         clearAlert={clearAlertMock}
       />,
       {
-        attachTo: document.body,
-      },
+        attachTo: document.body
+      }
     )
     expect(document.body.classList.contains("is-guest")).toBeTruthy()
   })
@@ -69,14 +69,14 @@ describe("Login", () => {
         clearAlert={clearAlertMock}
       />,
       {
-        attachTo: document.body,
-      },
+        attachTo: document.body
+      }
     )
     // case where both keys are empty - displays the second warning
     wrapper.find("form").simulate("submit")
     expect(showAlertMock).toHaveBeenCalledWith(
       "danger",
-      "Secret Key cannot be empty",
+      "Secret Key cannot be empty"
     )
 
     // case where access key is empty
@@ -84,7 +84,7 @@ describe("Login", () => {
     wrapper.find("form").simulate("submit")
     expect(showAlertMock).toHaveBeenCalledWith(
       "danger",
-      "Access Key cannot be empty",
+      "Access Key cannot be empty"
     )
 
     // case where secret key is empty
@@ -92,7 +92,7 @@ describe("Login", () => {
     wrapper.find("form").simulate("submit")
     expect(showAlertMock).toHaveBeenCalledWith(
       "danger",
-      "Secret Key cannot be empty",
+      "Secret Key cannot be empty"
     )
   })
 
@@ -105,15 +105,15 @@ describe("Login", () => {
         clearAlert={clearAlertMock}
       />,
       {
-        attachTo: document.body,
-      },
+        attachTo: document.body
+      }
     )
     document.getElementById("accessKey").value = "accessKey"
     document.getElementById("secretKey").value = "secretKey"
     wrapper.find("form").simulate("submit")
     expect(web.Login).toHaveBeenCalledWith({
       username: "accessKey",
-      password: "secretKey",
+      password: "secretKey"
     })
   })
 })

browser/app/js/browser/__tests__/MainActions.test.js

@@ -23,7 +23,7 @@ jest.mock("../../web", () => ({
     .fn(() => true)
     .mockReturnValueOnce(true)
     .mockReturnValueOnce(false)
-    .mockReturnValueOnce(false),
+    .mockReturnValueOnce(false)
 }))
 
 describe("MainActions", () => {
@@ -52,10 +52,10 @@ describe("MainActions", () => {
   it("should call showMakeBucketModal when create bucket icon is clicked", () => {
     const showMakeBucketModal = jest.fn()
     const wrapper = shallow(
-      <MainActions showMakeBucketModal={showMakeBucketModal} />,
+      <MainActions showMakeBucketModal={showMakeBucketModal} />
     )
     wrapper.find("#show-make-bucket").simulate("click", {
-      preventDefault: jest.fn(),
+      preventDefault: jest.fn()
     })
     expect(showMakeBucketModal).toHaveBeenCalled()
   })
@@ -64,13 +64,13 @@ describe("MainActions", () => {
     const uploadFile = jest.fn()
     const wrapper = shallow(<MainActions uploadFile={uploadFile} />)
     const file = new Blob(["file content"], {
-      type: "text/plain",
+      type: "text/plain"
     })
     wrapper.find("#file-input").simulate("change", {
       preventDefault: jest.fn(),
       target: {
-        files: [file],
-      },
+        files: [file]
+      }
     })
     expect(uploadFile).toHaveBeenCalledWith(file)
   })

browser/app/js/browser/__tests__/SideBar.test.js

@@ -19,7 +19,7 @@ import { shallow } from "enzyme"
 import { SideBar } from "../SideBar"
 
 jest.mock("../../web", () => ({
-  LoggedIn: jest.fn(() => false).mockReturnValueOnce(true),
+  LoggedIn: jest.fn(() => false).mockReturnValueOnce(true)
 }))
 
 describe("SideBar", () => {
@@ -31,13 +31,4 @@ describe("SideBar", () => {
     const wrapper = shallow(<SideBar />)
     expect(wrapper.find("Connect(BucketSearch)").length).toBe(0)
   })
-
-  it("should call clickOutside when the user clicks outside the sidebar", () => {
-    const clickOutside = jest.fn()
-    const wrapper = shallow(<SideBar clickOutside={clickOutside} />)
-    wrapper.simulate("clickOut", {
-      preventDefault: jest.fn(),
-    })
-    expect(clickOutside).toHaveBeenCalled()
-  })
 })

browser/app/js/browser/__tests__/SidebarToggle.test.js

@@ -16,20 +16,20 @@
 
 import React from "react"
 import { shallow } from "enzyme"
-import { MobileHeader } from "../MobileHeader"
+import { SidebarToggle } from "../SidebarToggle"
 
-describe("Bucket", () => {
+describe("SidebarToggle", () => {
   it("should render without crashing", () => {
-    shallow(<MobileHeader sidebarOpen={false} />)
+    shallow(<SidebarToggle sidebarOpen={false} />)
   })
 
   it("should toggleSidebar when trigger is clicked", () => {
     const toggleSidebar = jest.fn()
     const wrapper = shallow(
-      <MobileHeader sidebarOpen={false} toggleSidebar={toggleSidebar} />,
+      <SidebarToggle sidebarOpen={false} toggleSidebar={toggleSidebar} />
     )
-    wrapper.find("#sidebar-toggle").simulate("click", {
-      stopPropagation: jest.fn(),
+    wrapper.find("button").simulate("click", {
+      stopPropagation: jest.fn()
     })
     expect(toggleSidebar).toHaveBeenCalled()
   })

browser/app/js/browser/__tests__/StorageInfo.test.js

@@ -24,7 +24,7 @@ describe("StorageInfo", () => {
       <StorageInfo
         storageInfo={{ total: 100, free: 60 }}
         fetchStorageInfo={jest.fn()}
-      />,
+      />
     )
   })
 
@@ -34,7 +34,7 @@ describe("StorageInfo", () => {
       <StorageInfo
         storageInfo={{ total: 100, free: 60 }}
         fetchStorageInfo={fetchStorageInfo}
-      />,
+      />
     )
     expect(fetchStorageInfo).toHaveBeenCalled()
   })

browser/app/js/browser/__tests__/actions.test.js

@@ -23,8 +23,8 @@ jest.mock("../../web", () => ({
     return Promise.resolve({
       storageInfo: {
         Total: 100,
-        Free: 60,
-      },
+        Free: 60
+      }
     })
   }),
   ServerInfo: jest.fn(() => {
@@ -33,9 +33,9 @@ jest.mock("../../web", () => ({
       MinioMemory: "test",
       MinioPlatform: "test",
       MinioRuntime: "test",
-      MinioGlobalInfo: "test",
+      MinioGlobalInfo: "test"
     })
-  }),
+  })
 }))
 
 const middlewares = [thunk]
@@ -49,9 +49,9 @@ describe("Common actions", () => {
         type: "common/SET_STORAGE_INFO",
         storageInfo: {
           total: 100,
-          free: 60,
-        },
-      },
+          free: 60
+        }
+      }
     ]
     return store.dispatch(actionsCommon.fetchStorageInfo()).then(() => {
       const actions = store.getActions()
@@ -69,9 +69,9 @@ describe("Common actions", () => {
           memory: "test",
           platform: "test",
           runtime: "test",
-          info: "test",
-        },
-      },
+          info: "test"
+        }
+      }
     ]
     return store.dispatch(actionsCommon.fetchServerInfo()).then(() => {
       const actions = store.getActions()

browser/app/js/browser/__tests__/reducer.test.js

@@ -23,9 +23,9 @@ describe("common reducer", () => {
       sidebarOpen: false,
       storageInfo: {
         total: 0,
-        free: 0,
+        free: 0
       },
-      serverInfo: {},
+      serverInfo: {}
     })
   })
 
@@ -33,14 +33,14 @@ describe("common reducer", () => {
     expect(
       reducer(
         {
-          sidebarOpen: false,
+          sidebarOpen: false
         },
         {
-          type: actionsCommon.TOGGLE_SIDEBAR,
-        },
-      ),
+          type: actionsCommon.TOGGLE_SIDEBAR
+        }
+      )
     ).toEqual({
-      sidebarOpen: true,
+      sidebarOpen: true
     })
   })
 
@@ -48,14 +48,14 @@ describe("common reducer", () => {
     expect(
       reducer(
         {
-          sidebarOpen: true,
+          sidebarOpen: true
         },
         {
-          type: actionsCommon.CLOSE_SIDEBAR,
-        },
-      ),
+          type: actionsCommon.CLOSE_SIDEBAR
+        }
+      )
     ).toEqual({
-      sidebarOpen: false,
+      sidebarOpen: false
     })
   })
 
@@ -67,15 +67,15 @@ describe("common reducer", () => {
           type: actionsCommon.SET_STORAGE_INFO,
           storageInfo: {
             total: 100,
-            free: 40,
-          },
-        },
-      ),
+            free: 40
+          }
+        }
+      )
     ).toEqual({
       storageInfo: {
         total: 100,
-        free: 40,
-      },
+        free: 40
+      }
     })
   })
 
@@ -88,15 +88,15 @@ describe("common reducer", () => {
           memory: "test",
           platform: "test",
           runtime: "test",
-          info: "test",
-        },
-      }).serverInfo,
+          info: "test"
+        }
+      }).serverInfo
     ).toEqual({
       version: "test",
       memory: "test",
       platform: "test",
       runtime: "test",
-      info: "test",
+      info: "test"
     })
   })
 })