import { shallowMount } from "@vue/test-utils";
import loadingModal from "./loading-modal";
import { getMountOptions } from "@/helpers/unit-test-helper.js";
import store from "@/store";

jest.mock(
  "@/store",
  () => {
    return {};
  },
  { virtual: true }
);

jest.mock('@/assets/img/loader.gif', () => 'loader.gif')
jest.mock('@/assets/img/windshield.png', () => 'windshield.png')

describe("loadingModal", () => {
  test("showModal sets modal visible", async () => {
    // Arrange
    const { wrapper } = setupMocks({ clickOutCloses: false });
    wrapper.vm.isModalVisible = false;

    //Act
    wrapper.vm.showModal();
    
    // Assert
    expect(wrapper.vm.isModalVisible).toEqual(true);
    wrapper.unmount();
  });
});


describe("loadingModal", () => {
  test("closeModal sets modal not visible", async () => {
    // Arrange
    const { wrapper } = setupMocks({ clickOutCloses: false });
    wrapper.vm.isModalVisible = true;

    //Act
    wrapper.vm.closeModal();
    
    // Assert
    expect(wrapper.vm.isModalVisible).toEqual(false);
    wrapper.unmount();
  });
});

describe("loadingModal", () => {
  test("canClose calls closeModal", async () => {
    // Arrange
    const { wrapper } = setupMocks({ clickOutCloses: true });
    wrapper.vm.isModalVisible = true;

    //Act
    wrapper.vm.canClose();
    
    // Assert
    expect(wrapper.vm.isModalVisible).toEqual(false);
    wrapper.unmount();
  });
});

describe("loadingModal", () => {
  test("canClose does not call closeModal", async () => {
    // Arrange
    const { wrapper } = setupMocks({ clickOutCloses: false });
    wrapper.vm.isModalVisible = true;

    //Act
    wrapper.vm.canClose();
    
    // Assert
    expect(wrapper.vm.isModalVisible).toEqual(true);
    wrapper.unmount();
  });
});

function setupMocks({
  clickOutCloses
}) {

   //Mock store
   store.dispatch = jest.fn(() => {});
   store.getters = { };
   const mountOptions = getMountOptions({
     store: {
       dispatch: store.dispatch,
       getters: store.getters,
     },
   });

  //Mock props
  mountOptions.propsData = { clickOutCloses: clickOutCloses };
  const wrapper = shallowMount(loadingModal, mountOptions);

  return { wrapper };
}