---
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万文字）成功確認済み。