v2: is Vuex/mapStore supported?

[ssuess]

I have a spec file that mounts a very simple component that checks a value in the vuex store and creates a link. But my test is coming back with a TypeError: Cannot read properties of undefined (reading 'state') That seems be coming from this line in my component:

computed: {
    ...mapState({
      searchText: state => state.data_searchText
    })
  },

Is there something special I need to do for the Vuex store to be recognized in cypress, or is this a bug? My store works fine everywhere in my app, as does the mapState function.

Operating System - Darwin(21.5.0) - darwin/x64
NodeJs - 16.15.1

Global packages
  NPM - 8.11.0
  yarn - Not installed
  @quasar/cli - 1.3.2
  @quasar/icongenie - 2.3.0
  cordova - Not installed

Important local packages
  quasar - 2.7.3 -- Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
  @quasar/app-webpack - 3.5.4 -- Quasar Framework App CLI with Webpack
  @quasar/extras - 1.14.1 -- Quasar Framework fonts, icons and animations
  eslint-plugin-quasar - 1.1.0 -- Official ESLint plugin for Quasar
  vue - 3.2.37 -- The progressive JavaScript framework for building modern web UI.
  vue-router - 4.0.16
  pinia - Not installed
  vuex - 4.0.2 -- state management for Vue.js
  electron - Not installed
  electron-packager - Not installed
  electron-builder - Not installed
  @babel/core - 7.18.5 -- Babel compiler core.
  webpack - 5.73.0 -- Packs CommonJs/AMD modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loaders to preprocess files, i.e. json, jsx, es7, css, less, ... and your custom stuff.
  webpack-dev-server - 4.8.1 -- Serves a webpack app. Updates the browser on changes.
  workbox-webpack-plugin - 6.5.3 -- A plugin for your Webpack build process, helping you generate a manifest of local files that workbox-sw should precache.
  register-service-worker - 1.7.2 -- Script for registering service worker, with hooks
  typescript - 4.5.5 -- TypeScript is a language for application scale JavaScript development
  @capacitor/core - Not installed
  @capacitor/cli - Not installed
  @capacitor/android - Not installed
  @capacitor/ios - Not installed

Quasar App Extensions
  @quasar/quasar-app-extension-testing - 2.0.4 -- A Quasar App Extension for managing Test Harnesses
  @quasar/quasar-app-extension-testing-e2e-cypress - 4.1.4 -- A Quasar App Extension for Cypress e2e

[IlCallo]

While doing component testing you need to initialize the Vuex store youself, check out Cypress, Vuex and Vue Test Utils docs about how to test a component which uses Vuex

Cypress AE only do the scaffolding and basic integration for you, but every other kind of setup is on you

If you find out how it's done, please report here the links which helped you so others can use them in the future as well

[ssuess]

it is on the component testing, I didn't realize I needed to do other things there since the example components and tests that quasar installed seem to run fine. Is there some documentation on how to make my normal boot files, vuex, and router setup (on which my components depend after all) be used in this cypress testing environment? I can't find any documentation on this that is quasar specific (but maybe it doesn't need to be?). Thanks!

[IlCallo]

Not right now unluckily Since component testing is meant to test the component in isolation you can always mock Vuex I guess

There is this proposal for Jest AE which is pretty similar, but we still could not find the time to work on it either, any help and contribution on this is welcome

[IlCallo]

Cypress published their own recipe to setup Vuex with component testing, check it out https://docs.cypress.io/guides/component-testing/custom-mount-vue#Vuex