Playwright: ネットスクレイピングとテスト

# Playwright パッケージのインストール
pip install playwright

# ブラウザのインストール（Chromium、Firefox、WebKit）
playwright install

# 特定のブラウザのみ
playwright install chromium

# npm を使用
npm init playwright@latest

# yarn を使用
yarn create playwright

# 手動インストール
npm install -D @playwright/test
npx playwright install

import { defineConfig, devices } from '@playwright/test';

export default defineConfig({
  testDir: './tests',
  timeout: 30000,
  retries: 2,
  workers: 4,
  use: {
    headless: true,
    viewport: { width: 1280, height: 720 },
    screenshot: 'only-on-failure',
    video: 'retain-on-failure',
  },
  projects: [
    {
      name: 'chromium',
      use: { ...devices['Desktop Chrome'] },
    },
    {
      name: 'firefox',
      use: { ...devices['Desktop Firefox'] },
    },
    {
      name: 'webkit',
      use: { ...devices['Desktop Safari'] },
    },
  ],
});

from playwright.sync_api import sync_playwright
import json

def scrape_website():
    with sync_playwright() as p:
        # ブラウザの起動
        browser = p.chromium.launch(headless=True)
        
        # 隔離のためのコンテキストの作成
        context = browser.new_context(
            viewport={'width': 1920, 'height': 1080},
            user_agent='Mozilla/5.0 (Windows NT 10.0; Win64; x64)'
        )
        
        # 新しいページの作成
        page = context.new_page()
        
        # URL への移動
        page.goto('https://example.com/products')
        
        # コンテンツの読み込みを待機
        page.wait_for_selector('.product-item')
        
        # データの抽出
        products = page.query_selector_all('.product-item')
        
        data = []
        for product in products:
            title = product.query_selector('h2').inner_text()
            price = product.query_selector('.price').inner_text()
            url = product.query_selector('a').get_attribute('href')
            
            data.append({
                'title': title,
                'price': price,
                'url': url
            })
        
        # クリーンアップ
        browser.close()
        
        return data

# スクレイパーの実行
results = scrape_website()
print(json.dumps(results, indent=2))

async def scrape_dynamic_content():
    async with async_playwright() as p:
        browser = await p.chromium.launch()
        page = await browser.new_page()
        
        await page.goto('https://example.com/infinite-scroll')
        
        # より多くのコンテンツを読み込むためにスクロール
        for _ in range(5):
            await page.evaluate('window.scrollTo(0, document.body.scrollHeight)')
            await page.wait_for_timeout(2000)
        
        # ネットワークがアイドル状態になるのを待つ
        await page.wait_for_load_state('networkidle')
        
        # すべての読み込まれたアイテムの抽出
        items = await page.query_selector_all('.item')
        
        await browser.close()

def login_and_save_session():
    with sync_playwright() as p:
        browser = p.chromium.launch(headless=False)
        context = browser.new_context()
        page = context.new_page()
        
        # ログイン
        page.goto('https://example.com/login')
        page.fill('input[name="username"]', 'your_username')
        page.fill('input[name="password"]', 'your_password')
        page.click('button[type="submit"]')
        
        # ログイン後のナビゲーションの待機
        page.wait_for_url('**/dashboard')
        
        # 認証された状態を保存
        context.storage_state(path='auth_state.json')
        
        browser.close()

def scrape_with_saved_session():
    with sync_playwright() as p:
        browser = p.chromium.launch()
        # 保存された認証状態を再利用
        context = browser.new_context(storage_state='auth_state.json')
        page = context.new_page()
        
        # すでに認証済み！
        page.goto('https://example.com/protected-data')
        # ... 保護されたコンテンツのスクレイピング
        
        browser.close()

import { test, expect } from '@playwright/test';

test('user can add item to cart', async ({ page }) => {
  // ホームページへの移動
  await page.goto('https://example-shop.com');
  
  // 商品の検索
  await page.fill('[data-testid="search-input"]', 'laptop');
  await page.press('[data-testid="search-input"]', 'Enter');
  
  // 検索結果の待機
  await expect(page.locator('.product-card')).toBeVisible();
  
  // 最初の商品のクリック
  await page.locator('.product-card').first().click();
  
  // 商品ページの読み込みを確認
  await expect(page).toHaveURL(/\/product\/.+/);
  
  // カートへの追加
  await page.click('[data-testid="add-to-cart"]');
  
  // カートの更新を確認
  const cartCount = page.locator('[data-testid="cart-count"]');
  await expect(cartCount).toHaveText('1');
});

