Skip to content

Instantly share code, notes, and snippets.

@jpcaparas
Created April 29, 2019 04:43
Show Gist options
  • Save jpcaparas/406e8aba4770d53a0d15cb37f925af3f to your computer and use it in GitHub Desktop.
Save jpcaparas/406e8aba4770d53a0d15cb37f925af3f to your computer and use it in GitHub Desktop.
Vuex testing with Chai
import chai, { expect } from 'chai';
import spies from 'chai-spies';
import { shallowMount, createLocalVue } from '@vue/test-utils';
import Vuex from 'vuex';
import Actions from '@/components/Actions.vue';
const localVue = createLocalVue();
localVue.use(Vuex);
chai.use(spies);
describe('Actions.vue', () => {
let actions;
let store;
beforeEach(() => {
actions = {
actionClick: chai.spy(),
actionInput: chai.spy(),
};
store = new Vuex.Store({
actions,
});
});
it('dispatches "actionInput" when input event value is "input"', () => {
const wrapper = shallowMount(Actions, { store, localVue });
const input = wrapper.find('input');
input.element.value = 'input';
input.trigger('input');
expect(actions.actionInput).to.have.been.called();
});
it('does not dispatch "actionInput" when event value is not "input"', () => {
const wrapper = shallowMount(Actions, { store, localVue });
const input = wrapper.find('input');
input.element.value = 'not input';
input.trigger('input');
expect(actions.actionInput).not.to.have.been.called();
});
it('calls store action "actionClick" when button is clicked', () => {
const wrapper = shallowMount(Actions, { store, localVue });
wrapper.find('button').trigger('click');
expect(actions.actionClick).to.have.been.called();
});
});
import { createLocalVue } from '@vue/test-utils';
import Vuex from 'vuex';
import storeConfig from '@/components/store-config/store-config';
import { expect } from 'chai';
import { cloneDeep } from 'lodash';
const localVue = createLocalVue();
localVue.use(Vuex);
describe('banana', () => {
let store;
beforeEach(() => {
store = new Vuex.Store(cloneDeep(storeConfig));
});
it('increments "count" value when "increment" is commited', () => {
expect(store.state.count).to.equal(0);
store.commit('increment');
expect(store.state.count).to.equal(1);
});
it('updates "evenOrOdd" getter when "increment" is commited', () => {
store.commit('increment');
expect(store.getters.evenOrOdd).to.equal('odd');
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment