Tabbit部落格

Cursor 如何操作瀏覽器並驗證頁面修復

在 Cursor 打開開發頁,記錄問題狀態,用相同尺寸和操作復驗修復。

本文目錄
  1. 選擇瀏覽器入口
  2. 打開準確的開發地址
  3. 給 Agent 可復現的問題
  4. 縮小改動範圍
  5. 用相同條件復驗
  6. 找不到 Browser 工具時

Cursor Agent 可以調用內置 Browser 打開網頁、點擊、輸入和讀取截圖、日誌等信息。檢查本地界面時,先指定網址、視口尺寸和失敗現象。改完後用相同的條件重做操作,回讀頁面結果。

本次在合成表單中由 Cursor Agent CLI 2026.09.10-fd3934a 修改源碼,Tabbit 獨立驗證頁面。已讀取本機 Cursor Desktop 3.28.7。CLI 回傳結果含工具發現、讀取和編輯,未調用 IDE Browser。文中的 IDE Browser 步驟來自 Cursor 官方文件。

選擇瀏覽器入口

能從開發工作區訪問的頁面,先用 Cursor 內置 Browser。官方文件說明瀏覽器可內嵌或單獨顯示,會話狀態按工作區隔離。若同時設定檔了外部 MCP,查看 Agent 動作記錄中的實際工具,兩條路徑的瀏覽器會話和存儲可能不同。

在 IDE 中從命令面板打開 Browser,在對話里輸入 @browser。出現工具許可時,先核對站點和動作。

入口會話先核對
Cursor Browser工作區狀態Agent
External MCP連接器設定檔MCP

Cursor Browser Docs · 瀏覽器 UI 測試 · 瀏覽器自動化 Agent

打開準確的開發地址

給出正在運行的網址、端口和頁面路徑。多個開發服務並行時,請 Agent 回報實際標題和地址。填寫合成數據。頁面跳轉或要求登入時先停下,確認需要哪套獲准使用的測試會話。

適合 Agent 的瀏覽器 · 瀏覽器 Agent

給 Agent 可復現的問題

記錄視口寬度、出問題的控件和可見現象。以運費估算表單為例,比較文件滾動寬度和視口寬度,再看整個按鈕是否位於表單面板內。若有控制台錯誤,只補充相關信息和觸發它的操作。

@browser 打開指定開發地址。在目標視口報告標題、橫向滾動寬度和 Check estimate 按鈕是否超出面板。若溢出,只修改表單 CSS。按原寬度重新加載,用示例郵編點擊一次並回報狀態。

瀏覽器自動化 · Agent 瀏覽器安全

縮小改動範圍

只改受影響的組件,保留桌面的橫向排列、輸入框、標籤和狀態更新。截圖說明佈局,計算寬度和點擊後的狀態則各自驗證一個結果。在記錄里區分網頁觀察和代碼修改。

讓 AI Agent 操作瀏覽器 · 接入現有瀏覽器

用相同條件復驗

在原來的窄視口重新加載相同網址,先看表單是否完整,點擊一次 Check estimate,再回讀結果。隨後用桌面視口復查橫向排列。修復前後使用相同輸入。

Cursor 在 520 px 以下允許換行,取消輸入框最小寬度。在相同實測 354 CSS px 視口,Tabbit 看到文件滾動寬度由 510 px 變為 354 px。點擊後顯示 Estimate ID: DEMO-D01。909 CSS px 下控件仍為同一行。

條件測量結果
修復前354 px → 510 px
修復後354 px → 354 px
桌面復查按鈕與輸入框保持同一行
Cursor CLI 修復前後由 Tabbit 拍攝的運費表單

打開修復後的練習頁 · 首次瀏覽器任務清單

找不到 Browser 工具時

檢查 Cursor 的瀏覽器自動化設置,明確指定內置 Browser。手動打開分頁與 Agent 調用工具是兩件事。若當前會話沒有對應工具,記錄缺項,並在記錄中寫明實際用來復驗的獨立工具。

一位用戶經設置找到了內置瀏覽器。另一位打開了 Browser 分頁,但稱 Agent 會話中沒有對應工具。可用動作記錄區分兩種情況。 Reddit 1 · Reddit 2 · Cursor Forum

常見問題

Cursor Agent 能點擊網頁按鈕嗎?

官方 Browser 支持在授權會話中導航、點擊、輸入和截圖。

怎樣讓 Cursor 訪問本地開發頁面?

提供當前環境可訪問的完整 URL,在選定的會話中核對標題和地址。

內置 Browser 會保留登入嗎?

官方文件說明瀏覽器狀態按工作區保留。請使用測試工作區和獲准使用的賬號。

怎樣反饋移動端佈局問題?

記錄視口、受影響的控件、操作、實際結果和預期結果。

打開分頁能證明 Agent 調用了 Browser 嗎?

查看 Agent 的具體工具記錄和它獲取的網頁狀態。

修完怎麼驗證?

重新加載頁面,重做同一操作,比較結果,並復查必須保留的視口行為。

下一步

讓 Tabbit 與你並肩工作。

跨分頁調研、自動化重複的瀏覽器工作,讓每一處上下文都觸手可及。