Web app testing

wiki, tech, tech
Page content

Web アプリケーションのテスト

実際取り入れるとは限らないけど、体系的にわかっておきたいので調べた。

reference

1. gihyo.jp - 第6回　Webアプリケーションのテスト

2008年の記事なので古典だが、テスト分類や概念の勉強として体系的でありがたい。

2. Qiita - JavaScriptフレームワーク選定の議論

3. 余談

IPA の開発ガイドとか品質管理は 超大プロジェクトだらけ、 97.4% がウォーターフォール型, 大エンプラのみ, なのでただ真似するのは当てはまらない体制

自分なりのテスト範囲の定義

テスト技法の分類

blackbox test, whitebox test, gray-box test

  • whitebox: 実装に近いテスト工程で実施 (unit test). カバレッジも良い計測手法があれば実施。
  • blackbox: よりユーザに近いテスト工程で実施 (E2E test?, ???).
    • 入力値の選び方が重要？ (月の選択値として 0, 1, 12, 13 を選ぶなど) それって whitebox でも多少必要じゃないか

実行方法の分類

動的テスト, 静的テスト (レビュー, 静的解析)

  • 静的テスト: lint の一部機能, 部分的 review といった程度に限定
  • 動的テスト: 他のテスト分類に託す

工程による分類

単体テスト (Unit Test), 結合テスト (Integrated Test), システムテスト (End-to-End Test)

  • unit test
    • unitなのか？は置いておいて、 backend-stub と結合したテストが多くを占めそう
    • Vue Component のテストは使うと良いかも
  • Integrated test: もちろん必要。 システム組み合わせ x 試験内容 は膨大なのでうまく絞る必要がある
  • End-to-End test: もちろん必要. 何をどこまでやるか、やる場合どこまで自動化するか

品質観点の分類

機能テスト, 性能テスト, 負荷テスト, ユーザビリティテスト, セキュリティテスト

  • 機能テスト:
    • Web App の機能テストというのは IT 中心としつつも E2E にも横断しているイメージ
    • 画面遷移（リンク先）の正しさ
    • 画面表示 (ある文字列が描画後必ず出力されること、とか)
    • アクション (form submit, 2重クリック防止, etc.)
    • アクセス権 (ログイン動作の正常性確認, 権限とread/write情報の整合性, などなど)
    • セッション管理 (login, logout, その正常・準正常系)
    • ブラウザ機能の動作確認: 戻る・進む、更新、タブ閉じる・複製・復元、ウィンドウ閉じる
    • ブラウザごとのテスト: 最大でも機能テストレベルで抑えないと爆発する
  • 性能テスト:
    • 最低でも代表的なページでのレスポンス速度は見ておきたい (予想では 平均: 一覧参照/Submit, 軽量: 単体参照, 重い: usage graphing)
  • 負荷テスト:
    • どこかの参照に対して実施したいところ。書き込みも？
  • ユーザビリティテスト:
    • レイアウトは頑張れば自動化できるが、レベル高い。使いやすさ・直感性は人によるテストになってしまうなぁ
  • セキュリティテスト:
    • やってくれるサービスやチームを頼るところから開始かなぁ

参考" テストツール

unit test

  • mocha + power-assert
  • jest
    • coverage や他にも all-in-one らしく、はやりっぽい
    • トランスパイルもサポートしていて、 TypeScript 使うなら良い組み合わせかも

E2E test

  • cypress
  • selenium

UI test

??? 相当難しそう

Vue 独自のテスト

  • vue-test-utils: Vue コンポーネントの単体テストのための公式ライブラリ