ken_nogi/Pleasanter/.claude/skills/pleasanter-selenium-html-scrape/SKILL.md

name: pleasanter-selenium-html-scrape description: プリザンター画面をSeleniumでログイン→Ajax描画完了後のHTML（page_source）取得するツール。API専用エンドポイント（/api/items/get等）ではなく、通常ブラウザが受け取る「生WEBレスポンス」丸ごと欲しい場合、一覧画面のグリッドデータがAjaxで後読みされ静的HTMLだけでは枠しか取れない場合に使う。「Seleniumで取得」「描画後HTML」「レンダリング済みHTML」「ブラウザ相当のレスポンス」「JS実行後のDOM」等の依頼で使用。現状は開発検証専用（対象: nextoffice2.next-hd.net）、他ホスト・本番環境への適用は都度ユーザー確認要。

プリザンター 描画後HTML取得（Selenium）

コレ何

.claude/js/get-page-html.js（fetch+Cookie方式）は静的HTMLしか取れん。一覧画面はAjaxでグリッドデータ後読み→枠だけ返る。 本ツールはSeleniumで実ブラウザ動かし、ログイン→対象URL遷移→Ajax描画完了待ち→page_source取得。JS実行後の完全DOM手に入る。

使う場面

• 一覧画面グリッドの実データ込みHTML欲しい時
• 静的HTML取得（get-page-html.js）で枠しか取れず困った時
• ブラウザDevTools相当の最終レンダリング結果をプログラムから欲しい時

該当しない場合（生JSON・サイト設定欲しいだけ等）はpleasanter-site-specスキル側のget-site-config.js使う方が適切。

現状の許可範囲（厳守）

開発検証用ホスト nextoffice2.next-hd.net（SiteId 488755、レコード例: items/488775）のみ動作確認済み・許可対象。 他ホスト（本番nextoffice.next-hd.co.jp等）・他サイトへの適用は、都度ユーザーへ明示確認取ってから行う。

事前準備

pip install selenium

Chrome または Edge インストール済み前提（Selenium 4.6+のSelenium Managerがdriver自動解決、手動ダウンロード不要）。

認証情報は環境変数で渡すか、スキル直下の.envファイル（.env.exampleを複製し値を埋める。 .gitignoreで除外済み、環境変数が優先）に記載する。チャットに平文で書かない。

export PLEASANTER_LOGIN_ID='...'
export PLEASANTER_LOGIN_PASSWORD='...'

使い方

python .claude/skills/pleasanter-selenium-html-scrape/scripts/scrape_rendered_html.py <URL> [オプション]

オプション	内容
--output / -o	HTML保存先ファイルパス。省略時は標準出力へ先頭2000文字のみ表示
--screenshot	フルページスクリーンショット保存先（PNG）。指定時のみ撮影。headless時、ページ全体の高さに合わせてウィンドウを広げてから撮影する
--wait-selector	描画完了待ちCSSセレクタ。既定#Editor, .grid-container（編集画面/一覧画面両対応）
--headless	ヘッドレスモード実行
--timeout	待機タイムアウト秒（既定15）
--action	描画待ち後に実行する操作。click:SELECTOR / type:SELECTOR:TEXT / blur:SELECTOR / wait:SECONDS。複数回指定可、指定した順に実行（タブ切替・フィールド入力→blurでchangeイベント発火、等）

例（488775の編集画面取得、HTML+スクリーンショット両方）:

python .claude/skills/pleasanter-selenium-html-scrape/scripts/scrape_rendered_html.py \
  "https://nextoffice2.next-hd.net/pleasanter/items/488775" --headless -o result.html --screenshot result.png

例（タブ切替→フィールド入力→別タブへ戻ってスクリーンショット）:

python .claude/skills/pleasanter-selenium-html-scrape/scripts/scrape_rendered_html.py \
  "https://nextoffice2.next-hd.net/pleasanter/items/488775" --headless \
  --action 'click:li[aria-controls="FieldSetTab1"]' \
  --action 'type:#Results_Class029:東京都渋谷区渋谷1-1-1' \
  --action 'blur:#Results_Class029' \
  --action 'click:li[aria-controls="FieldSetGeneral"]' \
  --action 'wait:1' \
  --screenshot after_action.png

一覧画面（/items/{SiteId}/index）等、既定セレクタで拾えない画面種別は--wait-selectorで その画面固有の要素（グリッドや特定フィールドのid/class）を指定する。不明なら一旦--output無しで 実行し先頭2000文字確認→必要ならタイムアウト内で該当要素のid/class調べ直す。

保存先の扱い

出力ファイルは実データ（業務レコード内容）含み得るためGit管理対象外にすること。 本スキルのscripts/*.htmlはリポジトリ.gitignoreで除外済み。他フォルダへ保存する場合も Git追跡対象に含めない（configs/配下等、既存の除外ルール活用）。

ログインフォームの実装メモ（実機確認済み）

• ログインID/PW入力欄: #Users_LoginId / #Users_Password
• ログインボタン#Loginはフッターリンク等と重なりclick()がElementClickInterceptedExceptionで弾かれる実績あり。 本ツールはフォームのdata-enter="#Login"仕様に沿い、パスワード欄へEnterキー送信でsubmitしている（クリックしない）。 同種のブラウザ自動化を新規に書く場合も同じ罠に注意。

動作確認済み実績

2026-08-30、https://nextoffice2.next-hd.net/pleasanter/items/488775（編集画面）にて ログイン→#Editor描画待ち→page_source取得（約310万文字）成功確認済み。