Jestjs vuetify+；jest列出错误消息，尽管测试为绿色

作为vue新手，我为一个组件编写了一个测试。测试是绿色的。但是，在被测组件（v-layout，v-flex）中使用vuetify时，控制台输出中将列出错误消息。移除组件（v-layout、v-flex）中的vuetify时，它们将消失。如何使用vuetify并仍然避免这些消息

组件TestForm

<script>
  import "@/assets/Styles";

  import {cloneDeep} from "lodash";
  import VForm from "vuetify/es5/components/VForm";
  import VBtn from "vuetify/es5/components/VBtn";
  import {VContainer, VContent, VFlex, VLayout, VSpacer} from "vuetify/es5/components/VGrid";
  import VTextField from "vuetify/es5/components/VTextField";
  import {VCard, VCardText, VCardTitle} from "vuetify/es5/components/VCard";

  import TestModelData from "@/api/model/example/TestModelData";
  import TestData from "@/api/model/example/TestData";
  import TestStatus from "@/api/model/example/TestStatus";
  import TestStatusSelect from "@/components/common/TestStatusSelect";

  export default {
    components: {
      VBtn,
      VForm,
      TestModelData, TestData, TestStatus, TestStatusSelect,
      VCard, VCardTitle, VCardText,
      VContainer, VContent, VLayout, VFlex, VSpacer,
      VTextField
    },
    props: {
      testModelData: TestModelData
    },
    data() {
      return {
        currentTestModelData: this.testModelData,
        testData: this.testData ? cloneDeep(this.testData) : new TestData()
      };
    },
    watch: {
      "testModelData.testdata": function (val) {
        console.log("Testdata has changed;", val);
        if (val) {
          this.testData = cloneDeep(val);
        } else {
          this.testData = new TestData();
        }
      }
    },
    computed: {
      readOnly: function () {
        if (this.testData.testStatus.id !== TestStatus.FIRST.id) {
          return true;
        } else {
          return false;
        }
      }
    },
    methods: {
      onFormChange(event) {
        console.log("Changed: ", event);
        this.$store.dispatch({
          type: "testModelData/setTestData",
          testData: this.testData
        });
      }
    }
  };
</script>
<template>
    <v-form ref="form">
        <v-layout wrap>
            <v-flex xs12 lg6>
                <TestStatusSelect
                        ref="testDataSelect"
                        v-model="testData.testStatus"
                        @change="onFormChange($event)"/>
            </v-flex>
        </v-layout>
    </v-form>

    <!-- when comment the above and uncomment the below the error messages disappear -->
    <!--<v-form ref="form">-->
    <!--<TestStatusSelect-->
    <!--ref="testDataSelect"-->
    <!--v-model="testData.testStatus"-->
    <!--@change="onFormChange($event)"/>-->
    <!--</v-form>-->
</template>

组件TestStatusSelect

<script>
  import VSelect from "vuetify/es5/components/VSelect";
  import TestStatus from "@/api/model/example/TestStatus";

  export default {
    components: {
      VSelect
    },
    props: ["value", "disabled"],
    data() {
      return {
        testStatuses: TestStatus.ALL,
        testStatus: this.value ? this.value : TestStatus.FIRST
      };
    },
    watch: {
      value(val) {
        if (this.testStatus.id !== val.id) {
          console.log('VALUE');
          this.testStatus = val;
        }
      },
      testStatus(val, oldVal) {
        if (val.id !== oldVal.id) {
          this.$emit("input", val);
          this.$emit("change", val);
        }
      }
    }
  };
</script>

<template>
    <v-select
            ref="testStatusSelect"
            :disabled="disabled"
            label="Result"
            :items="testStatuses"
            item-text="name"
            item-value="id"
            v-model="testStatus"
            return-object>
    </v-select>
</template>

类TestData

import TestStatus from "@/api/model/example/TestStatus";

class TestData {

  constructor() {
    this.id = null;
    this.name = null;
    this.testStatus = TestStatus.FIRST;
  }

  fromJSON(json) {
    this.id = json.id;
    this.name = json.name;
    this.testStatus = json.testStatus !== null ? TestStatus.fromJSON(json.testStatus) : null;
  }

  toJSON() {
    const o = {
      id: this.id,
    };
    o.name = this.name;
    o.testStatus = this.testStatus ? this.testStatus.toJSON() : null;
    return o;
  }

