enact/playwright
擷取螢幕截圖並擷取網頁內容
瀏覽器自動化對於測試、資料擷取和視覺驗證至關重要。此技能提供了一種可靠的方式，可使用 Playwright 從任何網頁擷取螢幕截圖以及擷取文字或 HTML 內容。
スキルZIPをダウンロード
Claudeでアップロード
設定 → 機能 → スキル → スキルをアップロードへ移動
オンにして利用開始
テストする
「enact/playwright」を使用しています。 Take a screenshot of https://example.com
期待される結果:
- Starting Playwright...
- URL: https://example.com
- Action: screenshot
- Selector: body
- Using browser at: /ms-playwright/chromium-XXXX/chrome-linux/chrome
- Navigating to https://example.com...
- Page loaded successfully
- SCREENSHOT_START
- [base64-encoded-image-data]
- SCREENSHOT_END
「enact/playwright」を使用しています。 Get the text from the heading on https://example.com
期待される結果:
- Example Domain
「enact/playwright」を使用しています。 Extract the HTML from the main content on https://example.com
期待される結果:
- <div>
- <h1>Example Domain</h1>
- <p>This domain is for use in illustrative examples...</p>
- </div>
セキュリティ監査
低リスクStatic scanner flagged 16 potential issues, but all findings are false positives. The code uses safe JavaScript template literals for logging (not shell backticks), empty string fields (not weak crypto), and standard fs operations for legitimate browser path detection. The skill is a standard Playwright browser automation tool with no malicious patterns.
中リスクの問題 (2)
リスク要因
🌐 ネットワークアクセス (3)
検出されたパターン
品質スコア
作れるもの
視覺回歸測試
擷取網頁螢幕截圖，與基線影像進行比較以進行視覺回歸測試。
擷取內容进行分析
從網頁擷取文字或 HTML 內容，以進行後續處理或分析。
文件和報告
擷取網頁螢幕截圖，用於文件、報告或簡報。
これらのプロンプトを試す
Take a screenshot of https://example.com
Get the text content from the main heading on https://example.com using the selector 'h1'
Extract the HTML content of the article section from https://example.com/blog/article
Take a screenshot of the product gallery on https://example.com/shop/product using selector '.product-gallery'
ベストプラクティス
- 使用特定的 CSS 選擇器來定位要擷取的精確元素
- 將螢幕截圖處理為 base64 編碼字串以便傳輸
- 為載入緩慢的頁面設定適當的超時值
- 使用 try-finally 區塊正確關閉瀏覽器，以防止資源洩漏
回避
- 不要使用此技能來擷取禁止自動化存取的網站
- 避免擷取包含敏感或個人資訊的頁面螢幕截圖
- 不要依賴此功能進行需要使用者模擬的互動式網頁測試
- 避免在沒有適當憑證的情況下從需要驗證的頁面擷取內容