Playwright+MSW でのリグレッションテスト事始 - enechain Tech Blog
はじめに 背景 やりたいこと Why MSW？ 導入手順 詰まったこと defaultのtimeout設定時間が短い CIで落ちた時の検証方法がわからない 認証後のストレージの状態が入ってこない 今後の展望 おわりに はじめに enechainでフロントエンドエンジニアをしている@Shunya078です！ 自分の所属するGXデスクでは『日本気候取引所 - Japan Climate Exchange』(以下JCEX)のサービス開発を行っており、その中でReactを使用したフロントエンドの開発を担当しています。 リグレッションテストは運用を考えると、設計から導入した後、どう管理していくかまで検討する点が多く存在します。 JCEXは去年の年末にリリースされたばかりのサービスで、まだブラウザまで含めたリグレッション相当になるテストレイヤーが導入できておらず、存在しませんでした。 今回は新たに自チ
PlaywrightでCookieに任意の値を適用する
PlaywrightではCookieに任意の値を指定してブラウザを立ち上げることができます。 Playwrightの基本的な機能ですが、日本語の記事がなかったので投稿しておきます。 Cookie を適用するには。 Cookieを適用するには下記4つの情報が必要です。 Cookieのキー名（name） Cookieの値（value） 対象サイトのドメイン（domain） 対象サイトのパス（path） これらを指定するだけで適用できます。 const context = await browser.newContext(); context.addCookies([ { name: "JSHOGE", // Cookieのキー名 value: "hogehoge", // Cookieのキーに格納する値 domain: "example.com", // 対象サイトのドメイン path: "/
StorybookとPlaywrightがもたらす画期的なUIテスト
はじめに StorybookとPlaywrightを連携してテストすることで、思っていた以上に良い開発体験が得られたので紹介します。 今回の記事で紹介するテストは以下のリポジトリで公開しています。 具体的には以下の点が最高でした。 独立したコンポーネント開発 Storybookを利用することで、UIコンポーネントを独立して開発・テストできます。これにより、コンポーネントの再利用性が向上し、効率的な開発が可能になります。 シナリオベースのテスト Playwrightを使ってシナリオベースのテストを実行できます。これにより、ユーザーの実際の操作に近い状況でのテストが可能となり、アプリケーションの品質を高めることができます。 クロスブラウザテストの容易さ Playwrightは、複数のブラウザでの自動テストをサポートしています。これにより、異なるブラウザでの動作検証が容易になり、互換性の問題を効
［入門］Webフロントエンド E2E テスト ――PlaywrightによるWebアプリの自動テストから良いテストの書き方まで
この本の概要 E2Eテスト（End-to-End Testing）とは，システムの端から端（End-to-End）まで，全体を通して行うソフトウェアテストを指します。本書ではE2Eテストを「ユーザーの視点でWebシステムの動作を確認する自動テスト」として定義し，E2Eテストをこれからプロジェクトに導入しようとしている人，すでに導入しているがパフォーマンスや保守性で課題を感じている人を対象に，E2Eテストのフレームワークとして近年人気が急上昇しているPlaywrightをツールとして，その目的からモダンなノウハウまで，E2Eテスト初心者の方にもわかりやすくハンズオンを交えながら解説します。CIへ組み込む方法やユニットテストとの棲み分けなど，E2Eテストを実際の開発現場に投入するうえでの知見も数多く紹介します。 こんな方におすすめ E2Eテストをこれからプロジェクトに導入しようとしている人 す
WEBアプリのE2Eテストを自動化 ~ Playwrightの機能紹介とコード例 | DevelopersIO
npm init playwright@latest 実行すると @playwright/testがインストール playwrightの設定ファイル(playwright.config.ts)が追加 サンプル用のテストコードが追加 が行われます。 テストコード自動生成 playwrightにはブラウザ操作でテストコードを生成する機能があります。 package.jsonのscriptsに以下を追加してnpm run test:genするか、 "test:gen" : "playwright codegen" npxでも実行できます。引数のURLは任意です。 npx playwright codegen http://localhost:3000/
テスト自動化のために作られたIDE「Aqua」、JetBrainsが正式公開。Webインスペクタ、HTTPクライアント、テストランナー、デバッガーなど統合。個人向けは無料
テスト自動化のために作られたIDE「Aqua」、JetBrainsが正式公開。Webインスペクタ、HTTPクライアント、テストランナー、デバッガーなど統合。個人向けは無料 JetBrainsは、テスト自動化のためのテストコード作成や自動テストの実行などに最適化した統合開発環境「Aqua」の正式版を公開しました（β版登場時の機能紹介）。 Aquaはテスト自動化でよく使われるJava、Python 、JavaScript、TypeScript、Kotlin、SQLなどの言語と、Selenium、Playwright、Cypressなどの主要なフレームワークをサポート。 クラスやシンボルなどを認識するスマート検索や、安全な名前の変更と削除、メソッドの抽出、変数の導入、変数またはメソッドのインライン化などのリファクタリング支援機能も備えています。 JUnit、TestNG、Pytest、Jest、
Best Practices | Playwright
Introduction This guide should help you to make sure you are following our best practices and writing tests that are more resilient. Testing philosophy Test user-visible behavior Automated tests should verify that the application code works for the end users, and avoid relying on implementation details such as things which users will not typically use, see, or even know about such as the name o
Playwrightを使ったE2Eテストを導入した話 - Uzabase for Engineers
はじめに こんにちは。ソーシャル経済メディア「NewsPicks」の QA/SET チームの海老澤です。 先日 弊社で E2E テスト実行するために Playwright を導入したため紹介させてください。 E2Eテストとは E2Eテスト（エンドツーエンドテスト）とは、ソフトウェア開発におけるテスト手法の一つで、アプリケーションが実際の運用環境と同様の条件下で正しく動作することを確認するためのテストです。 システムの開始点から終了点までを通じて、ユーザーの視点でアプリケーションのフローを追い、機能全体が連携して期待通りに動くかを検証します。具体的には、ユーザーが行うであろう一連の操作をシミュレートして、データがシステムを通じて適切に流れるかや、最終的なアウトプットが正しいかどうかを確認します。E2Eテストにより、部分的な単体テストや統合テストでは見逃されがちな問題を発見することができます。
Playwrightのベストプラクティスを翻訳してみた
Playwrightの公式ドキュメントに「Best Practices」というページがあったので翻訳してみました。 原文： Best Practices | Playwright 目次 目次イントロダクションテスト哲学ユーザから見えるふるまいをテストするテストはできるだけ分離するサードパーティの依存関係をテストしないデータベースを使ったテストベストプラクティスロケータを使うメソッドチェーンとフィルタリングの使用XPath や CSS セレクタよりもユーザー向けの属性値を優先するロケータの生成codegen を使ってロケータを生成するVS Code 拡張機能を使用してロケーターを生成するウェブファーストのアサーションを使う手動でアサーションを使わないデバッグの設定ローカル環境でデバッグするCIでのデバッグPlaywrightのツールを使うすべてのブラウザでテストPlaywrig
PlaywrightによるE2Eテスト自動化を導入したので各種構成とtipsをご紹介
株式会社シャペロンのsrkwです。 シャペロンでは昨年、Playwrightを使ったE2Eテストによる各種機能の検証の自動化を導入しました。 E2Eテスト導入の背景や、チームへの浸透に向けた取り組みと反省等については別の記事で紹介しているので、興味のある方はこちらも併せてご覧ください。 この記事では、シャペロンの日次のE2Eテスト実行を支えるインフラ構成と、PlaywrightによるE2Eテスト導入によって溜まったtipsをご紹介したいと思います。同じようにPlaywrightを使ったE2Eテスト導入を検討している、あるいは導入済みで格闘している方にとって、少しでもお役に立てると嬉しいです。 日次のE2Eテスト実行を支えるインフラ構成 前提:Shaperonのテナント構成 シャペロンは製薬企業向けのコミュニケーション用SaaS、Shaperonを提供しており、Shaperonは利用テナント
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
