컴포넌트에 믹스인이 전달되었는지 어떻게 확인합니까?

컴포넌트에 믹스인이 전달되었는지 어떻게 확인합니까?

vue-test-utils 라이브러리를 사용하여 VueJs 2 애플리케이션을 테스트하고 있는데 컴포넌트를 마운트하는 등 특정 컴포넌트에 믹스인이 전달되었는지 확인합니다.mount믹스인 던지기 같은 것에 접속해서wrapper.vm.mixins.

이미 다음 방법으로 접속을 시도했습니다.wrapper.vm.mixin,wrapper.vm.mixins,wrapper.mixin,wrapper.mixins,wrapper.vm.$mixin그리고.wrapper.vm.$mixins.

vue 컴포넌트는 다음과 같습니다.

export default (Vue as VueConstructor<Vue & InstanceType<typeof MyMixin>>).extend({
  name: 'MyComponent',
  mixins: [MyMixin]
})

믹스인.ts

import Vue from 'vue';

const Sum = Vue.extend({
  name: 'Sum',
  methods: {
       sum(numA: number, numB: number) {
        return numA + numB;
       }
  }
});

export { Sum };

답변 1:

테스트에서 mixin을 가져와 wrapper.vm에 전달되었는지 확인할 수 있습니다.$128.discins 어레이는 다음과 같습니다.

import { Sum } from './Sum'

const mixins = wrapper.vm.$options.mixins as any;

expect(mixins).toContain(Sum)

답변 2:

mixins 이름으로 테스트할 수 있지만 mixin에 이름 속성이 있는지 확인해야 합니다.그렇지 않으면 mixin은 정의되지 않은 상태로 반환됩니다.

const mixins = (wrapper.vm.$options.mixins as any).map((mixin: any) => mixin.options.name)

expect(mixins).toContain('Sum');

언급URL : https://stackoverflow.com/questions/70461008/how-to-check-if-mixin-was-passed-to-the-component