I am using Quasar, vue and vuex. I have created a layout and would like to use jest to unit test.
I have been copying bits of my layout code and running test as I go along.
This is my spec code
import MainLayout from "../../../src/layouts/test";
import { mountFactory } from "@quasar/quasar-app-extension-testing-unit-jest";
import { QLayout, QHeader, QToolbar, QBtn, QToolbarTitle, QImg } from "quasar";
const factory = mountFactory(MainLayout, {
mount: { type: "full" },
quasar: {
components: { QLayout, QHeader, QToolbar, QBtn, QToolbarTitle, QImg },
},
});
describe("test", () => {
it("Show leftdrawer if leftDrawer is true", async () => {
const wrapper = factory(MainLayout);
await wrapper.vm.$nextTick();
expect(wrapper.findComponent("button").isVisible()).toBe(true);
});
});
When I add this part in my MainLayout.vue
<div v-if="!isAuthenticated">
<q-btn
@click="goTo('signin')"
outline
roundeded
label="sign in"
name="signin"
class="q-mr-sm"
>
And This part
computed: {
...mapState("member", {
isAuthenticated: (state: MemberState) => state.isAuthenticated,
})
},
I get this error when testing
TypeError: Cannot read properties of undefined (reading ‘state’)
...mapState("member", {
isAuthenticated: (state: MemberState) => state.isAuthenticated,
})
How do I set up my spec file so that it reads in isAuthenticated from state in store.