Merge remote-tracking branch 'origin/BULL-529' into BULL-529

src/components/EditableInput.vue

@@ -115,8 +115,6 @@ export default {
         .getComputedStyle(this.$refs.defaultSlot)
         .getPropertyValue("font-size");
 
-      console.log("+++ startEditing", width, fontSize);
-
       // set focus to the input element
       this.$nextTick(() => {
         const editInput = this.getEditingInput();

src/store/action-types.js

-export const CALL_SET_USER_PREFERENCE = " user_preferences/callSetUserProjects";
+export const CALL_SET_USER_PREFERENCE = "user_preferences/callSetUserProjects";

tests/unit/components/EditableInput.spec.js

@@ -8,7 +8,11 @@ const localVue = createLocalVue();
 localVue.use(Vuex);
 
 describe("components/EditableInput", () => {
-  test("EditableInput", () => {
+  afterEach(() => {
+    jest.restoreAllMocks();
+  });
+
+  it("should mount EditableInput with no errors", () => {
     // render the component
     const wrapper = shallowMount(EditableInput, {
       mocks: {
@@ -76,7 +80,7 @@ describe("components/EditableInput", () => {
     const input = wrapper.vm.getEditingInput();
     expect(input).toEqual(null);
   });
-  it("should start editing", () => {
+  it("should start editing", async () => {
     // render the component
     const wrapper = shallowMount(EditableInput, {
       mocks: {
@@ -90,11 +94,21 @@ describe("components/EditableInput", () => {
       vuetify,
     });
 
+    const mockInput = {
+      focus: jest.fn(),
+      style: {},
+    };
+    wrapper.vm.$refs.editingElementWrapper = {
+      getElementsByTagName: jest.fn().mockReturnValue([mockInput]),
+    };
+
     wrapper.vm.startEditing();
+    await wrapper.vm.$nextTick();
+    expect(mockInput.focus).toHaveBeenCalled();
     expect(wrapper.vm.isEditing).toEqual(true);
     expect(wrapper.vm.hover).toEqual(false);
   });
-  it("should update value", () => {
+  it("should update value", async () => {
     // render the component
     const wrapper = shallowMount(EditableInput, {
       mocks: {
@@ -104,17 +118,19 @@ describe("components/EditableInput", () => {
           },
         },
       },
+      props: {
+        value: "mockValue",
+      },
       localVue,
       vuetify,
     });
 
     wrapper.vm.$emit = jest.fn();
-    wrapper.vm.value = "test";
-    wrapper.vm.model = "value";
+    await wrapper.setProps({ value: "newMockValue" });
     wrapper.vm.updateValue();
     expect(wrapper.vm.$emit).toHaveBeenCalled();
   });
-  it("should update value same value", () => {
+  it("should not emit change value when it hasn't changed", async () => {
     // render the component
     const wrapper = shallowMount(EditableInput, {
       mocks: {
@@ -129,10 +145,10 @@ describe("components/EditableInput", () => {
     });
 
     wrapper.vm.$emit = jest.fn();
-    wrapper.vm.value = "test";
-    wrapper.vm.model = "test";
+    await wrapper.setProps({ value: "mockValue" });
+    await wrapper.setData({ model: "mockValue" });
     wrapper.vm.updateValue();
-    expect(wrapper.vm.$emit).toHaveBeenCalledTimes(0);
+    expect(wrapper.vm.$emit).not.toHaveBeenCalledWith("change");
   });
   it("should reset", () => {
     // render the component
@@ -152,7 +168,7 @@ describe("components/EditableInput", () => {
     expect(wrapper.vm.hover).toEqual(false);
     expect(wrapper.vm.isEditing).toEqual(false);
   });
-  it("should cancel", () => {
+  it("should cancel", async () => {
     // render the component
     const wrapper = shallowMount(EditableInput, {
       mocks: {
@@ -167,7 +183,7 @@ describe("components/EditableInput", () => {
     });
 
     wrapper.vm.reset = jest.fn();
-    wrapper.vm.value = "test";
+    await wrapper.setProps({ value: "test" });
     wrapper.vm.cancel();
     expect(wrapper.vm.reset).toHaveBeenCalled();
     expect(wrapper.vm.model).toEqual(wrapper.vm.value);
@@ -187,9 +203,7 @@ describe("components/EditableInput", () => {
     });
 
     wrapper.vm.$refs.editingElementWrapper = {
-      getElementsByTagName: () => {
-        return ["test"];
-      },
+      getElementsByTagName: () => ["test"],
     };
     const editInput = wrapper.vm.getEditingInput();
     expect(editInput).toEqual("test");

tests/unit/components/LaunchboardSettings.spec.js

@@ -3,6 +3,7 @@ import Vuex from "vuex";
 import Vuetify from "vuetify";
 import { shallowMount, createLocalVue } from "@vue/test-utils";
 import LaunchboardSettings from "@/components/LaunchboardSettings.vue";
+import { CALL_SET_USER_PREFERENCE } from "@/store/action-types";
 
 const vuetify = new Vuetify();
 const localVue = createLocalVue();
@@ -115,6 +116,7 @@ describe("LaunchboardSettings", () => {
     expect(wrapper.vm.changeLoadingColor).toHaveBeenCalled();
   });
   it("should call updateUserPreference", async () => {
+    const dispatch = jest.fn();
     const wrapper = shallowMount(LaunchboardSettings, {
       mocks: {
         $store: {
@@ -127,6 +129,7 @@ describe("LaunchboardSettings", () => {
             error: {},
             projects: { list: [] },
           },
+          dispatch,
         },
       },
       data: () => ({
@@ -142,13 +145,14 @@ describe("LaunchboardSettings", () => {
       vuetify,
     });
 
-    wrapper.vm.$store.dispatch = jest.fn().mockImplementation((pref, res) => {
-      expect(typeof res).toEqual("object");
-    });
-    wrapper.vm.darkMode = true;
+    const mockPreference = { darkMode: true };
     wrapper.vm.changeLoadingColor = jest.fn();
-    wrapper.vm.updateUserPreference();
+    await wrapper.vm.updateUserPreference(mockPreference);
     expect(wrapper.vm.$store.dispatch).toHaveBeenCalled();
+    expect(wrapper.vm.$store.dispatch).toHaveBeenCalledWith(
+      CALL_SET_USER_PREFERENCE,
+      mockPreference
+    );
     expect(wrapper.vm.changeLoadingColor).toHaveBeenCalled();
     expect(wrapper.vm.darkMode).toEqual(true);
   });

tests/unit/components/ProjectsSummary.spec.js

@@ -10,10 +10,12 @@ localVue.use(Vuex);
 
 describe("ProjectsSummary", () => {
   afterEach(() => {
-    jest.clearAllMocks();
+    jest.resetAllMocks();
   });
 
-  it("should load component", async () => {
+  it("should load component", () => {
+    ProjectService.getProjectsSummary = jest.fn();
+
     // render the component
     const wrapper = shallowMount(ProjectsSummary, {
       mocks: {
@@ -32,7 +34,8 @@ describe("ProjectsSummary", () => {
     expect(wrapper.find(".error").exists()).toBe(false);
   });
 
-  it("should filter by favorited projects", async () => {
+  it("should filter by favorited projects", () => {
+    ProjectService.getProjectsSummary = jest.fn();
     // render the component
     const wrapper = shallowMount(ProjectsSummary, {
       mocks: {
@@ -64,7 +67,7 @@ describe("ProjectsSummary", () => {
     ]);
   });
 
-  it("should refresh projects", async () => {
+  it("should refresh projects", () => {
     ProjectService.getProjectsSummary = jest.fn().mockResolvedValue([
       { id: "1", links: {}, latestPipeline: {}, favorite: false },
       { id: "2", links: {}, latestPipeline: {}, favorite: true },
@@ -99,7 +102,7 @@ describe("ProjectsSummary", () => {
     expect(wrapper.vm.filteredProjects).toEqual([]);
   });
 
-  it("should refresh with empty projects and trigger empty string", async () => {
+  it("should refresh with empty projects and trigger empty string", () => {
     ProjectService.getProjectsSummary = jest.fn().mockResolvedValue([]);
     // render the component
     const wrapper = shallowMount(ProjectsSummary, {
@@ -130,7 +133,7 @@ describe("ProjectsSummary", () => {
     expect(wrapper.vm.filteredProjects).toEqual([]);
   });
 
-  it("should refresh with error", async () => {
+  it("should refresh with error", () => {
     ProjectService.getProjectsSummary = jest.fn();
     // render the component
     const wrapper = shallowMount(ProjectsSummary, {