  static fromJSON(json) {
    if (!json) {
      return null;
    } else {
      const a = new TestData();
      a.fromJSON(json);
      return a;
    }
  }
}

export default TestData;

类TestStatus

import PropTypes from "prop-types";
import Definition from "../Definition";

class TestStatus extends Definition {

  constructor(id, name) {
    super();
    this.id = id;
    this.name = name;
  }

  static FIRST = new TestStatus(0, "first");
  static SECOND = new TestStatus(1, "second");

  static ALL = [
    TestStatus.FIRST,
    TestStatus.SECOND
  ];

  toJSON() {
    return this.id;
  }

  static fromJSON(json) {
    if (json === TestStatus.FIRST.id) {
      return TestStatus.FIRST;
    }
    else if (json === TestStatus.SECOND.id) {
      return TestStatus.SECOND;
    }

    console.error("TestStatus unknown", json);
    throw new Error(`TestStatus ${json} unknown`, json);
  }
}

TestStatus.prototype.PROPTYPES = {
  id: PropTypes.number,
  name: PropTypes.string,
};

export default TestStatus;

控制台输出

console.error node_modules/@vue/test-utils/dist/vue-test-utils.js:15
  [vue-test-utils]: an extended child component <VBtn> has been modified to ensure it has the correct instance properties. This means it is not possible to find the component with a component selector. To find the component, you must stub it manually using the stubs mounting option.

console.error node_modules/@vue/test-utils/dist/vue-test-utils.js:15
  [vue-test-utils]: an extended child component <VCard> has been modified to ensure it has the correct instance properties. This means it is not possible to find the component with a component selector. To find the component, you must stub it manually using the stubs mounting option.

console.error node_modules/@vue/test-utils/dist/vue-test-utils.js:15
  [vue-test-utils]: an extended child component <VCardTitle> has been modified to ensure it has the correct instance properties. This means it is not possible to find the component with a component selector. To find the component, you must stub it manually using the stubs mounting option.

console.error node_modules/@vue/test-utils/dist/vue-test-utils.js:15
  [vue-test-utils]: an extended child component <VCardText> has been modified to ensure it has the correct instance properties. This means it is not possible to find the component with a component selector. To find the component, you must stub it manually using the stubs mounting option.

console.warn node_modules/vuetify/es5/util/console.js:32
  [Vuetify] Unable to locate target [data-app]

  found in

  ---> <VMenu>
         <VSelect>
           <TestStatusSelect>
             <VForm>
               <VCard>
                 <Anonymous>
                   <Root>

console.error node_modules/vue/dist/vue.common.js:593
  [Vue warn]: $listeners is readonly.

  found in

  ---> <VSelect>
         <TestStatusSelect>
           <VForm>
             <VCard>
               <Anonymous>
                 <Root>

console.log src/components/example/TestForm.vue:800
  Changed:  TestStatus {
    _clazz: [Getter/Setter],
    id: [Getter/Setter],
    name: [Getter/Setter] }

console.error node_modules/vue/dist/vue.common.js:593
  [Vue warn]: $listeners is readonly.

  found in

  ---> <VSelect>
         <TestStatusSelect>
           <VForm>
             <VCard>
               <Anonymous>
                 <Root>

