브라우저 자동화 툴 Playwright과 루비 웹 스크랩핑

// Playwright의 기본 구조
const { chromium } = require('playwright');

(async () => {
  const browser = await chromium.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com');
  // 다양한 작업 수행...
  await browser.close();
})();

// example.spec.js
import { test, expect } from '@playwright/test';

test('기본 테스트', async ({ page }) => {
  // 페이지 이동
  await page.goto('https://playwright.dev/');

  // 타이틀 검증
  const title = page.locator('.navbar__inner .navbar__title');
  await expect(title).toHaveText('Playwright');

  // 링크 클릭
  await page.click('text=Get Started');

  // URL 검증
  await expect(page).toHaveURL(/.*intro/);
});

# 모든 테스트 실행
npx playwright test

# 특정 브라우저에서만 실행
npx playwright test --project=chromium

# UI 모드로 실행 (시각적 디버깅)
npx playwright test --ui

const { chromium } = require('playwright');

(async () => {
  // 브라우저 시작 (헤드리스 모드)
  const browser = await chromium.launch({ headless: true });
  const page = await browser.newPage();

  try {
    // 대상 페이지로 이동
    await page.goto('https://example.com');

    // 필요한 요소가 로드될 때까지 대기
    await page.waitForSelector('.content');

    // 데이터 추출
    const data = await page.evaluate(() => {
      // 브라우저 컨텍스트에서 실행되는 코드
      const items = Array.from(document.querySelectorAll('.item'));
      return items.map(item => ({
        title: item.querySelector('.title')?.textContent,
        description: item.querySelector('.description')?.textContent,
        url: item.querySelector('a')?.href
      }));
    });

    console.log('수집된 데이터:', data);

    // 결과 저장 (예: JSON 파일)
    require('fs').writeFileSync('results.json', JSON.stringify(data, null, 2));

  } catch (error) {
    console.error('스크래핑 중 오류 발생:', error);
  } finally {
    // 브라우저 종료
    await browser.close();
  }
})();

# Gemfile
source 'https://rubygems.org'

gem 'playwright-ruby-client'
gem 'json'

npm init -y
npm install playwright
npx playwright install

# hackernews_scraper.rb
require 'playwright'
require 'json'

class HackerNewsScraper
  def initialize(max_retries: 3)
    @max_retries = max_retries
  end

  def scrape
    retries = 0

    while retries < @max_retries
      begin
        puts "스크래핑 시작 (시도 #{retries + 1}/#{@max_retries})..."
        articles = scrape_hackernews
        save_articles(articles)
        return articles
      rescue => e
        puts "오류 발생: #{e.message}"
        puts e.backtrace
        retries += 1

        if retries >= @max_retries
          puts "최대 재시도 횟수를 초과했습니다."
          raise e
        end

        sleep_time = retries * 3
        puts "#{sleep_time}초 후 재시도합니다..."
        sleep(sleep_time)
      end
    end
  end

  private

  def scrape_hackernews
    articles = []

    Playwright.create(playwright_cli_executable_path: './node_modules/.bin/playwright') do |playwright|
      playwright.chromium.launch(headless: false) do |browser|
        puts '브라우저를 시작합니다...'

        # 새 컨텍스트 생성
        context = browser.new_context(
          viewport: { width: 1280, height: 800 },
          userAgent: 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36'
        )

        page = context.new_page

        # 페이지 설정
        page.set_default_timeout(30000) # 30초 타임아웃

        # HackerNews로 이동
        puts 'HackerNews로 이동합니다...'
        page.goto('https://news.ycombinator.com/', waitUntil: 'networkidle')

        # 스크린샷 촬영
        timestamp = Time.now.strftime('%Y%m%d_%H%M%S')
        page.screenshot(path: "hackernews_#{timestamp}.png")

        puts '뉴스 기사를 수집합니다...'

        # 뉴스 항목 선택자
        items = page.locator('tr.athing')
        count = items.count

        puts "#{count}개의 항목을 발견했습니다."

        # 각 항목 처리
        (0...count).each do |i|
          item = items.nth(i)

          # 필요한 요소 추출
          id = item.get_attribute('id')
          title_element = item.locator('td.title > span.titleline > a')
          title = title_element.text_content
          url = title_element.get_attribute('href')

          site_element = item.locator('span.sitestr')
          site = site_element.count > 0 ? site_element.text_content : ''

          # 다음 행 찾기
          subtext = page.locator("tr:has(#score_#{id})").last

          # 점수 추출
          score_element = subtext.locator('.score')
          score = score_element.count > 0 ? score_element.text_content : 'No score'

          # 댓글 수 추출
          comment_element = subtext.locator("a[href=\"item?id=#{id}\"]").last
          comments = comment_element.count > 0 ? comment_element.text_content : '0 comments'

          # 작성자 추출
          author_element = subtext.locator('.hnuser')
          author = author_element.count > 0 ? author_element.text_content : 'Unknown'

          articles << {
            id: id,
            title: title,
            url: url,
            site: site,
            score: score,
            comments: comments,
            author: author
          }
        end

        puts "#{articles.length}개의 기사를 수집했습니다."
      end
    end

    articles
  end

  def save_articles(articles)
    timestamp = Time.now.strftime('%Y%m%d_%H%M%S')
    filename = "hackernews_#{timestamp}.json"

    File.write(filename, JSON.pretty_generate(articles))
    puts "결과를 #{filename}에 저장했습니다."

    filename
  end
