56194


Vue.jsのコンポーネントの単体テスト（Vue Test
Utils）で、テストしているコンポーネントから子コンポーネントに、想定通りのpropsが渡っているかテストしたいのですが、どのように書けばいいでしょうか。


CC BY-SA 4.0
2019-06-27T14:13:33.023
56150
2019-06-28T13:40:50.130
13492
question
vue.js テスト
Vue.jsの子コンポーネントのpropsのテスト


`@vue/test-utils`のmount (もしくはshallowMount)
メソッドを用いてコンポーネントをマウントした場合、`wrapper.find(Child).props("prop")`のようにして子コンポーネントに渡されたpropsを取得することができます。

テスト全体は以下のようになるでしょう。

[code]

    import { mount } from "@vue/test-utils";
    import App from "./App.vue";
    import Child from "./components/Child.vue";
    
    const wrapper = mount(App);
    
    expect(wrapper.find(Child).props("fuga")).toEqual("hoge");
    
[/code]

codesandboxでの例を以下に示します。

<https://codesandbox.io/s/get-child-component-props-tieh9>


CC BY-SA 4.0
2019-06-28T13:40:50.130
56194
2019-06-28T13:40:50.130
10743
56150
answer