Serverless Operations, inc

>_cd /blog/id_z_1oe2-59q9

title

Playwright を AWS Lambda で動かす方法(Python・コンテナイメージ)

summary

ウェブアプリケーションのE2E テスト自動化ツールとして最近よく使われているのが Playwright です。Node.js でも Python でも利用でき、お手軽に様々なブラウザを指定してテストすることが可能なのでおすすめのツールです。この記事では、Playwright をPythonで利用する場合、かつ AWS Lambda 上にコンテナイメージとしてデプロイして利用する手順を紹介します。

Playwright とは?

Microsoft製のOSSで、Chrome(Chromium)だけでなく Safari と Firefox も簡単なコマンドでインストールして利用することが可能な E2E テストツールです。有名な Chromuim のヘッドレスブラウザである Puppeteer とほぼ同じような感覚でコードを記述していけるので、以前 Puppeteer を使ったことがある方はすぐに慣れることができるかと思います。本来 Playwright は Node.js 環境で利用しますが、この記事ではあえて Node.js ではなく Python で利用するようにして、AWS Lambda 上にコンテナイメージとしてデプロイして利用してみます。Node.js に関してもやり方は大きく変わらないので、構成において参考になれるかと思います。

公式情報は以下をご参照ください。

なぜ AWS Lambda で稼働させるか

AWS Lambda は実行回数の時間に応じて料金がかかる仕組みになっており、固定費用が発生しないため、常時起動しておく必要はありません。またスクリーンショットや各種ファイルダウンロードなどを行う場合、Amazon S3 を含め AWS の各サービスに連携しやすく、カスタマイズ製に優れ、AWSの各種マネージドセキュリティサービス・環境変数・VPC・IAMポリシーによってセキュアな環境が構築しやすいため、運用またはテストツールとしても非常に使いやすくおすすめです。

実行環境にはコンテナイメージを利用することで、AWS Lambda のペインポイントの一つであったランタイム更新の手間も以前よりかなり少なくなってきました。

近年、様々な Synthetic Monitoring(外形監視)のツールも出ており、AWS を利用中であれば、Amazon CloudWatch Synthetics についても触れたことがある方もいるのではないでしょうか。ただこれらのツールは非常に便利な一方で、費用が気になってしまうこともあるかと思います。AWS Lambda を活用すれば非常に低コストて外形監視を構築し、E2E テスト自動化を実現することが可能です。

AWS Lambda へのデプロイ手順

