diff --git a/src/common-components/base-input-button/base-input-button.spec.js b/src/common-components/base-input-button/base-input-button.spec.js index 273f3d491..646e271a2 100644 --- a/src/common-components/base-input-button/base-input-button.spec.js +++ b/src/common-components/base-input-button/base-input-button.spec.js @@ -764,18 +764,207 @@ describe("baseInputButton.vue", () => { }); describe("handlePushClickEventToGACheck", () => { - test.todo("called from click or click-like event => call pushClickEventToGA"); + test("called from click or click-like event => call pushClickEventToGA", () => { + // Arrange + const { wrapper } = setupMocks({}); + wrapper.vm.pushEventToGA = jest.fn(); + + // Act + wrapper.vm.handlePushClickEventToGACheck("click"); + + // Assert + expect(wrapper.vm.pushEventToGA).toHaveBeenCalledTimes(1); + }); describe("called from keyboard navigation/button-question-focus-helper", () => { - test.todo("valueToEmit is null => pushClickEventToGA not called"); + test("valueToEmit is not null, is a checked radio without selectingInitiatesLoad, and the last value pushed to GA was not this input button's value => pushClickEventToGA is called", async () => { + // Arrange + const { wrapper } = setupMocks({ + mockData: { + propsData: { + isMultiSelect: false, + modelValue: "value2", + value: "value2", + selectingInitiatesLoad: false, + }, + }, + }); + wrapper.vm.pushEventToGA = jest.fn(); + await wrapper.setData({ + valueToEmit: "value2", + lastValuePushedToGa: "value1", + }); - test.todo("isMultiSelect => pushClickEventToGA not called"); + // Act + wrapper.vm.handlePushClickEventToGACheck(); - test.todo("!isMultiSelect and selectingInitiatesLoad => pushClickEventToGA not called"); + // Assert + expect(wrapper.vm.isChecked).toBe(true); + expect(wrapper.find("input").attributes().type).toBe("radio") + expect(wrapper.vm.pushEventToGA).toHaveBeenCalled(); + }); - test.todo("valueToEmit is null => pushClickEventToGA not called"); + test("valueToEmit is not null, is a checked radio with selectingInitiatesLoad, and the last value pushed to GA was not this input button's value => pushClickEventToGA is called", async () => { + // Arrange + const { wrapper } = setupMocks({ + mockData: { + propsData: { + isMultiSelect: false, + modelValue: "value2", + value: "value2", + selectingInitiatesLoad: true, + }, + }, + }); + wrapper.vm.pushEventToGA = jest.fn(); + await wrapper.setData({ + valueToEmit: "value2", + lastValuePushedToGa: "value1", + }); - test.todo("valueToEmit is null => pushClickEventToGA not called"); + // Act + wrapper.vm.handlePushClickEventToGACheck(); + + // Assert + expect(wrapper.vm.isChecked).toBe(true); + expect(wrapper.find("input").attributes().type).toBe("radio") + expect(wrapper.vm.pushEventToGA).not.toHaveBeenCalled(); + }); + + test("valueToEmit is not null, is a checkbox that's checked, and the last value pushed to GA was not this input button's value => pushClickEventToGA is not called", async () => { + // Arrange + const { wrapper } = setupMocks({ + mockData: { + propsData: { + isMultiSelect: true, + modelValue: ["value2"], + value: "value2", + selectingInitiatesLoad: false, + }, + }, + }); + wrapper.vm.pushEventToGA = jest.fn(); + await wrapper.setData({ + valueToEmit: "value2", + lastValuePushedToGa: "value1", + }); + + // Act + wrapper.vm.handlePushClickEventToGACheck(); + + // Assert + expect(wrapper.vm.isChecked).toBe(true); + expect(wrapper.find("input").attributes().type).toBe("checkbox") + expect(wrapper.vm.pushEventToGA).not.toHaveBeenCalled(); + }); + + test("valueToEmit is null => pushClickEventToGA not called", async () => { + // Arrange + const { wrapper } = setupMocks({ + mockData: { + propsData: { + isMultiSelect: false, + modelValue: "value2", + value: "value2", + selectingInitiatesLoad: false, + }, + }, + }); + wrapper.vm.pushEventToGA = jest.fn(); + await wrapper.setData({ + valueToEmit: null, + lastValuePushedToGa: "value1", + }); + + // Act + wrapper.vm.handlePushClickEventToGACheck(); + + // Assert + expect(wrapper.vm.isChecked).toBe(true); + expect(wrapper.find("input").attributes().type).toBe("radio") + expect(wrapper.vm.pushEventToGA).not.toHaveBeenCalled(); + }); + + test("valueToEmit is not null, is an unchecked checkbox, and the last value pushed to GA was not this input button's value => pushClickEventToGA is not called", async () => { + // Arrange + const { wrapper } = setupMocks({ + mockData: { + propsData: { + isMultiSelect: true, + modelValue: ["value1"], + value: "value2", + selectingInitiatesLoad: false, + }, + }, + }); + wrapper.vm.pushEventToGA = jest.fn(); + await wrapper.setData({ + valueToEmit: "value2", + lastValuePushedToGa: "value1", + }); + + // Act + wrapper.vm.handlePushClickEventToGACheck(); + + // Assert + expect(wrapper.vm.isChecked).toBe(false); + expect(wrapper.find("input").attributes().type).toBe("checkbox") + expect(wrapper.vm.pushEventToGA).not.toHaveBeenCalled(); + }); + + test("is an unchecked radio => pushClickEventToGA not called", async () => { + // Arrange + const { wrapper } = setupMocks({ + mockData: { + propsData: { + isMultiSelect: false, + modelValue: "value1", + value: "value2", + selectingInitiatesLoad: false, + }, + }, + }); + wrapper.vm.pushEventToGA = jest.fn(); + await wrapper.setData({ + valueToEmit: "value2", + lastValuePushedToGa: "value1", + }); + + // Act + wrapper.vm.handlePushClickEventToGACheck(); + + // Assert + expect(wrapper.vm.isChecked).toBe(false); + expect(wrapper.find("input").attributes().type).toBe("radio") + expect(wrapper.vm.pushEventToGA).not.toHaveBeenCalled(); + }); + + test("lastValuePushedToGa is the same as this input button's value => pushClickEventToGA not called", async () => { + // Arrange + const { wrapper } = setupMocks({ + mockData: { + propsData: { + isMultiSelect: false, + modelValue: "value2", + value: "value2", + selectingInitiatesLoad: false, + }, + }, + }); + wrapper.vm.pushEventToGA = jest.fn(); + await wrapper.setData({ + valueToEmit: "value2", + lastValuePushedToGa: "value2", + }); + + // Act + wrapper.vm.handlePushClickEventToGACheck(); + + // Assert + expect(wrapper.vm.isChecked).toBe(true); + expect(wrapper.find("input").attributes().type).toBe("radio") + expect(wrapper.vm.pushEventToGA).not.toHaveBeenCalled(); + }); }); }); @@ -791,8 +980,6 @@ describe("baseInputButton.vue", () => { }, }); - console.log(wrapper.vm.$route); - wrapper.setData({ GaActions: { CLICKED: "Clicked", @@ -813,7 +1000,40 @@ describe("baseInputButton.vue", () => { expect(wrapper.vm.setLastValuePushedToGa).toHaveBeenCalledWith("Bello"); }); - test.todo("set last value pushed to GA"); + test("pass in a value => setLastValuePushedToGa is called with value", () => { + // Arrange + const { wrapper } = setupMocks({ + mockData: { + propsData: { + setLastValuePushedToGa: jest.fn() + } + } + }); + + // Act + wrapper.vm.pushClickEventToGA("hi there"); + + // Assert + expect(wrapper.vm.setLastValuePushedToGa).toHaveBeenCalledWith("hi there") + }); + + test("don't pass in a value => setLastValuePushedToGa is called with input button's value", () => { + // Arrange + const { wrapper } = setupMocks({ + mockData: { + propsData: { + value: "hello there", + setLastValuePushedToGa: jest.fn() + } + } + }); + + // Act + wrapper.vm.pushClickEventToGA(); + + // Assert + expect(wrapper.vm.setLastValuePushedToGa).toHaveBeenCalledWith("hello there") + }); }); }); @@ -1011,20 +1231,6 @@ describe("baseInputButton.vue", () => { }); }); }); - - describe("keyboard navigation", () => { - describe("checkbox", () => { - test.todo("focus on a checkbox => update:modelValue is not emitted"); - - test.todo("blur from a checkbox => update:modelValue is not emitted"); - }); - - describe("radio", () => { - test.todo("focus on a radio button => update:modelValue is not emitted"); - - test.todo("blur from a radio button => update:modelValue is not emitted"); - }); - }); }); function setupMocks({ mockData = {}, shouldShallowMount = true }) { diff --git a/src/ux-components/list-button/list-button.vue b/src/ux-components/list-button/list-button.vue index 6cc061eb7..54ef98b35 100644 --- a/src/ux-components/list-button/list-button.vue +++ b/src/ux-components/list-button/list-button.vue @@ -52,7 +52,6 @@ export default { }, preHandleAnswerChange() { if (this.selectingInitiatesLoad) { - console.log("DISPLAY LOADER") this.displayLoader(); } },