A
A
Alexey2021-12-08 09:32:00
Unit testing
Alexey, 2021-12-08 09:32:00

Interaction of VUE components through VUEX: how to test?

Good day!
Project on VUE.
A simple example. There are 2 components - A and B. There is VUEX-storage. Components interact with each other by exchanging data through storage. For example, if component A sets some value to some storage element, component B sees this and performs some actions, or simply displays the change. How to test it?

b.vue

<template>
  <div>
    <div id="box">
        Actual value is: {{someValue}}
    </div>
  </div>
</template>

<script>
  export default {
    computed: {
        someValue () {
            return this.$store.state.someValue
        }
    }
  }
</script>


b.spec.js
import { mount } from '@vue/test-utils'
import store from '@/./store'
import B from "@/components/B"

describe('Interaction', () => {
  let wrapper
  beforeEach(() => {
    wrapper = mount(B, { store })
  })

  it('works', () => {
    wrapper.vm.$store.dispatch('setSomeValue', 'Any value')
    s = wrapper.find('#box')
    expect(s.text()).toBe('Any value')
  })
})


The test falls.

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question