noui-record-login
認証が必要なアプリのログイン操作を記録し、Tabbyに登録してtabby_profile_idを取得することで、NoUIワークフローで認証を自動化できるようにするSkill。
📜 元の英語説明(参考)
Use this skill when the user wants to record a login flow for an authenticated app and register it with Tabby to get a tabby_profile_id. Triggers on "record a login", "capture a login flow", "register with Tabby", "set up authentication for NoUI", "create a tabby_profile_id", "noui login record", "login recording mode", or "I need auth for my workflow".
🇯🇵 日本人クリエイター向け解説
認証が必要なアプリのログイン操作を記録し、Tabbyに登録してtabby_profile_idを取得することで、NoUIワークフローで認証を自動化できるようにするSkill。
※ jpskill.com 編集部が日本のビジネス現場向けに補足した解説です。Skill本体の挙動とは独立した参考情報です。
下記のコマンドをコピーしてターミナル(Mac/Linux)または PowerShell(Windows)に貼り付けてください。 ダウンロード → 解凍 → 配置まで全自動。
mkdir -p ~/.claude/skills && cd ~/.claude/skills && curl -L -o noui-record-login.zip https://jpskill.com/download/9727.zip && unzip -o noui-record-login.zip && rm noui-record-login.zip
$d = "$env:USERPROFILE\.claude\skills"; ni -Force -ItemType Directory $d | Out-Null; iwr https://jpskill.com/download/9727.zip -OutFile "$d\noui-record-login.zip"; Expand-Archive "$d\noui-record-login.zip" -DestinationPath $d -Force; ri "$d\noui-record-login.zip"
完了後、Claude Code を再起動 → 普通に「動画プロンプト作って」のように話しかけるだけで自動発動します。
💾 手動でダウンロードしたい(コマンドが難しい人向け)
- 1. 下の青いボタンを押して
noui-record-login.zipをダウンロード - 2. ZIPファイルをダブルクリックで解凍 →
noui-record-loginフォルダができる - 3. そのフォルダを
C:\Users\あなたの名前\.claude\skills\(Win)または~/.claude/skills/(Mac)へ移動 - 4. Claude Code を再起動
⚠️ ダウンロード・利用は自己責任でお願いします。当サイトは内容・動作・安全性について責任を負いません。
🎯 このSkillでできること
下記の説明文を読むと、このSkillがあなたに何をしてくれるかが分かります。Claudeにこの分野の依頼をすると、自動で発動します。
📦 インストール方法 (3ステップ)
- 1. 上の「ダウンロード」ボタンを押して .skill ファイルを取得
- 2. ファイル名の拡張子を .skill から .zip に変えて展開(macは自動展開可)
- 3. 展開してできたフォルダを、ホームフォルダの
.claude/skills/に置く- · macOS / Linux:
~/.claude/skills/ - · Windows:
%USERPROFILE%\.claude\skills\
- · macOS / Linux:
Claude Code を再起動すれば完了。「このSkillを使って…」と話しかけなくても、関連する依頼で自動的に呼び出されます。
詳しい使い方ガイドを見る →- 最終更新
- 2026-05-18
- 取得日時
- 2026-05-18
- 同梱ファイル
- 1
📖 Skill本文(日本語訳)
※ 原文(英語/中国語)を Gemini で日本語化したものです。Claude 自身は原文を読みます。誤訳がある場合は原文をご確認ください。
NoUI Record Login
認証されたアプリのログインフローを記録し、Tabbyに登録して tabby_profile_id を生成します。このIDは、認証が必要なアプリのワークフローを FastMCP サーバーとしてエクスポートする際に必要です。
実行時の前提条件: CDP-default の実行パス(/noui-record-workflow → How Execution Works を参照)には、記録中だけでなく、呼び出し時 にアプリがロードされた状態の、稼働中の Tabby ブラウザセッションが必要です。生成された MCP サーバーまたは Skill が使用される場所では、Tabby を実行し続けるように計画してください。
すべてのコマンドは、noui/ ディレクトリから .venv/bin/python cli/main.py を使用して実行します。
前提条件: /noui-setup が完了している必要があります — venv がインストールされ、.env が ANTHROPIC_API_KEY、TABBY_API_HOST、および TABBY_ADMIN_TOKEN で構成され、Chrome 拡張機能がロードされていること。
重要なルール (絶対に違反しないこと)
- 常に、ユーザーに記録を依頼する前にバックエンドを起動してください
- 常に、エクスポート後、登録前に
login reviewを実行してください — きれいに見える記録であってもスキップしないでください - 絶対に、レビューの出力に
Generator valid: Noまたはジェネレーターエラーが表示された場合はlogin registerを実行しないでください - 絶対に、
login validateが HEALTHY 状態になるまで、ワークフローのエクスポートでtabby_profile_idを使用しないでください - 常に、
login registerによって出力されるtabby_profile_idをメモしてください —/noui-record-workflowに必要です
ステップ 1 — バックエンドの起動
.venv/bin/python cli/main.py start
http://localhost:8002 でデタッチされた FastAPI サーバーを起動します。以下で確認してください:
.venv/bin/python cli/main.py status
起動に失敗した場合:
| 症状 | 解決策 |
|---|---|
| ポートが既に使用されている | lsof -i :8002; 競合するプロセスを強制終了するか、.env で NOUI_PORT を設定します |
uvicorn not found |
依存関係がインストールされていません — poetry install --no-root を実行します |
| 準備完了にならなかった | リポジトリルートの .noui-backend.log を確認してください |
ステップ 2 — ログイン記録セッションの作成
.venv/bin/python cli/main.py login record "<AppName>" "<login-url>"
例:
.venv/bin/python cli/main.py login record "HubSpot" "https://app.hubspot.com/login"
CLI はセッションを作成し、session_id を出力します。メモしてください — エクスポートステップで必要になります。
ステップ 3 — Chrome での記録
CLI は拡張機能で App と Login プロセスを自動的に作成しました (ステップ 2)。標準のキャプチャフローを使用します:
- Chrome ツールバーの NoUI Workflow Recorder 拡張機能アイコンをクリックします
- アプリリストに App (例: "HubSpot") が表示されます — それをクリックします
- アプリ内の Login プロセスをクリックします
- まだログイン URL に移動していない場合は、アクティブな Chrome タブでログイン URL に移動します
- Start Capture をクリックして記録を開始します
- 完全なログインフローを実行します: 認証情報を入力し、送信し、認証されたページが完全に落ち着くまで待ちます
- 完了したら Stop をクリックします
App または Login プロセスが表示されない場合は、バックエンドが実行中であること (
status) と、ステップ 2 が成功したことを確認してください。
ステップ 4 — バンドルのエクスポート
.venv/bin/python cli/main.py login export <session_id>
キャプチャされたセッションを分析し、以下を書き込みます:
workbench/login_recordings/<session_id8>-bundle.json
バンドルには、アプリケーションのドラフト、サービスプロファイルのドラフト、推論されたログインステップ、およびレビュー項目が含まれています。
ステップ 5 — バンドルのレビュー
.venv/bin/python cli/main.py login review workbench/login_recordings/noui-<session_id8>-bundle.json
出力で以下を確認してください:
Generator valid: No— ハードブロック; 登録に進まないでください; 再記録してくださいErrors:セクション — 登録する前に解決する必要がありますWarnings:セクション — セレクターの信頼度を確認してください; 信頼度が低い場合は再記録してくださいGenerated login steps:— 推論されたステップが実際のログインフローと一致することを確認してください
Generator valid: Yes でエラーがない場合にのみ、ステップ 6 に進んでください。
ステップ 6 — Tabby への登録
Tabby は TABBY_API_HOST (デフォルト http://localhost:8080) で到達可能である必要があり、.env で TABBY_ADMIN_TOKEN が設定されている必要があります。
Tabby がまだ実行されていない場合:
noui tabby startを実行してからnoui tabby setup(インタラクティブ) を実行して、サービスを開始し、登録前にエージェントの認証情報をプロビジョニングします。完全な Tabby CLI リファレンスについては、/noui-setupを参照してください。
.venv/bin/python cli/main.py login register workbench/login_recordings/noui-<session_id8>-bundle.json
Tabby Application と STAGING ServiceProfile をプロビジョニングします。成功した場合:
Registered profile '<profile_id>'
Tabby profile ID : <tabby_profile_id>
Version state : STAGING
tabby_profile_id の値を記録してください — これは workflow export --as mcp の --profile 引数です。
ステップ 7 — 認証情報の設定
登録後、Tabby のブラウザワーカーが自動ログインを実行できるように、ログイン認証情報 (ユーザー名/パスワード) を提供します:
.venv/bin/python cli/main.py login credentials workbench/login_recordings/noui-<session_id8>-bundle.json
CLI は以下をインタラクティブにプロンプト表示します:
- Username (email): ログインに使用されるアカウントのメールアドレス
- Password: マスクされた入力で入力されます (エコーバックされません)
認証情報は以下に保存されます:
tabby/.tabby-noui-client.json(ユーザー名 + プロファイルメタデータ)tabby/.env.local(パスワードはTABBY_NOUI_<PROFILE>_PASSWORDとして)
このステップは必須です tabby session ensure がブラウザセッションを開始する前に — これがないと、ワーカーは Credentials not found で失敗します。
重要: このコマンドはユーザーの操作 (キーボード入力) が必要です。ユーザーが自分のターミナルで認証情報を安全に入力できるように、
! .venv/bin/python cli/main.py login credentials <bundle.json>を介してユーザー自身に実行するように依頼してください。
ステップ 8 — プロファイルの検証
.venv/bin/python cli/main.py login validate workbench/login_recordings/noui-<session_id8>-bundle.json
プロファイルが HEALTHY 状態になるまで、最大 60 秒間 Tabby をポーリングします。
検証に失敗した場合:
| 症状 | 解決策 |
|---|---|
| プロファイルが FAILED 状態になる | より遅く、より慎重なインタラクションで再記録してください |
| タイムアウト (60 秒) | Tabby のログを確認してください; TABBY_API_HOST に到達可能であることを確認してください |
(原文がここで切り詰められています)
📜 原文 SKILL.md(Claudeが読む英語/中国語)を展開
NoUI Record Login
Record a login flow for an authenticated app and register it with Tabby to produce a tabby_profile_id. That ID is required when exporting a workflow as a FastMCP server for an app that needs authentication.
Runtime prerequisite: the CDP-default execution path (see /noui-record-workflow → How Execution Works) needs a live Tabby browser session with the app loaded at invocation time, not only during recording. Plan to keep Tabby running wherever the generated MCP server or Skill is used.
All commands run from the noui/ directory using .venv/bin/python cli/main.py.
Prerequisite: /noui-setup must be complete — venv installed, .env configured with ANTHROPIC_API_KEY, TABBY_API_HOST, and TABBY_ADMIN_TOKEN, Chrome extension loaded.
Critical Rules (Never Violate)
- ALWAYS start the backend before asking the user to record
- ALWAYS run
login reviewafter export and before register — never skip it even for clean-looking recordings - NEVER run
login registerif the review output showsGenerator valid: Noor any generator errors - NEVER use the
tabby_profile_idin a workflow export untillogin validatesucceeds with a HEALTHY state - ALWAYS note the
tabby_profile_idprinted bylogin register— it is needed for/noui-record-workflow
Step 1 — Start the Backend
.venv/bin/python cli/main.py start
Spawns a detached FastAPI server at http://localhost:8002. Verify with:
.venv/bin/python cli/main.py status
If startup fails:
| Symptom | Fix |
|---|---|
| Port already in use | lsof -i :8002; kill conflicting process or set NOUI_PORT in .env |
uvicorn not found |
Deps not installed — run poetry install --no-root |
| Did not become ready | Check .noui-backend.log in the repo root |
Step 2 — Create a Login Recording Session
.venv/bin/python cli/main.py login record "<AppName>" "<login-url>"
Example:
.venv/bin/python cli/main.py login record "HubSpot" "https://app.hubspot.com/login"
The CLI creates a session and prints the session_id. Note it — you need it for the export step.
Step 3 — Record in Chrome
The CLI automatically created an App and a Login process in the extension (Step 2). Use the standard capture flow:
- Click the NoUI Workflow Recorder extension icon in the Chrome toolbar
- You will see the App (e.g., "HubSpot") in the Apps list — click it
- Click the Login process inside the app
- Navigate to the login URL in the active Chrome tab if not already there
- Click Start Capture to begin recording
- Perform the complete login flow: enter credentials, submit, and wait for the authenticated page to fully settle
- Click Stop when done
If the App or Login process is not visible, confirm the backend is running (
status) and that Step 2 succeeded.
Step 4 — Export the Bundle
.venv/bin/python cli/main.py login export <session_id>
Analyzes the captured session and writes:
workbench/login_recordings/<session_id8>-bundle.json
The bundle contains the application draft, service profile draft, inferred login steps, and review items.
Step 5 — Review the Bundle
.venv/bin/python cli/main.py login review workbench/login_recordings/noui-<session_id8>-bundle.json
Check the output for:
Generator valid: No— hard block; do not proceed to register; re-recordErrors:section — must resolve before registeringWarnings:section — review selector confidence; re-record if confidence is lowGenerated login steps:— verify the inferred steps match the actual login flow
Only proceed to Step 6 if Generator valid: Yes and no errors.
Step 6 — Register with Tabby
Tabby must be reachable at TABBY_API_HOST (default http://localhost:8080) and TABBY_ADMIN_TOKEN must be set in .env.
If Tabby is not yet running: run
noui tabby startthennoui tabby setup(interactive) to start the service and provision agent credentials before registering. See/noui-setupfor the full Tabby CLI reference.
.venv/bin/python cli/main.py login register workbench/login_recordings/noui-<session_id8>-bundle.json
Provisions a Tabby Application and a STAGING ServiceProfile. On success:
Registered profile '<profile_id>'
Tabby profile ID : <tabby_profile_id>
Version state : STAGING
Record the tabby_profile_id value — this is the --profile argument for workflow export --as mcp.
Step 7 — Set Credentials
After registration, provide the login credentials (username/password) so that Tabby's browser worker can perform the automated login:
.venv/bin/python cli/main.py login credentials workbench/login_recordings/noui-<session_id8>-bundle.json
The CLI will prompt interactively for:
- Username (email): the account email used to log in
- Password: entered with masked input (not echoed)
Credentials are stored in:
tabby/.tabby-noui-client.json(username + profile metadata)tabby/.env.local(password asTABBY_NOUI_<PROFILE>_PASSWORD)
This step is required before tabby session ensure can start a browser session — without it the worker will fail with Credentials not found.
IMPORTANT: This command requires user interaction (keyboard input). Ask the user to run it themselves via
! .venv/bin/python cli/main.py login credentials <bundle.json>so that credentials are entered securely in their terminal.
Step 8 — Validate the Profile
.venv/bin/python cli/main.py login validate workbench/login_recordings/noui-<session_id8>-bundle.json
Polls Tabby for up to 60 seconds waiting for the profile to reach HEALTHY state.
If validation fails:
| Symptom | Fix |
|---|---|
| Profile enters FAILED state | Re-record with slower, more deliberate interactions |
| Timeout (60s) | Check Tabby logs; confirm TABBY_API_HOST is reachable |
| Keepalive URL errors | The keepalive URL must return HTTP 200 when authenticated — redirect-only URLs are not valid |
Step 9 — Ensure a Live Tabby Browser Session
A HEALTHY profile in Tabby is a service configuration record. It does not mean a live browser session is running. The runtime auth adapter (noui_runtime/auth.py) needs an active session worker to fetch credentials at tool-call time.
.venv/bin/python cli/main.py tabby session ensure --profile <profile_id>
Example:
.venv/bin/python cli/main.py tabby session ensure --profile expedia
Starts (or verifies) a persistent browser session worker for the registered profile. The --profile flag is required — without it the command uses the default profile list from the cache, which may not include the newly registered profile. Expected output:
✓ Session for '<profile_id>' is HEALTHY
If this fails:
| Symptom | Fix |
|---|---|
TABBY_CLIENT_ID / TABBY_CLIENT_SECRET not set |
Run tabby setup to provision agent credentials and write them to .env |
| Worker starts but immediately exits | Check .noui-backend.log; confirm Tabby is reachable at TABBY_API_HOST |
| Profile not found in cache | Confirm login register ran successfully — it adds the profile to the cache automatically |
Credentials not found for k8s:secret/... |
Run login credentials <bundle.json> to set username/password |
You only need to do this once per machine restart, or if the session worker has stopped. Run
tabby session statusto check current state without starting a new worker.
Convenience Path (clean recordings only)
.venv/bin/python cli/main.py login import <session_id>
.venv/bin/python cli/main.py login import <session_id> --validate
Runs export + review + register in one command (and optionally validate). Use only for recordings with no expected issues — the decomposed flow above is easier to debug.
Output
On completion you have:
workbench/login_recordings/noui-<session_id8>-bundle.jsontabby_profile_id— printed bylogin register- A live Tabby browser session confirmed via
tabby session ensure
Pass the tabby_profile_id to /noui-record-workflow via --profile. The session worker must remain running during workflow recording and runtime use.
Decision Flow
Start
│
├─ backend running?
│ ├─ No → Step 1: start
│ └─ Yes → continue
│
Step 2: login record "<App>" "<url>" → note session_id
│
Step 3: Chrome (Apps → <AppName> → Login → Start Capture → login → Stop)
└─ no events on export? → ensure target tab was active, retry Step 3
│
Step 4: login export <session_id>
└─ writes noui-<id8>-bundle.json
│
Step 5: login review <bundle.json>
├─ generator errors? → re-record (return to Step 2)
└─ clean → continue
│
Step 6: login register <bundle.json> → note tabby_profile_id
│
Step 7: login credentials <bundle.json> (user enters username + password)
│
Step 8: login validate <bundle.json>
├─ HEALTHY → continue
└─ FAILED → re-record (return to Step 2)
│
Step 9: tabby session ensure --profile <profile_id>
└─ session worker healthy → pass tabby_profile_id to /record-workflow
CLI Command Reference
| Command | Purpose |
|---|---|
.venv/bin/python cli/main.py start |
Start the NoUI backend |
.venv/bin/python cli/main.py status |
Check backend and Tabby reachability |
.venv/bin/python cli/main.py login record "<App>" "<url>" |
Create a login recording session |
.venv/bin/python cli/main.py login list |
List existing login sessions |
.venv/bin/python cli/main.py login export <session_id> |
Analyze session → write bundle JSON |
.venv/bin/python cli/main.py login review <bundle.json> |
Print validation and review items |
.venv/bin/python cli/main.py login register <bundle.json> |
Provision Application + STAGING ServiceProfile in Tabby |
.venv/bin/python cli/main.py login credentials <bundle.json> |
Set username/password for a registered profile |
.venv/bin/python cli/main.py login validate <bundle.json> |
Wait for profile to become HEALTHY |
.venv/bin/python cli/main.py login import <session_id> |
Convenience: export + review + register |
.venv/bin/python cli/main.py login import <session_id> --validate |
Convenience: export + review + register + validate |
.venv/bin/python cli/main.py tabby session ensure --profile <id> |
Start or verify a live browser session worker |
.venv/bin/python cli/main.py tabby session status |
Show current browser session state |
Troubleshooting
| Symptom | Fix |
|---|---|
| Backend not running | .venv/bin/python cli/main.py start |
Tabby API not reachable |
Confirm Tabby is running; check TABBY_API_HOST in .env |
| Bundle has generator errors | Re-record with slower, explicit interactions; avoid rapid clicks |
| App or Login process missing in extension | Confirm Step 2 ran successfully; check backend is running |
| Low selector confidence in review | Re-record; interact with fields one at a time with visible focus |
| Validate timeout (60s) | Check Tabby logs; verify the keepalive URL returns HTTP 200 when authenticated |
Credentials not found for k8s:secret/... |
Run login credentials <bundle.json> to set username/password |
TRANSIENT_FAIL on health check |
The site may be rate-limiting (429) the url_check. Update the app's keepalive config in Tabby to use a dom_check on body instead via PUT /apps/{app_id} |
| Keepalive URL is redirect-only | Find a URL that loads authenticated content, not a redirect chain |