end

scraper = HackerNewsScraper.new
begin
  scraper.scrape
  puts "스크래핑이 성공적으로 완료되었습니다."
rescue => e
  puts "스크래핑 실패: #{e.message}"
end

# analyzer.rb
require 'json'

class HackerNewsAnalyzer
  def initialize(filename)
    @filename = filename
    @articles = JSON.parse(File.read(filename), symbolize_names: true)
    puts "#{@articles.length}개의 기사를 분석합니다..."
  end

  def analyze
    # 점수 추출 및 숫자로 변환
    scores = @articles.map do |article|
      score_text = article[:score]
      score_match = score_text.match(/(\d+)/)
      score_match ? score_match[1].to_i : 0
    end

    # 기본 통계 계산
    total_score = scores.sum
    avg_score = total_score.to_f / scores.length
    max_score = scores.max
    min_score = scores.select { |s| s > 0 }.min

    # 도메인별 글 개수
    domain_counts = Hash.new(0)
    @articles.each do |article|
      domain = article[:site].to_s.empty? ? '(no domain)' : article[:site]
      domain_counts[domain] += 1
    end

    # 상위 도메인 추출
    top_domains = domain_counts.sort_by { |_, count| -count }.take(5)

    # 결과 출력
    puts "\n===== 분석 결과 ====="
    puts "총 기사 수: #{@articles.length}"
    puts "평균 점수: #{avg_score.round(2)} 포인트"
    puts "최고 점수: #{max_score} 포인트"
    puts "최저 점수: #{min_score} 포인트"

    puts "\n상위 5개 도메인:"
    top_domains.each_with_index do |(domain, count), index|
      puts "#{index + 1}. #{domain}: #{count}개 기사"
    end

    # 최고 점수 기사 찾기
    top_article = @articles.max_by do |article|
      score_match = article[:score].match(/(\d+)/)
      score_match ? score_match[1].to_i : 0
    end

    puts "\n최고 점수 기사:"
    puts "제목: #{top_article[:title]}"
    puts "URL: #{top_article[:url]}"
    puts "점수: #{top_article[:score]}"
    puts "작성자: #{top_article[:author]}"
  end
end

# 최신 파일 찾기
files = Dir['hackernews_*.json'].sort
if files.empty?
  puts "분석할 데이터 파일이 없습니다."
  exit(1)
end

latest_file = files.last
puts "최신 파일 #{latest_file}을 분석합니다."

analyzer = HackerNewsAnalyzer.new(latest_file)
analyzer.analyze

$ ruby analyzer.rb
최신 파일 hackernews_20250411_162217.json을 분석합니다.
30개의 기사를 분석합니다...

===== 분석 결과 =====
총 기사 수: 30
평균 점수: 111.73 포인트
최고 점수: 578 포인트
최저 점수: 6 포인트

상위 5개 도메인:
1. developer.mozilla.org: 1개 기사
2. lesswrong.com: 1개 기사
3. sciencedaily.com: 1개 기사
4. garfieldminusgarfield.net: 1개 기사
5. centminmod.com: 1개 기사

최고 점수 기사:
제목: Garfield Minus Garfield
URL: https://garfieldminusgarfield.net
점수: 578 points
작성자: mike1o1

# VS Code에서
code --add-mcp '{"name":"playwright","command":"npx","args":["@playwright/mcp@latest"]}'

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "@playwright/mcp@latest"
      ]
    }
  }
}

// URL로 이동
browser_navigate({ url: "https://example.com" });

// 요소 클릭하기
browser_click({
  element: "Login 버튼",
  ref: "button-login-123"
});

// 텍스트 입력하기
browser_type({
  element: "이메일 입력란",
  ref: "input-email-456",
  text: "[email protected]",
  submit: true
});

// 스냅샷 캡처
const snapshot = await browser_snapshot();