問題タブ [vue-test-utils]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
vuex - コンポーネントなしで Vex ストアをテストする
https://vue-test-utils.vuejs.org/guides/#testing-key-mouse-and-other-dom-eventsを調べて、Jest と vue-test- を組み合わせてテストを作成する方法を学びました。ユーティリティ。ただし、これらの例はすべてshallowMountコンポーネントをマウントする場所を使用していますが、GUI テストを使用して実際のコンポーネントをテストするので、それは避けたいと思います。
ただし、コンポーネントなしでこれを行うには問題があります。vue-test-utils の例ではshallowMount、ストアを注入するために使用していますが、そうしていないため、ストアにアクセスできません。つまり、テスト時に状態、ゲッターなどはすべて未定義です。
私の店のテストファイルmyStore.spec.js:
このテストを実行したときのエラーの 1 つは次のとおりstate is not definedです。
どこが間違っていますか？テストで自分のストアにアクセスするにはどうすればよいですか? 理想的には、テスト ストアを からインポートしたものと同じに設定したいのですがmyStore、うまくいくかどうかわかりませんか?
unit-testing - Vue Test Utils の「スタブ化された子コンポーネント」とは何ですか?
Vue Test Utilsには、次のような API メソッドがありますshallowMount()。
...
Wrapperマウントおよびレンダリングされた Vue コンポーネントを含む を作成しますが、子コンポーネントはスタブ化されています。
Vue Test Utils ドキュメント Web サイトを検索しましたが、これらのスタブ化された子コンポーネントがどのように動作するかについての適切な説明が見つかりませんでした。
- これらのスタブ化された子コンポーネントとは正確には何ですか?
- Vue コンポーネントのライフサイクルのどの部分を通過しますか?
- 彼らの行動を事前にプログラムする方法はありますか?
unit-testing - 自分で書いた他のコンポーネントを含む VueJS コンポーネントのテスト
他のコンポーネントを含む複数のコンポーネントを含む Web サイトで作業しています。データが設定されていない場合、フォームの保存ボタンが正しく非アクティブ化されるかどうかをテストしたいと思います。UI には vuetify を、テストには Jest を使用しています。
edit-user-details コンポーネントを含む親コンポーネントは次のとおりです。
これは edit-user-details コンポーネントの一部です:
そして、ここに私のテストがあります：
アサートがないため、テストは緑色です。主な問題は、次のエラーが発生することです: [Vue warn]: Unknown custom element: - コンポーネントを正しく登録しましたか? 再帰的なコンポーネントの場合は、必ず「name」オプションを指定してください。
私の質問は次のとおりです。私が作成した他のコンポーネントを含むコンポーネントをテストするにはどうすればよいですか?
よろしくお願いいたします。
jestjs - vue test utils SyntaxError:予期しないトークンのインポート
SyntaxError: Unexpected token import遅延読み込みアプローチでコンポーネントを読み込もうとしているインデックス ファイルでエラーが発生しています。
次の構文を使用すると、正常に動作します。