Как написать тест isvueinstance с шуткой, когда у вас есть реквизит, как это

Question

на данный момент я просто хочу сделать базовый c тест и проверить, является ли мой компонент экземпляром vue с шуткой, мой вопрос в том, что я не знаю, что писать в propsData.

Я не понимаю, что там находится? Все примеры, которые я вижу, не используют синтаксис ["props name"] для своих реквизитов, которые они используют props: {name: "bla bla"}

Может кто-нибудь сказать мне, как я должен написать этот тест? Спасибо.

В моем addTrackPlaylist есть реквизиты ["addTrack"]. vue (вы можете увидеть код ниже).

мой код:

import { shallowMount, createLocalVue } from "@vue/test-utils";
import Buefy from "buefy";

import addTracksPlaylist from "@/components/addTracksPlaylist.vue";

const localVue = createLocalVue();
localVue.use(Buefy);

describe("Home component unit test", () => {
  test("Home is a vue instance", () => {
    const wrapper = shallowMount(addTracksPlaylist, {
      propsData: {
        addTrack: "addTrack"
      },
      localVue
    });
    expect(wrapper.isVueInstance()).toBeTruthy();
  });
});

addTracksPlaylist. vue

<script>
import * as apiPlaylist from "../api/apiPlaylist";

export default {
  props: ["addTrack"],
  data: () => ({
    term: "",
    results: [],
    noResults: false,
    searching: false,
    trackName: "",
    tracksList: [],

    current: 1,
    perPage: 5
  }),
  computed: {
    total() {
      return this.results.length;
    },

    paginatedResults() {
      let page_number = this.current - 1;

      return this.results.slice(
        page_number * this.perPage,
        (page_number + 1) * this.perPage
      );
    }
  },
  methods: {
    search() {
      if (this.term !== "") {
        this.results = [];
        this.searching = true;
        apiPlaylist
          .searchTrack(this.term)
          .then(res => {
            if (res.status != 401) {
              this.searching = false;
              this.results = res;
              this.noResults = this.results.length === 0;
            }
          })
          .catch(() => {
            this.$router.push("/login");
          });
      }
    }
  },
  addTrack(result) {
    this.$emit("addTrack", result);
  }
};
</script>

Answer 1

Вы можете объявить реквизиты двумя способами:

• Со стилем объекта, пример:

  props: {
    type: String,
    required: true
  },
  

• Стиль массива, пример:

  props: ['prop1', 'prop2', 'prop3']

Это зависит от того, что вы должны сделать.