@vue/test-utils#createLocalVue TypeScript Examples

The following examples show how to use @vue/test-utils#createLocalVue. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: index.ts    From vue-storefront-1 with MIT License 6 votes vote down vote up 
mountMixin = <V extends Vue>(
  component: ComponentOptions<V>,
  mountOptions: ThisTypedShallowMountOptions<V> = {},
  template = '<div />'
): Wrapper<V> => {
  const localVue = createLocalVue();

  localVue.use(Vuex);

  return shallowMount({
    template,
    mixins: [component]
  }, {
    localVue,
    ...mountOptions
  })
}
Example #2
Source File: index.ts    From vue-storefront-1 with MIT License 6 votes vote down vote up 
mountMixinWithStore = <V extends Vue>(
  component: ComponentOptions<V>,
  storeOptions: object = {},
  mountOptions: ThisTypedShallowMountOptions<V> = {},
  template = '<div />'
): Wrapper<V> => {
  const localVue = createLocalVue();

  localVue.use(Vuex);

  const store = new Vuex.Store({
    ...storeOptions
  });

  return shallowMount({
    template,
    mixins: [component]
  }, {
    store,
    localVue,
    ...mountOptions
  })
}
Example #3
Source File: LabelContentSplit.spec.ts    From webapp with MIT License 5 votes vote down vote up 
describe("LabelContentSplit.vue", () => {
  let state: any;
  let store: any;

  const localVue = createLocalVue();
  localVue.use(Vuex);

  beforeEach(() => {
    state = {
      darkMode: false
    };
    store = new Vuex.Store({
      modules: {
        general: {
          namespaced: true,
          state
        }
      }
    });
  });

  it("renders props when passed", () => {
    const label = "Price Impact";
    const value = numeral(0.03).format("0.0000%");
    const wrapper = shallowMount(LabelContentSplit, {
      propsData: { label, value },
      store,
      localVue
    });
    expect(wrapper.text()).toMatch(label);
    expect(wrapper.text()).toMatch(value);
  });

  it("displays tooltip icon and popover when passed", () => {
    const tooltip = "Tooltip";
    const wrapper = shallowMount(LabelContentSplit, {
      propsData: { tooltip },
      store,
      localVue
    });
    expect(wrapper.find("#popover-target").exists()).toBe(true);
    expect(wrapper.text()).toMatch(tooltip);
  });

  it("should not displays value while loading", () => {
    const value = numeral(0.03).format("0.0000%");
    const wrapper = shallowMount(LabelContentSplit, {
      propsData: { value, loading: true },
      store,
      localVue
    });
    expect(wrapper.text()).not.toMatch(value);
  });

  it("displays red text when isAlert prop has passed", () => {
    const value = numeral(0.03).format("0.0000%");
    const wrapper = shallowMount(LabelContentSplit, {
      propsData: { value, isAlert: true },
      store,
      localVue
    });
    const span = wrapper.findAll("span").at(1);
    expect(span.text()).toBe(value);
    expect(span.element.classList.contains("text-red")).toBe(true);
  });
});
Example #4
Source File: local-vue.ts    From vuex-composition-helpers with MIT License 5 votes vote down vote up 
export function getLocalVue(): typeof Vue {
	const Vue = createLocalVue();

	Vue.use(CompositionApi);
	Vue.use(Vuex);

	return Vue;
}
Example #5
Source File: ClientDashboard.spec.ts    From MDDL with MIT License 5 votes vote down vote up 
localVue = createLocalVue()
Example #6
Source File: CollectionList.spec.ts    From MDDL with MIT License 5 votes vote down vote up 
localVue = createLocalVue()
Example #7
Source File: DesktopSideBar.spec.ts    From MDDL with MIT License 5 votes vote down vote up 
localVue = createLocalVue()
Example #8
Source File: FooterLinks.spec.ts    From MDDL with MIT License 5 votes vote down vote up 
localVue = createLocalVue()
Example #9
Source File: account.spec.ts    From MDDL with MIT License 5 votes vote down vote up 
localVue = createLocalVue()
Example #10
Source File: tos.spec.ts    From MDDL with MIT License 5 votes vote down vote up 
localVue = createLocalVue()
Example #11
Source File: claimBnt.spec.ts    From webapp with MIT License 4 votes vote down vote up 
describe('ClaimBnt.vue', () => {
  let state: any;
  let actions: any;
  let mutations: any;
  let getters: any;
  let store: any;

  const localVue = createLocalVue();
  localVue.use(Vuex);

  beforeEach(() => {
    state = {
      darkMode: false,
      countryCode: 'KOR'
    }
    actions = {
    }
    mutations = {
    }
    getters = {
    }
    store = new Vuex.Store({
      modules: {
        general: {
          namespaced: true,
          state,
          actions,
          mutations,
          getters
        }
      }
    });
  })

  afterEach(() => {
    jest.clearAllTimers();
  });

   /* check props */
  it("shows timer, when time left", () => {    
    const item = {
      id: '1',
      amount: 100,
      lockedUntil: (Date.now()+10000) / 1000,
      usdValue: 10
    }
    const wrapper = shallowMount(ClaimBnt, {
      propsData: {
        item
      },
      store,
      localVue,
      i18n
    });
    expect(wrapper.find('.img-avatar').exists()).toBe(true);
    expect(wrapper.find('.time-left').exists()).toBe(true);
    expect(wrapper.find('.btn').exists()).toBe(false);
  })

  it("hide timer, after unlock time period", () => {    
    const item = {
      id: '1',
      amount: 100,
      lockedUntil: (Date.now()-10000) / 1000,
      usdValue: 10
    }
    const wrapper = shallowMount(ClaimBnt, {
      propsData: {
        item
      },
      store,
      localVue,
      i18n
    });
    expect(wrapper.find('.time-left').exists()).toBe(false);
  })

  it('should unlock after locking period', () => {
    jest.useFakeTimers();

    const item = {
      id: '1',
      amount: 100,
      lockedUntil: (Date.now()+2000) / 1000,
      usdValue: 10
    }
    const wrapper = shallowMount(ClaimBnt, {
      propsData: {
        item
      },
      store,
      localVue,
      i18n
    });

    expect(setInterval).toHaveBeenCalledTimes(1);
    expect(setInterval).toHaveBeenLastCalledWith(expect.any(Function), 1000);

    jest.advanceTimersByTime(2200);

    // should be unlocked
    expect(wrapper.find('.time-left').exists()).toBe(true);
    expect(wrapper.find('.btn').exists()).toBe(false);
  })

  it('should emit "refresh" event after locking period', () => {
    jest.useFakeTimers();

    const item = {
      id: '1',
      amount: 100,
      lockedUntil: (Date.now()+2000) / 1000,
      usdValue: 10
    }
    const wrapper = shallowMount(ClaimBnt, {
      propsData: {
        item
      },
      store,
      localVue,
      i18n
    });

    jest.advanceTimersByTime(2200);
    expect(wrapper.emitted().refresh).toBeTruthy();
    expect(wrapper.emitted().refresh?.length).toBe(1);
  })

})