それでは、AWS Lambda で Playwright を実行していく手順をご紹介します。この記事では AWS マネジメントコンソールでの手順を記載していますが、AWS CDK を利用して IaC でデプロイする場合はこちらの記事(https://serverless.co.jp/blog/pgoday8w1_t/)も併せてご参考ください。

動作確認用のS3 バケットを作成

スクリーンショットを取ったら S3 にアップロードして確認を行うようにするので、バケットを作成しておきます。すでに作成しておいたテスト用のバケットがあればそれを使うようにしてこちらはスキップしても問題ありません。

動作確認用のスクリプト作成

スクリプトは以下のようにまず簡単に作成してローカルで実行を確認しておきます。アップロード先のバケットは前項で作成したバケット名または今回利用すると決めたバケット名にしてください。 ​ ​

from playwright.sync_api import sync_playwright

def lambda_handler(event, context):
    with sync_playwright() as p:
        browser = p.chromium.launch(
            args=[
                '--autoplay-policy=user-gesture-required',
                '--disable-background-networking',
                '--disable-background-timer-throttling',
                '--disable-backgrounding-occluded-windows',
                '--disable-breakpad',
                '--disable-client-side-phishing-detection',
                '--disable-component-update',
                '--disable-default-apps',
                '--disable-dev-shm-usage',
                '--disable-domain-reliability',
                '--disable-extensions',
                '--disable-features=AudioServiceOutOfProcess',
                '--disable-hang-monitor',
                '--disable-ipc-flooding-protection',
                '--disable-notifications',
                '--disable-offer-store-unmasked-wallet-cards',
                '--disable-popup-blocking',
                '--disable-print-preview',
                '--disable-prompt-on-repost',
                '--disable-renderer-backgrounding',
                '--disable-setuid-sandbox',
                '--disable-speech-api',
                '--disable-sync',
                '--disk-cache-size=33554432',
                '--hide-scrollbars',
                '--ignore-gpu-blacklist',
                '--metrics-recording-only',
                '--mute-audio',
                '--no-default-browser-check',
                '--no-first-run',
                '--no-pings',
                '--no-sandbox',
                '--no-zygote',
                '--password-store=basic',
                '--use-gl=swiftshader',
                '--use-mock-keychain',
                '--single-process'
            ]
        )

        TMP_DIR = '.tmp/' # Lambda デプロイ時は '/tmp/' にします

        context = browser.new_context()
        page = context.new_page()
        page.set_viewport_size({
          'width': 1920,
          'height': 1080,
        })
        page.goto('https://serverless.co.jp/')
        print('page: ', page)
        print('page title: ', page.title())

# local動作確認用
# Lambda へのデプロイ時はコメントアウトしてください。
lambda_handler({}, {})

コンテナイメージを作成

Dockerfile は以下のように記載します。Node.js 利用の場合は、Node.js のベースイメージを利用して、npm などから Playwright とブラウザを入れるようにしてください。

Dockerfile

ECR へプッシュする

Dockerfile の作成が終わったら、AWS 認証情報をセットし、Amazon ECR(Dockerイメージを保存・取得するコンテナレジストリーサービス)にプッシュします。AWS 認証情報のセットはこちらの記事をご参考ください。

まずは Amazon ECR にプライベートリポジトリを作成し、こちらのボタンをクリックします。

するとコマンド情報が出てくるので、そのままコピーしてコマンドを入力していきます。まず ECR にログインをし、タグ付けしてプッシュする流れになります。

AWS Lambda 関数を作成する

それでは、 AWS Lambda を作成していきます。ランタイムは「コンテナイメージ」を選択し、ECR にプッシュしておいたイメージを選択します。

関数の作成時および作成後に際して以下の項目を一通り参考にしてください。

項目

設定値

備考

Architecture

x86

  • arm64 でも動作する場合はそちらにするの方がお得
  • 利用するライブラリが限定されていたり、シンプルな構成として利用していく方針ならば arm の方がおすすめ

Memory

1024MB

  • 512MB でも動くけど、少し多めに 1024MB を指定するとパフォーマンスがよくなる
  • Timeout: ※ スクリプトの内容に合わせて適宜指定してください。

Timeout

60 seconds

  • スクリプトの内容に合わせて適宜指定

Cuncurrency

1

  • 無限ループ等の防止のため開発中は 1 を指定
  • 以降は必要に応じて指定
  • テスト目的では一桁でも十分な場合が多い

IAM Policy

s3:PutObject

  • Lambda 実行 IAM ロールのポリシーに追加
  • インラインポリシーに直接記載または S3 管理ポリシーをアタッチしてもOK

動作確認

まず、AWS Lambda のコンソールからテストを実行してみます。以下のように成功していれば問題ありません。

S3 バケットにもスクリーンショットがアップロードされているか確認します。ダウンロードしてみて、以下のように開いた画面の画像が表示されていれば問題ありません。

いかがだったでしょうか。同じような構成をコンソールではなく AWS CDK, AWS CloudFormation, Terraform などを使ってコード化し、テスト環境も IaC で構成管理を行うことが可能ですので、チャレンジしてみていただければと思います。

この記事に関する内容、または AWS でのテスト自動化などに関して気になる点やサポートが必要な方は、お気軽にお問い合わせください。

Written by
COO

金 仙優

Sonu Kim

  • Facebook->
  • X->
  • GitHub->

Share

Facebook->X->
Back
to list
<-