Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Microsoft Playwrightで始めるブラウザテスト

Microsoft Playwrightで始めるブラウザテスト

.NETラボ 勉強会 2024年1月で投影したスライドです。
イベントリンク:https://dotnetlab.connpass.com/event/305578/

スライド内で紹介した動画:
(音声なし)Microsoft Playwright Demo
https://www.youtube.com/watch?v=-N2_QFrV9ho&t=1s

GitHub Profile:@ymd65536
Twitter(X): @ymd65536

Kento.Yamada

January 27, 2024
Tweet

More Decks by Kento.Yamada

Other Decks in Programming

Transcript

  1. このLTでやること • 自己紹介 • そもそもブラウザテストとはなんやねん • 古くから存在していたけど終焉を迎えた”あのブラウザ” • もう一つのMicrosoft Edge

    • ブラウザの仕様統一 • WebDriverの登場 2 • Microsoft Playwrightとは • Microsoft Playwrightの特徴 • 実際のコード • ブラウザテストを快適に実行するために必要なこと • Microsoft Playwright Testingとは • Microsoft Playwright Testing • Microsoft Playwright Testingでテストを構成する時の注意点 • まとめ
  2. 自己紹介 3 Kento.Yamada マルチクラウドでエンジニアをやっているMulti Cloud Developer 携わっていること: • クラウドの運用分析(Google CloudのLookerが飛び道具)

    • 新しいクラウドサービスの検証 • MSP向けのシステム開発 • 他 • Kindle本の執筆(ベストセラー獲得) • WebDriverの仕様でブログを書く人(最近の話) github,zenn,Qiita,X(旧Twitter),LinkedIn@ymd65536
  3. Webオートメーション ブラウザテスト ブラウザオートメーション 今回話すのは左側の「ブラウザテスト」について 15 RPA Playwright E2Eテスト 自動化 昨今ではブラウザテストのことを単にUIテストと呼ぶことがあります。

    しかし、厳密にはネイティブアプリケーションのE2EテストもUIテストに含まれるので 「UIテスト=ブラウザテスト」ではありません。 そもそもブラウザテストとはなんやねん
  4. 古くから存在していたけど終焉を迎えた”あのブラウザ” 18 Webオートメーション ブラウザテスト ブラウザオートメーション VBA E2Eテスト 自動化 VBA IEが全盛の頃はExcel

    VBAでE2Eテストしたり、Webシステム操作の自動化ができました。 ※Microsoft HTML Object LibraryとMicrosoft Internet Controlsによる操作 IE IE
  5. もう一つのMicrosoft Edge IE終焉後は2つのMicrosoft Edgeが登場しました。 • Microsoft Edge Legacy(Microsoft Edgeの前に登場したMicrosoft Edge)

    • Microsoft Edge(多くの人が利用・イメージするMicrosoft Edge) 多くの人が利用・イメージするMicrosoft EdgeではIEモードがサポートされました。 このIEモードはVBAとWindows32 APIを用いることでIEとほぼ同じWebオートメーションを Microsoft Edgeで実現できます。 つまりどういうことか・・・ 21
  6. WebDriverの登場 ブラウザベンダー毎にWebDriverを提供 例: • Microsoft Edge WebDriver • WebDriver for

    Chrome WebDriverを起動するとローカルホストにエンドポイント構築されます。 ※注意点としてWebDriverのバージョン=ブラウザのバージョン 28 仕様が統一されたことによって統一された自動化フレームワーク利用できるようになった。
  7. 45 例:テストパターンを考えてみると アプリケーションの機能数 ❌ デバイスの種類 ❌ OS ❌ ブラウザの種類 = 10

    ❌ 3 ❌ 3 ❌ 5 = 450通り 実際にはもっとパターン数があったり、デバイスの調達コストや場合によっては ライセンス費用も必要となるでしょう。。。
  8. まとめ • ブラウザテストはE2Eテストの1つだYo ◦ 技術的な観点ではRPAのブラウザオートメーションに近いものがあるYo • 古き時代ではブラウザの仕様が統一されていないのでテストは大変だったYo ◦ IEモードとおさらばしようね。 •

    WebDriverの登場でテストは比較的にやりやすくなったYo • Microsoft PlaywrightはブラウザテストのフレームワークだYo • WebDriverとの大きな違いはセットアップが手軽なところだYo • Microsoft Playwright Testingを使うとAzure上でE2EテストができるYo 52
  9. 54