Testing GridItem + AddFruit components

2020-12-08 18:03:48 +01:00
parent 065ff6f3ff
commit b5ceae6c00
24 changed files with 844 additions and 380 deletions
--- a/tests/unit/AddFruit.spec.js
+++ b/tests/unit/AddFruit.spec.js
@@ -0,0 +1,63 @@
+import { shallowMount, createLocalVue } from "@vue/test-utils";
+import Vuex from "vuex";
+import AddFruit from "@/components/AddFruit";
+
+const localVue = createLocalVue();
+localVue.use(Vuex);
+
+describe("Test AddFruit component.", () => {
+  let actions, mutations, store;
+
+  beforeEach(() => {
+    actions = {
+      addFruit: jest.fn(),
+    };
+    mutations = {
+      toggleModal: jest.fn(),
+    };
+    store = new Vuex.Store({ actions, mutations });
+  });
+
+  it("takes a snapshot of the component.", () => {
+    const wrapper = shallowMount(AddFruit, { store, localVue });
+    expect(wrapper.html()).toMatchSnapshot();
+  });
+
+  it("checks initial data.", () => {
+    const wrapper = shallowMount(AddFruit, { store, localVue });
+    expect(wrapper.vm.$data.fruit).toEqual({
+      color: "#000000",
+      isFruit: true,
+    });
+  });
+
+  it("closes AddFruit modal on Cancel click.", () => {
+    const wrapper = shallowMount(AddFruit, {
+      store,
+      localVue,
+    });
+    const cancelBtn = wrapper.find(".btn--cancel");
+    cancelBtn.trigger("click");
+    expect(mutations.toggleModal).toHaveBeenCalled();
+  });
+
+  it("dispatches addFruit action on form submission.", () => {
+    const wrapper = shallowMount(AddFruit, {
+      store,
+      localVue,
+    });
+    const form = wrapper.find("form");
+    form.trigger("submit");
+    expect(actions.addFruit).toHaveBeenCalled();
+  });
+
+  it("checks that 'is-overlayed' class is added/removed to <body> on mounted/destroy.", () => {
+    const wrapper = shallowMount(AddFruit, {
+      store,
+      localVue,
+    });
+    expect(document.body.classList).toContain("is-overlayed");
+    wrapper.destroy();
+    expect(document.body.classList).not.toContain("is-overlayed");
+  });
+});