Angular/e2eテスト環境

E2Eテストシナリオ次第で検討。QA（Quality Assurance=品質保証）。
ロケータ ：操作や検証の対象となる要素を指定するためのキー

パーソナルテスト環境の実装

・Cloud＋Docker
・Jenkins＋Docker
・CodeceptJS＋Docker

// Locator Builderの例
// CSSセレクタやXPathだと複雑になりがちなロケータをシンプルに書ける
locate('a')
 .withAttr({ href: '#' })
 .inside(locate('label').withText('Hello'));

// Semantic Locatorの例
// 標準的なDOM構造のサイトであれば文言を指定するだけで操作できる
//
// "Sign in" ボタンをクリックし、
// "Username" フィールドに "tsuemura" と入力する
I.click('Sign in');
I.fillField('Username', 'tsuemura');

Thanks

・CodeceptJS
https://codecept.io/
https://qiita.com/clown0082/items/c76ecd1393bfdeb1e623

・Cloud＋Docker(DockerでCFアプリをデプロイする)
https://qiita.com/MahoTakara/items/857e8ad96cd96d4053c6

・DockerとCodeceptJSで自動テスト
https://devlog.atlas.jp/2019/12/24/2998

・Autify　
Google Chrome に Autify のプラグインをインストールする
テストしたいブラウザ操作を Autify のクラウドサーバーに記録
自動テスト実行はそのサーバー上のブラウザで行う。
実行サーバーの IP アドレスを固定するオプションを使う。
REST API 経由でテスト実行の命令が可能（CI/CD パイプラインのタスク）
https://www.creationline.com/lab/38202
https://blog.autify.com/ja/why-id-should-not-be-used

事例
https://techblog.zozo.com/entry/autify-introduction
3年前Selenium　QA（Quality Assurance=品質保証）担当者
https://autify.com/ja/stories/robotpayment
フロントエンジニア、バックエンドエンジニア、UI/UXデザイナー、スクラムマスター、QA担当者、SREなど

環境
・ローカルネットワークのみからアクセス可能なウェブアプリケーション（アクセスにVPN接続が必須であるものを含む）はAutify利用できません。

・Jenkins＋Docker

https://qiita.com/__init__/items/5c867eb8759b158aaf3f

・ cypress
https://www.akariinc.com/ja/blog/development/introduction-cypress

・2020トレンド
https://www.infoq.com/jp/articles/javascript-web-development-trends-2020/