import { shallowMount } from "@vue/test-utils";
import TextBlock from "./text-block";


describe("modal.vue", () => {
  it("Should display 'Text' when 'Text' is defined in the CMS", async () => {
    // Act
    const wrapper = shallowMount(TextBlock, {
      mixins: [mockMixin]
    });
    expect(wrapper.html()).toEqual(expect.stringContaining(mockCmsContent['Text']));
  });

  it("Should contain the typeStyle class as defined by the prop", async () => {
    // Act
    const wrapper = shallowMount(TextBlock, {
        mixins: [mockMixin],
        propsData: mockProps,
      });
    expect(wrapper.html()).toEqual(expect.stringContaining(mockProps['typeStyle']));
  });
  it("Should contain the justifyText class as defined by the prop", async () => {
    // Act
    const wrapper = shallowMount(TextBlock, {
        mixins: [mockMixin],
        propsData: mockProps,
      });
    expect(wrapper.html()).toEqual(expect.stringContaining(mockProps['justifyText']));
  });
  it("Should contain the fontWeight class as defined by the prop", async () => {
    // Act
    const wrapper = shallowMount(TextBlock, {
        mixins: [mockMixin],
        propsData: mockProps,
      });
    expect(wrapper.html()).toEqual(expect.stringContaining(mockProps['fontWeight']));
  });
});

                        ///////////////
                        // Constants //
                        ///////////////

const mockMixin = {
  methods: {
    getCmsContent: jest.fn((widgetName, cmsFieldName) => {
        return mockCmsContent[cmsFieldName];
    })
  }
}

const mockProps = {
    fontWeight: 'mockFontWeight',
    typeStyle: 'mockTypeStyle',
    justifyText: 'mockJustifyText'
}

const mockCmsContent = {
    'Text': "Sample text here.",
}