テスト — $mol

テスト

$mol のビューは自分の状態の関数であり、そのことがテストの見た目を変えます。ユーザーのシナリオは、ビュー自身のメソッドの呼び出しとして書かれます。下書きを入れ、アクションを走らせ、ユーザーが見るはずのものを読む。1app.draft( 'Milk' )2app.add()3$mol_assert_equal( app.item_title( 0 ), 'Milk' )セレクタもブラウザーもなく、Playwright も Cypress もなく、何かを待つこともありません。同じファイルがさらに次のものをくれます。速さ。テストは Node でミリ秒のうちに走り、1000 本でおよそ 1 分です。node my/hello/-/node.test.js がモジュールの分を実行します。セットアップ不要。コンポーネントの隣の hello.test.ts はビルダーに拾われ、-/node.test.js にコンパイルされます。mam_build による継続的インテグレーションがそれを実行し、テストが落ちればビルドも落とします。コンテキストを通したサービスの差し替え。テストはどれも自分の $ を受け取り、コンポーネントが this.$.X で辿るものはすべて、その $ へテストダブルを代入すれば入れ替わります。$mol_fetch ではなく this.$.$mol_fetch と書く理由がこれです。こちらは差し替えられますが、素のほうは差し替えられません。モックされた時間。コンテキストを通して作られたタイマーは自分では進みません。待ち行列に入っているものは $mol_after_mock_warp() が実行します。必要なときには本物の DOM。 Node バンドルは jsdom を積んでいるので、同じテストファイルで dom_node() と querySelectorAll が動きます。

ビューのメソッドを通したシナリオ

クックブックの todo リストを取り上げます。draft? という文字列、items というリスト、add アクション、delete アクション。そのテストは my/todo/todo.test.ts にあります。1namespace $ {2 $mol_test({3 4 'add an item and delete it'( $ ) {5 const app = $my_todo.make({ $ })6 7 app.draft( 'Milk' )8 app.add()9 $mol_assert_equal( app.items().length, 1 )10 $mol_assert_equal( app.item_title( 0 ), 'Milk' )11 $mol_assert_equal( app.draft(), '' )12 13 app.delete( 0 )14 $mol_assert_like( app.item_rows(), [] )15 },16 17 'blank draft adds nothing'( $ ) {18 const app = $my_todo.make({ $ })19 20 app.draft( ' ' )21 app.add()22 $mol_assert_like( app.items(), [] )23 },24 25 })26}気に留めておくことがいくつかあります。GitHub でこのページを編集役に立ちましたか？はいいいえ前へレンダリング次へデプロイこのページの内容ビューのメソッドを通したシナリオサービスをモックする時間 DOM を通して Node のテストが覆わないもの実務上のメモ次へ