console.error node_modules/vue/dist/vue.common.js:593
  [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "value"

  found in

  ---> <VSelect>
         <TestStatusSelect>
           <VForm>
             <VCard>
               <Anonymous>
                 <Root>

console.error node_modules/vue/dist/vue.common.js:593
   [Vue warn]: $listeners is readonly.

   found in

   ---> <VSelect>
          <TestStatusSelect>
            <VForm>
              <VCard>
                <Anonymous>
                  <Root>

console.error节点_modules/@vue/test-utils/dist/vue-test-utils.js:15
[vue test utils]：已修改扩展子组件，以确保其具有正确的实例属性。这意味着无法使用组件选择器查找组件。要查找组件，必须使用存根安装选项手动存根。
console.error节点_modules/@vue/test-utils/dist/vue-test-utils.js:15
[vue test utils]：已修改扩展子组件，以确保其具有正确的实例属性。这意味着无法使用组件选择器查找组件。要查找组件，必须使用存根安装选项手动存根。
console.error节点_modules/@vue/test-utils/dist/vue-test-utils.js:15
[vue test utils]：已修改扩展子组件，以确保其具有正确的实例属性。这意味着无法使用组件选择器查找组件。要查找组件，必须使用存根安装选项手动存根。
console.error节点_modules/@vue/test-utils/dist/vue-test-utils.js:15
[vue test utils]：已修改扩展子组件，以确保其具有正确的实例属性。这意味着无法使用组件选择器查找组件。要查找组件，必须使用存根安装选项手动存根。
console.warn node_modules/vuetify/es5/util/console.js:32
[Vuetify]无法定位目标[data app]
发现于
---> 
console.error节点_modules/vue/dist/vue.common.js:593
[Vue warn]：$listeners是只读的。
发现于
---> 
console.log src/components/example/TestForm.vue:800
更改：TestStatus{
_clazz:[Getter/Setter]，
id:[Getter/Setter]，
名称：[Getter/Setter]}
console.error节点_modules/vue/dist/vue.common.js:593
[Vue warn]：$listeners是只读的。
发现于
---> 
console.error节点_modules/vue/dist/vue.common.js:593
[Vue warn]：避免直接改变道具，因为每当父组件重新渲染时，该值将被覆盖。相反，使用基于道具值的数据或计算属性。道具变异：“价值”
发现于
---> 
console.error节点_modules/vue/dist/vue.common.js:593
[Vue warn]：$listeners是只读的。
发现于
---> 

中有一些解决方案/解决方法

这是对我有效的一个，我在测试体的顶部添加了它：

document.body.setAttribute('data-app', true)

---

你找到解决办法了吗？您使用什么版本的vuejs测试UTIL？我知道它现在不起作用了。

console.error node_modules/@vue/test-utils/dist/vue-test-utils.js:15
  [vue-test-utils]: an extended child component <VBtn> has been modified to ensure it has the correct instance properties. This means it is not possible to find the component with a component selector. To find the component, you must stub it manually using the stubs mounting option.

console.error node_modules/@vue/test-utils/dist/vue-test-utils.js:15
  [vue-test-utils]: an extended child component <VCard> has been modified to ensure it has the correct instance properties. This means it is not possible to find the component with a component selector. To find the component, you must stub it manually using the stubs mounting option.

console.error node_modules/@vue/test-utils/dist/vue-test-utils.js:15
  [vue-test-utils]: an extended child component <VCardTitle> has been modified to ensure it has the correct instance properties. This means it is not possible to find the component with a component selector. To find the component, you must stub it manually using the stubs mounting option.

console.error node_modules/@vue/test-utils/dist/vue-test-utils.js:15
  [vue-test-utils]: an extended child component <VCardText> has been modified to ensure it has the correct instance properties. This means it is not possible to find the component with a component selector. To find the component, you must stub it manually using the stubs mounting option.

console.warn node_modules/vuetify/es5/util/console.js:32
  [Vuetify] Unable to locate target [data-app]

  found in

  ---> <VMenu>
         <VSelect>
           <TestStatusSelect>
             <VForm>
               <VCard>
                 <Anonymous>
                   <Root>

console.error node_modules/vue/dist/vue.common.js:593
  [Vue warn]: $listeners is readonly.

  found in

  ---> <VSelect>
         <TestStatusSelect>
           <VForm>
             <VCard>
               <Anonymous>
                 <Root>

console.log src/components/example/TestForm.vue:800
  Changed:  TestStatus {
    _clazz: [Getter/Setter],
    id: [Getter/Setter],
    name: [Getter/Setter] }

console.error node_modules/vue/dist/vue.common.js:593
  [Vue warn]: $listeners is readonly.

  found in

  ---> <VSelect>
         <TestStatusSelect>
           <VForm>
             <VCard>
               <Anonymous>
                 <Root>

console.error node_modules/vue/dist/vue.common.js:593
  [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "value"

  found in

  ---> <VSelect>
         <TestStatusSelect>
           <VForm>
             <VCard>
               <Anonymous>
                 <Root>

console.error node_modules/vue/dist/vue.common.js:593
   [Vue warn]: $listeners is readonly.

   found in

   ---> <VSelect>
          <TestStatusSelect>
            <VForm>
              <VCard>
                <Anonymous>
                  <Root>

document.body.setAttribute('data-app', true)