第3章 E2Eテストの実装 ～非同期処理のテスト、パフォーマンス計測、カバレッジ | gihyo.jp
第3章では、最も一般的なユースケースとして、Puppeteerを使ったE2E（end to end）テストの実現方法を解説します。 なお、本章で扱うテストサイトには、ブラウザ自動化が必要となるSPA（Single Page Application）を使用します。しかしもちろん、SPAではないサイトでも同様にテストできます。 テスト対象の環境を構築する まずはじめに、テスト対象となるサイトを構築する必要があります。今回は、Meteorを使った初期状態のサイトを、テスト対象として使用します。 Meteorとは、フロントエンドもバックエンドもすべてJavaScriptで記述できる、リアルタイム通信に特化したSPAのフレームワークです。現在最も人気のあるフレームワークではありませんが、今回は簡易的にSPAを構築できるという理由で選択しました。 テストサイトを立ち上げる Meteorのインストール方
Frontend E2Eテストの安定化の取り組み | メルカリエンジニアリング
こんにちは。メルペイのフロントエンドエンジニアの @tokuda109 です。Merpay Tech Openness Month 2021 の13日目を担当します。 メルペイのフロントエンドチームは、管理している全てのサービスに対し E2E テストを継続的に実行しています。E2E テストの導入に関する取り組みについては「Cypress + TestRail による Frontend E2E テストの効率化について」で詳しく書かれています。 全てのサービスで E2E テストが導入されていますが、この記事で述べられているとおり、安定して動作しているわけではありません。テストが失敗することが多々発生していました。 本記事では、E2E テストがなぜ安定して動作しないかを調査し、どのように改善したかを紹介します。 背景 メルペイのフロントエンドチームは、テスト、パフォーマンス、アクセシビリティ、セ
[AWS CDK] CloudFront FunctionでWebサイトにBasic認証をかける | DevelopersIO
こんにちは、CX事業本部の若槻です。 PoCやデモなどで使用するWebサイト（CloudFront + S3）で「Cognitoを使うほどでは無いけど何らかの認証は掛けておきたい」という場合はBasic認証という選択肢があります。 このBasic認証をCloudFront + S3という構成で掛けたい場合の実装は、今まではLambda@Edgeを使う場合が多かったですが、最近リリースされた、よりユーザーに近いロケーションでより高速な処理が可能なCloudFront Functionsでも実装が可能です。 エッジで爆速コード実行！CloudFront Functionsがリリースされました！ | DevelopersIO 今回は、このCloudFront Functionを使用してWebサイトにBasic認証をかける設定をAWS CDKで実装してみました。 CloudFront Functi
![[AWS CDK] CloudFront FunctionでWebサイトにBasic認証をかける | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/fde6f7c8a9687a84d77b4283284f2288984c2659/height=288;version=1;width=512/https%3A%2F%2Fdevio2023-media.developers.io%2Fwp-content%2Fuploads%2F2019%2F05%2Famazon-cloud-front.png)
テストデータ作成にCodeceptJSを使ってみた | DevelopersIO
はじめに 事業開発部でQAエンジニアをしている長友です。 今日はCodeceptJSというものを使ってみましたという記事です。 CodeceptJSはE2Eテストのフレームワークです。 今回はこちらを使ってテストデータを作成してみたというお話です。 経緯 急遽テスト実施をしてほしいということでとある案件に送り込まれました。 何もわからない状態で入ったので、どんな状況なのかやどんな感じでテストが行われているのかもわかってませんでした。 CodeceptJSについては、「Software Design 2020年6月号」〜「Software Design 2020年8月号」まで連載されていた「はじめよう、高速E2Eテスト」という記事を見たりしていて知っていました。そして、2020年の年末に開催されたソフトウェアテスト自動化カンファレンス2020で連載記事を書かれていた末村さんが「"全部乗せ"
Cypress - 書きやすいテストの秘密と独自コマンドの実装 | フューチャー技術ブログ
@testing-library/cypressの存在を知らずに、それっぽいものを作ろうとしたときにいろいろ調査した記録です。Cypressにはテストコードが縦と横に短くなる工夫がされており、そのメカニズムにしたがった独自コマンドを実装するにはコツが必要です。 実装は次のところにありますが、@testing-library/cypressの方がメンテされているので、こちらは実際には使わないのをお勧めします。 https://gitlab.com/osaki-lab/cypress-aria Cypressのテストが縦横に短く書けるわけCypressはWebDriver系(Selenium)やChrome DevTool Protocol系（Puppeteer)のツールとAPIの粒度が異なります。Seleniumはそもそもウェブサイトのタイトルに「Browser Automation Too
アクセシビリティ情報を使った壊れにくいE2Eテスト | フューチャー技術ブログ
2/25の東京Node学園で発表してきました。 E2Eテストはみんなしていますか？ 正直言うと、僕はあんまり好きじゃなかったです。お仕事では他の人が入れてくれたものが回っていたりしますが。前職で、SikuliXを使って社内向けのデスクトップアプリケーションのE2Eテストにトライしたことがあるんですが、すぐに壊れて動かなくなるので、費用対効果が出せなくてあきらめました（一人プロジェクトだったのもあります）。 絵でマッチングを行うのでボタン画像をいっぱいスクショをとっていく必要がある OCR機能はOSネイティブボタンの背景のグラデーションとかとの相性もあってあまりうまくいかず・・・自分で学習させるのも情報が少なかった。 ちょっとツールバーに新しいボタンを追加したりすると、絵が変わって動作しなくなる ボタンを画像で置くが、QtはOSごとにネイティブなルック＆フィールで描画するので、macOS用に
Cypress入門～初心者でも簡単にE2Eテストが作れる～ | フューチャー技術ブログ
はじめにこんにちは。踊るエンジニア、木戸俊輔です。 2021年4月で社会人2年目になりましたが、総出社回数は3回です。コロナで外出できないのは残念ですが、自宅で安全に業務に取り組むことができる現代の環境には感謝ですね。 さて、皆さんは普段どのようにE2Eテストを行っていますか？ 忍耐強く手動でポチポチ画面を触って…というのはなかなかにしんどいですよね。自動化ツールを使って楽したいけど難しくてよくわからない、という方もいらっしゃると思います。 本記事では、テスト自動化ツールを全く使ったことのなかった私が、テスト自動化ツールであるCypressの導入から基本的な使い方までをご紹介していきます。 対象： Webサービスのテスト自動化に興味がある人 自動テスト初心者 Cypressを触ってみたい人 テストは大事当たり前ですが、システムを納品/リリースする際、動作や性能のテストは必須です。もしテスト
PlaywrightとJest + TypeScriptでE2Eテスト | WP-kyoto
PlaywrightはMicrosoftのOSSでpuppeteer互換なクロスブラウザテストが書けるツールです。 Install 使用するには、Jestのpresetなどと一緒にインストールが必要です。 Create […] Install 使用するには、Jestのpresetなどと一緒にインストールが必要です。 $ yarn add -D jest jest-playwright-preset playwright ts-jest Create files Jestの設定と、Playwrightの設定ファイル、そしてテストコードを書くファイルを用意します。 $ mkdir e2e $ touch e2e/jest-playwright.config.js e2e/jest.config.js index.e2e.ts e2e/jest-playwright.confg.js playw
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
