vue.js unit tests：なぜコンポーネントが未定義ですか？

Question

私は次のようにユニットテストを設定しようとしています：...

捕捉されない例外TypeErrorを

import Vue from 'vue' 
    import ChangeTitleComponent from '@/components/ChangeTitleComponent' 
    import store from '@/vuex/store' 

    describe('ChangeTitleComponent.vue',() => { 
     describe('changeTitle',() => { 
     var component 

     beforeEach(() => { 
      var vm = new Vue({ 
      template: '<div><h2>{{ title }}</h2> <change-title-component :title="title" :id="id"></change-title-component></div>', 
      components: { 
       ChangeTitleComponent 
      }, 
      props: ['title', 'id'], 
      store 
      }).$mount() 
      component = vm.$refs.changetitlecomponent 
     }) 

     component.title = 'Groceries' 
     component.id = '1' 

     it('should log the component',() => { 
      console.log('CHANGE TITLE COMPONENT: ', component) 
     }) 
     }) 
    }) 

を私はそれを実行したとき、私はエラーを取得：プロパティを設定することはできません未定義のキャッチされないの「タイトル」 TypeError：未定義の 'title'プロパティを設定できません

なぜ私のコンポーネントが「未定義」ですか？フィードバック

Answer 1

ため

おかげで主な問題は、あなたが実際にプロパティにvm.$refs上に存在しないchangetitlecomponentので、テンプレート内のコンポーネントにref属性を追加するのを忘れていることです。

これで問題が解決するはずです。

<change-title-component ref="changetitlecomponent" :title="title" :id="id"></change-title-component> 

Found by author: Setting the properties to the component object should be moved into the it block of unit test.