This commit is contained in:
oss-sync
+51
-17
@@ -25,17 +25,24 @@ movements:
|
||||
1. **最初に `ReadToolDoc({ name: "workspace-apps" })` で作り方の仕様を取得する**
|
||||
（ファイル配置・postMessage ブリッジの API・制約を必ず確認すること）。
|
||||
2. アプリ名を決める（英小文字・数字・ハイフン推奨）。
|
||||
3. 自己完結 HTML を `apps/{アプリ名}/index.html` に Write で書く:
|
||||
3. **アーキタイプテンプレートを出発点にする（新規作成の場合）**:
|
||||
- ワークスペース内の `readonly/app-templates/` に複数のアーキタイプ（`note-editor`, `data-viewer`, `form-input`, `dashboard` など）が seed 済み。各フォルダに `index.html` が入っている。
|
||||
- まず `Glob({ pattern: "readonly/app-templates/*/index.html" })` で一覧を確認し、依頼内容に最も近いものの `index.html` を Read で読み込む。そのまま `apps/{アプリ名}/index.html` に Write してから Edit で改修する。
|
||||
- **テンプレートには正しく動く postMessage ブリッジ（`call()` ヘルパー）が組み込み済み**。ファイル I/O を使うアプリは必ずテンプレートのブリッジ実装をそのまま流用すること（自己流で書くと応答エンベロープを取り違えて動かない）。
|
||||
- ゼロから書くよりテンプレートを改修するほうが品質・速度ともに優れる。`readonly/app-templates/` が空など見当たらない場合のみ、`ReadToolDoc({ name: "workspace-apps" })` のブリッジ実装をそのまま使ってゼロから書く。
|
||||
4. 自己完結 HTML を `apps/{アプリ名}/index.html` に Write / Edit で完成させる:
|
||||
- JS / CSS はインラインのみ。外部 CDN や外部ネットワークへのアクセスは禁止。
|
||||
- ワークスペースのファイル I/O が必要なら、doc に従って postMessage ブリッジを使う。
|
||||
- 入力フォーム・表示領域など、依頼された GUI を一通り備えた動くものにする。
|
||||
4. 既存アプリの改修依頼なら、先に Read で現状の index.html を読んでから Edit する。
|
||||
5. 既存アプリの改修依頼なら、先に Read で現状の index.html を読んでから Edit する。
|
||||
6. **作りながら `TestWorkspaceApp` で随時動作確認してよい**: 主要操作とファイル往復が成り立つか
|
||||
を実起動で確かめ、壊れていれば直す。最終判定は verify で行うが、build 中に潰せる問題は早めに潰す。
|
||||
|
||||
### 終了 / 遷移方法
|
||||
- **作成・更新できた → verify へ**: `transition({next_step: "verify", summary: "アプリ名と概要"})`
|
||||
- **依頼が曖昧で作れない**: `complete({status: "needs_user_input", missing_info: "...", why_no_default: "..."})`
|
||||
- **技術的失敗で打ち切り**: `complete({status: "aborted", abort_reason: "..."})`
|
||||
allowed_tools: [Read, Write, Edit, Glob, Grep, Bash, ReadToolDoc, ReadImage]
|
||||
allowed_tools: [Read, Write, Edit, Glob, Grep, Bash, ReadToolDoc, ReadImage, TestWorkspaceApp]
|
||||
default_next: verify
|
||||
rules:
|
||||
- condition: アプリの作成・更新が完了した
|
||||
@@ -45,26 +52,53 @@ movements:
|
||||
edit: true
|
||||
persona: reviewer
|
||||
instruction: |
|
||||
## 検証フェーズ
|
||||
## 検証フェーズ（E2E ゲート必須）
|
||||
|
||||
作成した `apps/{名前}/index.html` を読み返し、最低限の品質を確認する。
|
||||
作成した `apps/{名前}/index.html` を **必ず `TestWorkspaceApp` で実際に起動・操作して** 合否を判定する。
|
||||
静的な HTML 読み返しは補助チェックに過ぎない。`TestWorkspaceApp` を呼ばずに合格を宣言してはならない。
|
||||
|
||||
### 確認観点
|
||||
- ファイルが `apps/{名前}/index.html` に存在し、単体で開ける HTML になっているか
|
||||
- `<script src=...>` や外部 CDN・外部ネットワーク参照が混入していないか（インラインのみか）
|
||||
- 依頼された GUI 要素・操作が一通り入っているか
|
||||
- ファイル I/O を使う場合、doc どおりの postMessage ブリッジ手順になっているか
|
||||
### 手順
|
||||
|
||||
問題があれば Edit で直す。直しきれない設計上の問題なら build に戻す。
|
||||
1. **E2E テストを実行する（必須）**:
|
||||
```
|
||||
TestWorkspaceApp({
|
||||
app: "{アプリ名}",
|
||||
seed_files: [{ path: "output/...", content: "..." }], // 初期ファイルが必要な場合
|
||||
steps: [
|
||||
// 主要なインタラクションを 1 つ以上含めること（例: クリック・入力・ファイル読み書き）
|
||||
{ type: "click", selector: "[data-testid=\"save\"]" },
|
||||
{ type: "getText", selector: "[data-testid=\"status\"]" },
|
||||
...
|
||||
],
|
||||
expect: [
|
||||
// kind="text": target は CSS セレクタ、ページテキスト全体が contains を含む
|
||||
{ kind: "text", target: "[data-testid=\"status\"]", contains: "保存OK" },
|
||||
// kind="file": target はワークスペース相対パス、ファイル内容が contains を含む
|
||||
{ kind: "file", target: "output/...", contains: "..." }
|
||||
]
|
||||
})
|
||||
```
|
||||
- `steps` には主要 UI 操作（ボタン押下・フォーム入力など）を少なくとも 1 件含める。
|
||||
- ファイル I/O を持つアプリは `expect` に `kind: "file"` を追加して output/ ラウンドトリップも確認する。
|
||||
|
||||
2. **TestWorkspaceApp の結果を判定する**:
|
||||
- `ok=false`、`failures` に項目あり、または `console_errors` に重大エラーあり
|
||||
→ **build に戻す**: `transition({next_step: "build", summary: "TestWorkspaceApp の失敗内容: ..."})` を呼ぶ
|
||||
- `ok=true` かつ `failures` が空かつ `console_errors` に致命的エラーなし → 次のステップへ
|
||||
|
||||
3. **補助的な静的チェック**（E2E 合格後に確認）:
|
||||
- `<script src=...>` や外部 CDN 参照が混入していないか
|
||||
- 依頼された GUI 要素が一通り揃っているか
|
||||
|
||||
### 終了方法
|
||||
- **合格**: `complete({status: "success", result: ...})` を呼ぶ。result はそのままユーザーに表示される。
|
||||
作ったアプリ名・できること・「ワークスペースの『アプリ』タブから起動できる」旨を簡潔に伝える
|
||||
- **E2E 合格 + 静的チェック OK**: `complete({status: "success", result: ...})` を呼ぶ。
|
||||
result はそのままユーザーに表示される。
|
||||
アプリ名・できること・「ワークスペースの『アプリ』タブから起動できる」旨を簡潔に伝える
|
||||
（「作成しました」等のメタ説明ではなく、アプリの内容そのものを書く）。
|
||||
- **作り直しが必要 → build へ**: `transition({next_step: "build", summary: "具体的な指摘"})`
|
||||
- **技術的失敗**: `complete({status: "aborted", abort_reason: "..."})`
|
||||
allowed_tools: [Read, Write, Edit, Glob, Grep, Bash, ReadToolDoc]
|
||||
- **E2E 不合格・設計上の問題 → build へ**: `transition({next_step: "build", summary: "具体的な失敗内容"})`
|
||||
- **技術的失敗で続行不能**: `complete({status: "aborted", abort_reason: "..."})`
|
||||
allowed_tools: [Read, Write, Edit, Glob, Grep, Bash, ReadToolDoc, TestWorkspaceApp]
|
||||
default_next: COMPLETE
|
||||
rules:
|
||||
- condition: 作り直しが必要
|
||||
- condition: 作り直しが必要（E2E 不合格または設計上の問題）
|
||||
next: build
|
||||
|
||||
Reference in New Issue
Block a user