diff --git a/src/common-components/funnel-footer/funnel-footer.spec.js b/src/common-components/funnel-footer/funnel-footer.spec.js index 7528959ff..33b7400fc 100644 --- a/src/common-components/funnel-footer/funnel-footer.spec.js +++ b/src/common-components/funnel-footer/funnel-footer.spec.js @@ -5,9 +5,17 @@ describe("funnel-footer.vue", () => { it("Should return footer-link class", async () => { // Act - try { + + const r = { + test:"testing", + clientHeight: 10, + classList: { + add: jest.fn(() => ''), + remove: jest.fn() + }, + }; global.document.getElementById = jest.fn().mockImplementation(()=> { - return {} + return r; }); const wrapper = mount(funnelFooter, { @@ -22,9 +30,8 @@ describe("funnel-footer.vue", () => { // Expect expect(link.attributes('class')).toContain("footer-link"); expect(global.document.getElementById).toBeCalled(); - } catch(error) { - console.log(error); - } + expect(r.classList.add).toBeCalledWith("justify-content-end"); + expect(r.classList.remove).toBeCalledWith("justify-content-start"); }); @@ -74,19 +81,33 @@ describe("funnel-footer.vue", () => { }); it("Should return class justify-content-start if paddingHeight > 80px", async () => { + + global.document.getElementById = jest.fn().mockImplementation(()=> { + return { + test:"testing", + clientHeight: 10, + classList: { + add: jest.fn(), + remove: jest.fn() + } + } + }); + // Act const wrapper = mount(funnelFooter, { propsData: { footer: true }, }); - + console.log(wrapper.html()); + const infoBox = document.getElementById('infoBox'); + console.log(document); // Assert const stacked = wrapper.find("#stacked"); wrapper.vm.paddingHeight = 100; // Expect - expect(stacked.attributes('class')).toContain("justify-content-start"); + expect(stacked.attributes('class')).toContain("justify-content-end"); }); }); diff --git a/src/common-components/funnel-footer/funnel-footer.vue b/src/common-components/funnel-footer/funnel-footer.vue index ac3d97269..485259088 100644 --- a/src/common-components/funnel-footer/funnel-footer.vue +++ b/src/common-components/funnel-footer/funnel-footer.vue @@ -81,13 +81,15 @@ export default { }, checkHeight() { const parentHeight = document.getElementById('infoBox').clientHeight; - const wrapper = document.getElementById('stacked'); + const wrapper2 = document.getElementById('stacked'); + console.log(parentHeight); + console.log(wrapper2); if (parentHeight > 80) { - wrapper.classList.add("justify-content-start"); - wrapper.classList.remove("justify-content-end"); + wrapper2.classList.add("justify-content-start"); + wrapper2.classList.remove("justify-content-end"); } else { - wrapper.classList.add("justify-content-end"); - wrapper.classList.remove("justify-content-start"); + wrapper2.classList.add("justify-content-end"); + wrapper2.classList.remove("justify-content-start"); } } }