用內建瀏覽器驗收頁面

In-app browser 讓你和 Codex 在同一個 thread 中共享 rendered web pages 的檢視。你在構建或除錯 web app 時，可以用它 preview pages，並附加 visual comments。

適合使用 in-app browser 的頁面：

• local development servers
• file-backed previews
• 不需要 sign-in 的 public pages

如果頁面依賴 login state 或 browser extensions，使用你的常規 browser。

開啟方式：

• 從 toolbar 開啟。
• 點選 URL。
• 在 browser 中手動導航。
• macOS 按 Cmd+Shift+B。
• Windows 按 Ctrl+Shift+B。

邊界要記住：in-app browser 不支援 authentication flows、signed-in pages、你的常規 browser profile、cookies、extensions 或 existing tabs。它適合 Codex 無需登入即可開啟的頁面。

把 page content 當作 untrusted context，不要把 secrets 貼上進 browser flows。

官方截圖：

• light：https://developers.openai.com/images/codex/app/in-app-browser-light.webp
• dark：https://developers.openai.com/images/codex/app/in-app-browser-dark.webp

瀏覽器使用

Browser use 讓 Codex 直接操作 in-app browser。適合 local development servers 和 file-backed previews，尤其當 Codex 需要：

• click
• type
• inspect rendered state
• take screenshots
• 在頁面中 verify a fix

使用方式：

1. 安裝並啟用 Browser plugin。
2. 在 task 中要求 Codex 使用 browser，或直接引用 @Browser。
3. 在 settings 中管理 allowed websites 和 blocked websites。

App 會把 browser use 限制在 in-app browser 內。

示例：

请使用 browser 打开 http://localhost:3000/settings，复现 layout bug，并且只修复 overflowing controls。

Codex 使用某個 website 前會先詢問你，除非你已經 allow 這個 website。把網站從 allowed list 中移除後，Codex 下次會重新詢問。把網站從 blocked list 中移除後，Codex 也可以重新詢問，而不是繼續視為 blocked。

預覽頁面

基本流程：

1. 在 integrated terminal 中啟動 app development server，或用 local environment action 啟動。
2. 點選 URL 或在 browser 中手動導航，開啟 unauthenticated local route、file-backed page 或 public page。
3. 在 code diff 旁邊 review rendered state。
4. 在需要修改的 elements 或 areas 上留下 browser comments。
5. 要求 Codex 處理這些 comments，並保持 scope 狹窄。

示例反饋：

I left comments on the pricing page in the in-app browser. Address the mobile
layout issues and keep the card structure unchanged.

在頁面上評論

當 bug 只在 rendered page 中可見時，用 browser comments 給 Codex 精確反饋。

操作方式：

• 開啟 comment mode，選擇 element 或 area，然後提交 comment。
• comment mode 下，按住 Shift 並點選，可以選擇一個 area。
• 按住 Cmd 並點選，可以立即傳送 comment。

留下 comments 後，在 thread 裡發訊息，讓 Codex 處理。Comments 最適合那些需要精確 visual change 的任務。

好的反饋應該具體。

This button overflows on mobile. Keep the label on one line if it fits,
otherwise wrap it without changing the card height.

This tooltip covers the data point under the cursor. Reposition the tooltip so
it stays inside the chart bounds.

控制瀏覽器任務範圍

In-app browser 用於 review 和 iteration。每個 browser task 都應該小到可以一次 review 完。

保持 scope 的做法：

• 指明 page、route 或 local URL。
• 指明你關心的 visual state，例如 loading、empty、error 或 success。
• 在需要修改的 exact elements 或 areas 上留下 comments。
• Codex 改完 code 後，review updated route。
• Codex 使用 browser 前，讓它先 start 或 check dev server。

repository changes 的 review 應使用 review pane，在那裡檢查 changes 並留下 comments。