// pages/LoginPage.ts
export class LoginPage {
  constructor(private page: Page) {}
  
  async navigate() {
    await this.page.goto('/login');
  }
  
  async login(username: string, password: string) {
    await this.page.fill('[name="username"]', username);
    await this.page.fill('[name="password"]', password);
    await this.page.click('button[type="submit"]');
  }
  
  async getErrorMessage() {
    return await this.page.locator('.error-message').textContent();
  }
}

// tests/login.spec.ts
import { test, expect } from '@playwright/test';
import { LoginPage } from '../pages/LoginPage';

test('login with invalid credentials shows error', async ({ page }) => {
  const loginPage = new LoginPage(page);
  await loginPage.navigate();
  await loginPage.login('invalid@email.com', 'wrongpass');
  
  const error = await loginPage.getErrorMessage();
  expect(error).toContain('Invalid credentials');
});

# Codegen の起動
playwright codegen example.com

# 特定のブラウザで
playwright codegen --browser firefox example.com

# 保存された認証状態で
playwright codegen --load-storage=auth.json example.com

// 設定でトレースを有効にする
use: {
  trace: 'on-first-retry',
}

playwright show-trace trace.zip

def test_with_mocked_api():
    with sync_playwright() as p:
        browser = p.chromium.launch()
        page = browser.new_page()
        
        # API レスポンスのモック
        def handle_route(route):
            if 'api/products' in route.request.url:
                route.fulfill(
                    status=200,
                    body=json.dumps({
                        'products': [
                            {'id': 1, 'name': 'Test Product', 'price': 99.99}
                        ]
                    })
                )
            else:
                route.continue_()
        
        page.route('**/*', handle_route)
        
        page.goto('https://example.com')
        # ページはモックデータを使用
        browser.close()

from playwright.sync_api import sync_playwright

def test_mobile():
    with sync_playwright() as p:
        # デバイス記述子の使用
        iphone_13 = p.devices['iPhone 13']
        
        browser = p.webkit.launch()
        context = browser.new_context(**iphone_13)
        page = context.new_page()
        
        page.goto('https://example.com')
        
        # モバイルユーザーとしてインタラクション
        page.locator('#mobile-menu-button').click()
        
        browser.close()

# 不要なリソースの無効化
def fast_scraping():
    with sync_playwright() as p:
        browser = p.chromium.launch()
        context = browser.new_context()
        page = context.new_page()
        
        # 画像やスタイルシートをブロックしてスクレイピングを高速化
        async def block_resources(route):
            if route.request.resource_type in ['image', 'stylesheet', 'font']:
                await route.abort()
            else:
                await route.continue_()
        
        page.route('**/*', block_resources)
        page.goto('https://example.com')
        
        browser.close()

# .github/workflows/playwright.yml
name: Playwright Tests
on:
  push:
    branches: [ main, master ]
  pull_request:
    branches: [ main, master ]
jobs:
  test:
    timeout-minutes: 60
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v3
    - uses: actions/setup-node@v3
      with:
        node-version: 18
    - name: Install dependencies
      run: npm ci
    - name: Install Playwright Browsers
      run: npx playwright install --with-deps
    - name: Run Playwright tests
      run: npx playwright test
    - uses: actions/upload-artifact@v3
      if: always()
      with:
        name: playwright-report
        path: playwright-report/
        retention-days: 30

import schedule
import time

def monitor_website():
    with sync_playwright() as p:
        try:
            browser = p.chromium.launch()
            page = browser.new_page()
            page.goto('https://your-site.com', timeout=30000)
            
            # 重要な要素の確認
            assert page.is_visible('.header')
            assert page.is_visible('#main-content')
            
            print("✓ ウェブサイトは健全です")
        except Exception as e:
            print(f"✗ ウェブサイトの問題が検出されました: {e}")
            # アラートの送信
        finally:
            browser.close()

# 5分ごとに実行
schedule.every(5).minutes.do(monitor_website)

while True:
    schedule.run_pending()
    time.sleep(1)

# カスタムダウンロード場所の設定
PLAYWRIGHT_BROWSERS_PATH=/custom/path playwright install

# キャッシュをクリアして再インストール
playwright uninstall
playwright install

page.goto('https://slow-site.com', timeout=60000)  # 60秒
page.wait_for_selector('.element', timeout=30000)  # 30秒

PWDEBUG=1 pytest test_file.py