We want to individually test the following pieces of the MyUW front-end:

1. Vuex Stores
2. Vue Mixins
3. Vue Plugins
4. Vue Components

Use faker to create mock data generator specific to the vuex store. This generator will be used to generate data for axios.get mocks.

1. Mock axios.*
2. Set the initial state if needed
3. Execute the action
4. Test for axios.* method calls
5. Insure the final state is correct

1. Set the initial state
2. Insure the getter return value is correct

1. Import the mixin and test the method though <mixin>.methods.<method>

1. Create a Vuex instance with the required state
2. Test the method / computed through <Vuex instance>.<method / computed>

Testing each plugin is unique. In general all variables exposed, all directives defined, and all lifecycle hooks used by the plugin need to be tested.

Component testing should not use the vuex stores but instead should use a mocked version. These mocks should use the postProcess method from the real store when necessary. They can reuse the mock data generator created in Testing Vuex Stores > Generating Mock data. The main reason to use a mocked store is to make it easier to override the return values from each store.

1. Create the required localVue and Vuex store.
2. Test all the methods / computed fields defined in the component.

Mount the component using @cypress/vue and then go through all user workflows.