【AI 測試 Skill 入門篇】01 | 環境搭建：Node.js + Playwright + Trae CN 全指南
整理版優先睇
從零搭建 Playwright + Trae CN 自動化測試環境，3步搞掂環境配置
呢篇文章係專為想轉型做 AI 測試工程師嘅人而寫。作者分享咗自己由零開始搭建自動化測試環境嘅經驗，仲解決咗初學者成日遇到嘅痛點，例如唔知裝咩、安裝報錯、同 AI 工具點樣結合。
整體結論係只要跟住 3 個步驟：安裝 Node.js、安裝 Playwright、安裝 Trae CN，就可以快速搞掂一個完整嘅自動化測試環境。文章詳細介紹咗每一步嘅具體操作，包括指令、下載連結同驗證方法。
此外，作者仲提供咗環境檢查清單同常見問題解決方案，方便讀者確認係咪成功安裝。呢篇文係系列嘅第一篇，之後會繼續實戰教學。
- 環境搭建只需 3 步：Node.js → Playwright → Trae CN。
- Node.js 建議安裝 LTS 版本（18.x 或 20.x），避免兼容問題。
- Playwright 安裝後要下載瀏覽器驅動，推薦用國內鏡像加快速度。
- Trae CN 係中文界面嘅 AI 輔助工具，可以直接喺編輯器入面生成測試代碼。
- 安裝完成後要對照環境檢查清單確認所有元件正常，先開始寫測試。
Node.js 官方下載頁
下載 LTS 版本（18.x 或 20.x）
Trae CN 官方下載頁
下載對應系統版本（Windows/macOS/Linux）
痛點：想開始自動化測試，但卡咗喺環境搭建
你可能會有呢啲困惑：聽過 Playwright 係新一代自動化測試框架，但 唔知由邊度開始；安裝過程中成日遇到 報錯；仲有唔知點樣同 AI 工具 結合。
- 唔知由邊度開始：聽過 Playwright 比 Selenium 更快更穩定，支持多瀏覽器，但唔知要裝啲咩、順序係點、版本要求。
- 安裝過程中有好多報錯：Node.js 版本太舊、下載瀏覽器驅動超時、權限不足，裝完又唔知點驗證。
- 唔知點樣同 AI 工具結合：聽過 Trae CN、Cursor、GitHub Copilot，但唔知點裝點用，點樣同 Playwright 一齊用。
解決方案：3步搞掂環境搭建
┌─────────────────────────────────────────────────────────┐
│ 環境搭建 3 步走 │
├─────────────────────────────────────────────────────────┤
│ │
│ 第一步：安裝 Node.js（環境基礎） │
│ ├── 下載 Node.js │
│ ├── 安裝 Node.js │
│ └── 驗證安裝成功 │
│ │
│ 第二步：安裝 Playwright（測試框架） │
│ ├── 創建項目目錄 │
│ ├── 初始化 npm 項目 │
│ ├── 安裝 Playwright │
│ └── 安裝瀏覽器驅動 │
│ │
│ 第三步：安裝 Trae CN（AI 輔助工具） │
│ ├── 下載 Trae CN │
│ ├── 安裝 Trae CN │
│ └── 配置 Trae CN │
│ │
└─────────────────────────────────────────────────────────┘每一步嘅詳細操作，可以喺下一部分見到。
實戰操作：一步步安裝
第一步：安裝 Node.js
Playwright 係基於 Node.js 嘅框架，所以一定要先裝 Node.js。建議用 LTS 版本（18.x 或 20.x），兼容性最好。
- 1 檢查有無裝過：打開命令列（Windows 用 PowerShell 或 CMD，Mac/Linux 用 Terminal），輸入 node -v 同 npm -v，有版本號就代表已裝。
- 2 如果未裝，去 https://nodejs.org/ 下載 LTS 版本（頁面左邊嘅按鈕）。
- 3 安裝：Windows 雙擊 .msi 一路下一步；Mac 雙擊 .pkg 跟住指示；Linux 用包管理器。
- 4 驗證：重新打開命令列，輸入 node -v 同 npm -v，見到版本號就成功。
第二步：安裝 Playwright
Playwright 係測試框架，需要用 npm 安裝。
- 1 創建項目目錄：mkdir playwright-tests && cd playwright-tests
- 2 初始化 npm 項目：npm init -y，會生成 package.json。
- 3 安裝 Playwright：npm install -D @playwright/test，-D 表示開發依賴。
- 4 下載瀏覽器驅動：npx playwright install（如果慢可以用 npx playwright install chromium 只裝 Chromium）。
- 5 驗證：npx playwright --version，顯示版本號就成功。
第三步：安裝 Trae CN
Trae CN 係 AI 輔助編程工具，支援中文界面，可以直接喺編輯器入面生成測試代碼。
- 1 去 https://trae.cn/ 下載對應系統版本（Windows .exe / macOS .dmg / Linux .AppImage）。
- 2 安裝：Windows 運行 .exe，Mac 打開 .dmg 並拖入應用程式，Linux 運行 .AppImage。
- 3 第一次打開要登錄帳號，可以配置 AI 模型（內置或自備 API Key）。
- 4 打開項目目錄：File → Open Folder，揀返 playwright-tests 目錄。
- 5 使用方式：直接提問（例如「幫我寫個 Playwright 測試」）、選中代碼後提問、用註釋驅動（喺代碼入面寫註釋，AI 會自動補全）。
環境檢查清單同常見問題
【Node.js】
├── ✅ node -v 顯示版本號（v18+ 或 v20+）
└── ✅ npm -v 顯示版本號
【Playwright】
├── ✅ package.json 中有 @playwright/test 依賴
├── ✅ npx playwright --version 顯示版本號
├── ✅ 瀏覽器驅動已安裝（Chromium、Firefox 或 WebKit）
└── ✅ npx playwright test 可以運行測試
【Trae CN】
├── ✅ 可以正常啓動 Trae CN
├── ✅ 可以打開項目目錄
└── ✅ AI 對話功能正常- 問題 1：Playwright 安裝瀏覽器超時 → 用國內鏡像或只裝 Chromium。
- 問題 2：Node.js 版本太舊（< 18）→ 重新下載安裝，或用 n/nvm 升級。
- 問題 3：權限不足 → Windows 以管理員身份運行命令列；Mac/Linux 修改目錄權限（唔推薦 sudo）。
- 問題 4：運行測試報錯 → 用 npx playwright test --reporter=list 睇詳細錯誤，或用 --ui 模式。
【AI 測試 Skill 入門篇】01 | 環境搭建：Node.js + Playwright + Trae CN 全指南
一、痛點：想開始自動化測試，但卡咗喺環境搭建
想轉型做 AI 測試工程師嘅你，係咪有呢啲困惑？
1. 唔知由邊度開始
你可能聽講過：
✅ Playwright 係新一代嘅自動化測試框架 ✅ 比起 Selenium 更穩定、更快 ✅ 支援多個瀏覽器（Chromium、Firefox、WebKit）
但係當你想自己動手試嚇，發現：
❌ 唔知要安裝啲乜 ❌ 唔知安裝順序係點 ❌ 唔知安裝版本有咩要求
2. 安裝過程中成日出錯
你可能遇過：
❌ Node.js 版本太舊，Playwright 唔支援 ❌ 安裝 Playwright 瀏覽器嗰陣網絡超時 ❌ 權限唔夠，裝唔到 ❌ 裝完之後唔知點驗證
3. 唔知點樣同 AI 工具結合
你可能聽講過 AI 輔助測試工具，例如：
✅ Trae CN ✅ Cursor ✅ GitHub Copilot
但係唔知：
❌ 呢啲工具點安裝？ ❌ 點同 Playwright 一齊用？ ❌ 裝完之後點開始？
二、解決方案：3 步搞掂環境搭建
今日畀大家一個 完整嘅環境搭建指南，由 0 到 1 整好 Playwright 自動化測試環境。
環境搭建流程
┌─────────────────────────────────────────────────────────┐
│ 環境搭建 3 步走 │
├─────────────────────────────────────────────────────────┤
│ │
│ 第一步：安裝 Node.js（環境基礎） │
│ ├── 下載 Node.js │
│ ├── 安裝 Node.js │
│ └── 驗證安裝成功 │
│ │
│ 第二步：安裝 Playwright（測試框架） │
│ ├── 創建項目目錄 │
│ ├── 初始化 npm 項目 │
│ ├── 安裝 Playwright │
│ └── 安裝瀏覽器驅動 │
│ │
│ 第三步：安裝 Trae CN（AI 輔助工具） │
│ ├── 下載 Trae CN │
│ ├── 安裝 Trae CN │
│ └── 配置 Trae CN │
│ │
└─────────────────────────────────────────────────────────┘
三、實際操作：逐步做
第一步：安裝 Node.js
點解需要 Node.js？
Playwright 係一個基於 Node.js 嘅框架，所以一定要先裝 Node.js。
安裝步驟
1. 檢查係咪已經裝咗 Node.js
開命令行（Windows 用 PowerShell 或者 CMD，Mac/Linux 用 Terminal），輸入：
node -v
npm -v
如果顯示版本號（例如 v18.19.0），即係已經裝咗如果顯示「命令唔存在」，即係需要安裝
2. 下載 Node.js
推薦版本：Node.js 18.x 或者 20.x LTS（長期支援版）
下載地址：https://nodejs.org/
┌─────────────────────────────────────────────────────────┐
│ Node.js 下載頁面 │
├─────────────────────────────────────────────────────────┤
│ │
│ 選擇 LTS 版本（長期支持）： │
│ ┌─────────────────────────────────────────────────┐ │
│ │ 20.12.0 LTS 21.7.3 Current │ │
│ │ 推薦給大多數用戶 最新功能 │ │
│ └─────────────────────────────────────────────────┘ │
│ │
│ ✅ 點擊左邊的 "20.12.0 LTS" 下載 │
│ │
└─────────────────────────────────────────────────────────┘
3. 安裝 Node.js
- Windows
：雙按下載嘅 .msi檔案，一直㩒「下一步」就得 - Mac
：雙按下載嘅 .pkg檔案，一直㩒「繼續」就得 - Linux
：用套件管理員安裝
4. 驗證安裝
重新開命令行，輸入：
node -v
# 輸出示例：v20.12.0
npm -v
# 輸出示例：10.5.0
如果顯示咗版本號，即係 Node.js 安裝成功！
第二步：安裝 Playwright
建立專案資料夾
首先，建立一個專門放 Playwright 測試專案嘅資料夾：
# 創建目錄
mkdir playwright-tests
# 進入目錄
cd playwright-tests
初始化 npm 專案
npm init -y
呢個會建立一個 package.json 檔案，內容類似：
{
"name": "playwright-tests",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC"
}
安裝 Playwright
# 安裝 Playwright
npm install -D @playwright/test
解釋：
-D表示安裝做開發依賴（devDependencies） @playwright/test係 Playwright 嘅測試執行器
安裝瀏覽器驅動
Playwright 需要下載瀏覽器驅動先至行到測試：
# 安裝所有瀏覽器驅動（Chromium、Firefox、WebKit）
npx playwright install
如果網絡慢，可以只裝 Chromium：
# 只安裝 Chromium（推薦，體積小，速度快）
npx playwright install chromium
驗證 Playwright 安裝
# 查看 Playwright 版本
npx playwright --version
# 輸出示例：Version 1.43.0
建立第一個測試檔案
喺專案目錄下建立 tests 目錄，然後建立 login.spec.ts 文件：
// tests/login.spec.ts
import { test, expect } from '@playwright/test';
test('頁面能夠正常加載', async ({ page }) => {
// 導航到 sogoodtool.com 登錄頁面
await page.goto('https://sogoodtool.com/#/login');
// 驗證頁面標題
await expect(page).toHaveTitle(/登錄/);
});
執行測試
# 運行所有測試
npx playwright test
# 或者運行特定文件
npx playwright test tests/login.spec.ts
如果測試執行成功，即係 Playwright 環境搭建完成！
第三步：安裝 Trae CN
咩係 Trae CN？
Trae CN 係一個 AI 輔助寫程式工具，類似 Cursor、GitHub Copilot，但係：
✅ 支援中文介面 ✅ 支援多種 AI 模型 ✅ 可以直接喺編輯器嗰度 call AI 生成 code ✅ 特別適合 AI 測試工程師
下載 Trae CN
下載地址：https://trae.cn/
┌─────────────────────────────────────────────────────────┐
│ Trae CN 下載頁面 │
├─────────────────────────────────────────────────────────┤
│ │
│ 支持的平台： │
│ ├── Windows（.exe 或 .zip） │
│ ├── macOS（.dmg） │
│ └── Linux（.AppImage 或 .deb） │
│ │
│ ✅ 根據你的操作系統選擇對應的版本下載 │
│ │
└─────────────────────────────────────────────────────────┘
安裝 Trae CN
- Windows
：執行下載嘅 .exe檔案，或者解壓.zip後運行 - Mac
：打開 .dmg檔案，將 Trae CN 拖到「應用程式」資料夾 - Linux
：運行 .AppImage或安裝.deb包
設定 Trae CN
第一次開 Trae CN 嗰陣，需要：
- 登入或者註冊帳號
- 設定 AI 模型
（可以揀內置嘅模型，或者設定自己嘅 API Key） - 開專案資料夾
（File → Open Folder，揀你嘅 playwright-tests目錄）
點用 Trae CN 輔助寫測試
喺 Trae CN 入面，你可以：
方式 1：直接問問題
喺 AI 對話視窗輸入：
幫我寫一個 Playwright 測試用例，測試 sogoodtool.com 的登錄功能
方式 2：揀中 code 之後問問題
揀中一段 code，然後輸入：
這段代碼有什麼問題？怎麼優化？
方式 3：用註解驅動
喺 code 入面寫註解，AI 會自動補完：
// 請幫我寫一個測試，驗證用戶登錄成功後跳轉到 dashboard
// 1. 打開登錄頁面
// 2. 輸入郵箱和密碼
// 3. 點擊登錄按鈕
// 4. 驗證跳轉到 dashboard
四、環境檢查清單
安裝完成之後，確認以下內容都準備好：
┌─────────────────────────────────────────────────────────┐
│ 環境檢查清單 │
├─────────────────────────────────────────────────────────┤
│ │
│ 【Node.js】 │
│ ├── ✅ node -v 顯示版本號（v18+ 或 v20+） │
│ └── ✅ npm -v 顯示版本號 │
│ │
│ 【Playwright】 │
│ ├── ✅ package.json 中有 @playwright/test 依賴 │
│ ├── ✅ npx playwright --version 顯示版本號 │
│ ├── ✅ 瀏覽器驅動已安裝（Chromium、Firefox 或 WebKit） │
│ └── ✅ npx playwright test 可以運行測試 │
│ │
│ 【Trae CN】 │
│ ├── ✅ 可以正常啓動 Trae CN │
│ ├── ✅ 可以打開項目目錄 │
│ └── ✅ AI 對話功能正常 │
│ │
└─────────────────────────────────────────────────────────┘
五、常見問題解決
問題 1：Playwright 安裝瀏覽器超時
解決方法：
# 方法 1：使用國內鏡像
PLAYWRIGHT_DOWNLOAD_HOST=https://npmmirror.com/mirrors/playwright npx playwright install
# 方法 2：只安裝 Chromium（體積小）
npx playwright install chromium
問題 2：Node.js 版本太舊
解決方法：
# 查看當前版本
node -v
# 如果版本 < 18，需要升級
# Windows：重新下載安裝
# Mac/Linux：使用 n 或 nvm 管理版本
問題 3：權限唔夠
解決方法：
# Windows：以管理員身份運行命令行
# Mac/Linux：使用 sudo（不推薦，最好修改目錄權限）
問題 4：執行測試嗰陣出錯
解決方法：
# 查看詳細錯誤信息
npx playwright test --reporter=list
# 或者在 UI 模式下運行
npx playwright test --ui
六、下一篇預告
恭喜你！而家你已經完成咗 環境搭建，可以開始寫 Playwright 自動化測試喇。
下一篇文章，我會帶你實戰：
【AI 測試 Skill 入門篇】02 | 第一個自動化測試：sogoodtool.com 實戰案例
喺嗰篇文章入面，你會學到：
點樣用 playwright-cliSkill 寫第一個測試點樣導航頁面、定位元素、輸入內容 點樣做斷言、驗證結果 點樣執行測試、睇報告
敬請期待！
七、想更高效咁學？加入知識星球
你想得到啲乜？
今日介紹畀大家嘅 環境搭建指南，只係 Playwright 自動化測試嘅第一步。
如果你想要：
✅ 得到 完整嘅 Playwright 學習路徑（由入門到高級） ✅ 學識 點樣用 AI 輔助寫測試（Trae CN + Playwright） ✅ 得到 8 個完整嘅 Playwright Skill（可以直接重用） ✅ 學識 sogoodtool.com 嘅實際測試案例 ✅ 有問題可以隨時問，得到解答
我推薦嘅 Skill
我整理咗 8 個完整嘅 Playwright 自動化測試 Skill，放咗喺我嘅知識星球入面：
playwright-cli | |
playwright-robust-locators | |
playwright-core-features-testing | |
playwright-positive-negative-testing | |
playwright-cli-url-docs-to-json-zh | |
playwright-cli-execute-stop-zh | |
json-testcase-to-excel-zh | |
ai-testing-skill |
點樣攞到？
呢啲 Skill 都已經放咗喺我嘅 「Bigtalk軟件測試進階」 知識星球入面。
掃下面嘅 QR Code，加入知識星球，就可以得到：
✅ 8 個完整嘅 Playwright 自動化測試 Skill ✅ sogoodtool.com 嘅實際測試案例 ✅ 我會喺星球入面持續更新更多測試乾貨 ✅ 可以向我提問，我會喺星球入面解答
微信掃碼，加入「Bigtalk軟件測試進階」
想轉型做 AI 測試工程師？想掌握 Playwright 自動化測試？
掃 QR Code，加入知識星球，開始你嘅進階之路！ 🚀
下一篇：《【AI 測試 Skill 入門篇】02 | 第一個自動化測試：sogoodtool.com 實戰案例》，敬請期待！
【AI 測試 Skill 入門篇】01 | 環境搭建：Node.js + Playwright + Trae CN 全指南
一、痛點：想開始自動化測試，但卡在了環境搭建
想轉型 AI 測試工程師的你，是不是有這些困惑？
1. 不知道從哪裏開始
你可能聽說過：
✅ Playwright 是新一代的自動化測試框架 ✅ 比 Selenium 更穩定、更快 ✅ 支持多瀏覽器（Chromium、Firefox、WebKit）
但當你想自己動手試試時，發現：
❌ 不知道需要安裝什麼 ❌ 不知道安裝順序是什麼 ❌ 不知道安裝版本有什麼要求
2. 安裝過程中各種報錯
你可能遇到過：
❌ Node.js 版本太舊，Playwright 不支持 ❌ 安裝 Playwright 瀏覽器時網絡超時 ❌ 權限不足，無法安裝 ❌ 安裝完了不知道怎麼驗證
3. 不知道如何與 AI 工具結合
你可能聽說過 AI 輔助測試工具，比如：
✅ Trae CN ✅ Cursor ✅ GitHub Copilot
但不知道：
❌ 這些工具怎麼安裝？ ❌ 怎麼和 Playwright 結合使用？ ❌ 安裝完了怎麼開始？
二、解決方案：3 步完成環境搭建
今天給大家一個 完整的環境搭建指南，從 0 到 1 搭建好 Playwright 自動化測試環境。
環境搭建流程
┌─────────────────────────────────────────────────────────┐
│ 環境搭建 3 步走 │
├─────────────────────────────────────────────────────────┤
│ │
│ 第一步：安裝 Node.js（環境基礎） │
│ ├── 下載 Node.js │
│ ├── 安裝 Node.js │
│ └── 驗證安裝成功 │
│ │
│ 第二步：安裝 Playwright（測試框架） │
│ ├── 創建項目目錄 │
│ ├── 初始化 npm 項目 │
│ ├── 安裝 Playwright │
│ └── 安裝瀏覽器驅動 │
│ │
│ 第三步：安裝 Trae CN（AI 輔助工具） │
│ ├── 下載 Trae CN │
│ ├── 安裝 Trae CN │
│ └── 配置 Trae CN │
│ │
└─────────────────────────────────────────────────────────┘
三、實際操作：一步步來
第一步：安裝 Node.js
為什麼需要 Node.js？
Playwright 是一個基於 Node.js 的框架，所以必須先安裝 Node.js。
安裝步驟
1. 檢查是否已安裝 Node.js
打開命令行（Windows 用 PowerShell 或 CMD，Mac/Linux 用 Terminal），輸入：
node -v
npm -v
如果顯示版本號（如 v18.19.0），說明已安裝如果顯示"命令不存在"，說明需要安裝
2. 下載 Node.js
推薦版本：Node.js 18.x 或 20.x LTS（長期支持版）
下載地址：https://nodejs.org/
┌─────────────────────────────────────────────────────────┐
│ Node.js 下載頁面 │
├─────────────────────────────────────────────────────────┤
│ │
│ 選擇 LTS 版本（長期支持）： │
│ ┌─────────────────────────────────────────────────┐ │
│ │ 20.12.0 LTS 21.7.3 Current │ │
│ │ 推薦給大多數用戶 最新功能 │ │
│ └─────────────────────────────────────────────────┘ │
│ │
│ ✅ 點擊左邊的 "20.12.0 LTS" 下載 │
│ │
└─────────────────────────────────────────────────────────┘
3. 安裝 Node.js
- Windows
：雙擊下載的 .msi文件，一路點擊"下一步"即可 - Mac
：雙擊下載的 .pkg文件，一路點擊"繼續"即可 - Linux
：使用包管理器安裝
4. 驗證安裝
重新打開命令行，輸入：
node -v
# 輸出示例：v20.12.0
npm -v
# 輸出示例：10.5.0
如果顯示了版本號，說明 Node.js 安裝成功！
第二步：安裝 Playwright
創建項目目錄
首先，創建一個專門存放 Playwright 測試項目的目錄：
# 創建目錄
mkdir playwright-tests
# 進入目錄
cd playwright-tests
初始化 npm 項目
npm init -y
這會創建一個 package.json 文件，內容類似：
{
"name": "playwright-tests",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC"
}
安裝 Playwright
# 安裝 Playwright
npm install -D @playwright/test
解釋：
-D表示安裝為開發依賴（devDependencies） @playwright/test是 Playwright 的測試運行器
安裝瀏覽器驅動
Playwright 需要下載瀏覽器驅動才能運行測試：
# 安裝所有瀏覽器驅動（Chromium、Firefox、WebKit）
npx playwright install
如果網絡慢，可以只安裝 Chromium：
# 只安裝 Chromium（推薦，體積小，速度快）
npx playwright install chromium
驗證 Playwright 安裝
# 查看 Playwright 版本
npx playwright --version
# 輸出示例：Version 1.43.0
創建第一個測試文件
在項目目錄下創建 tests 目錄，然後創建 login.spec.ts 文件：
// tests/login.spec.ts
import { test, expect } from '@playwright/test';
test('頁面能夠正常加載', async ({ page }) => {
// 導航到 sogoodtool.com 登錄頁面
await page.goto('https://sogoodtool.com/#/login');
// 驗證頁面標題
await expect(page).toHaveTitle(/登錄/);
});
運行測試
# 運行所有測試
npx playwright test
# 或者運行特定文件
npx playwright test tests/login.spec.ts
如果測試運行成功，說明 Playwright 環境搭建完成！
第三步：安裝 Trae CN
什麼是 Trae CN？
Trae CN 是一個 AI 輔助編程工具，類似 Cursor、GitHub Copilot，但：
✅ 支持中文界面 ✅ 支持多種 AI 模型 ✅ 可以直接在編輯器中調用 AI 生成代碼 ✅ 特別適合 AI 測試工程師
下載 Trae CN
下載地址：https://trae.cn/
┌─────────────────────────────────────────────────────────┐
│ Trae CN 下載頁面 │
├─────────────────────────────────────────────────────────┤
│ │
│ 支持的平台： │
│ ├── Windows（.exe 或 .zip） │
│ ├── macOS（.dmg） │
│ └── Linux（.AppImage 或 .deb） │
│ │
│ ✅ 根據你的操作系統選擇對應的版本下載 │
│ │
└─────────────────────────────────────────────────────────┘
安裝 Trae CN
- Windows
：運行下載的 .exe文件，或解壓.zip後運行 - Mac
：打開 .dmg文件，將 Trae CN 拖拽到"應用程序"文件夾 - Linux
：運行 .AppImage或安裝.deb包
配置 Trae CN
第一次打開 Trae CN 時，需要：
- 登錄或註冊賬號
- 配置 AI 模型
（可以選擇內置的模型，或配置自己的 API Key） - 打開項目目錄
（File → Open Folder，選擇你的 playwright-tests目錄）
如何使用 Trae CN 輔助寫測試
在 Trae CN 中，你可以：
方式 1：直接提問
在 AI 對話窗口中輸入：
幫我寫一個 Playwright 測試用例，測試 sogoodtool.com 的登錄功能
方式 2：選中代碼後提問
選中一段代碼，然後輸入：
這段代碼有什麼問題？怎麼優化？
方式 3：使用註釋驅動
在代碼中寫註釋，AI 會自動補全：
// 請幫我寫一個測試，驗證用戶登錄成功後跳轉到 dashboard
// 1. 打開登錄頁面
// 2. 輸入郵箱和密碼
// 3. 點擊登錄按鈕
// 4. 驗證跳轉到 dashboard
四、環境檢查清單
安裝完成後，確認以下內容都已就緒：
┌─────────────────────────────────────────────────────────┐
│ 環境檢查清單 │
├─────────────────────────────────────────────────────────┤
│ │
│ 【Node.js】 │
│ ├── ✅ node -v 顯示版本號（v18+ 或 v20+） │
│ └── ✅ npm -v 顯示版本號 │
│ │
│ 【Playwright】 │
│ ├── ✅ package.json 中有 @playwright/test 依賴 │
│ ├── ✅ npx playwright --version 顯示版本號 │
│ ├── ✅ 瀏覽器驅動已安裝（Chromium、Firefox 或 WebKit） │
│ └── ✅ npx playwright test 可以運行測試 │
│ │
│ 【Trae CN】 │
│ ├── ✅ 可以正常啓動 Trae CN │
│ ├── ✅ 可以打開項目目錄 │
│ └── ✅ AI 對話功能正常 │
│ │
└─────────────────────────────────────────────────────────┘
五、常見問題解決
問題 1：Playwright 安裝瀏覽器超時
解決方法：
# 方法 1：使用國內鏡像
PLAYWRIGHT_DOWNLOAD_HOST=https://npmmirror.com/mirrors/playwright npx playwright install
# 方法 2：只安裝 Chromium（體積小）
npx playwright install chromium
問題 2：Node.js 版本太舊
解決方法：
# 查看當前版本
node -v
# 如果版本 < 18，需要升級
# Windows：重新下載安裝
# Mac/Linux：使用 n 或 nvm 管理版本
問題 3：權限不足
解決方法：
# Windows：以管理員身份運行命令行
# Mac/Linux：使用 sudo（不推薦，最好修改目錄權限）
問題 4：運行測試時報錯
解決方法：
# 查看詳細錯誤信息
npx playwright test --reporter=list
# 或者在 UI 模式下運行
npx playwright test --ui
六、下一篇預告
恭喜你！現在你已經完成了 環境搭建，可以開始寫 Playwright 自動化測試了。
下一篇文章，我將帶你實戰：
【AI 測試 Skill 入門篇】02 | 第一個自動化測試：sogoodtool.com 實戰案例
在那篇文章中，你將學到：
如何使用 playwright-cliSkill 編寫第一個測試如何導航頁面、定位元素、輸入內容 如何做斷言、驗證結果 如何運行測試、查看報告
敬請期待！
七、想更高效地學習？加入知識星球
你想獲得什麼？
今天給大家介紹的 環境搭建指南，只是 Playwright 自動化測試的第一步。
如果你想：
✅ 獲得 完整的 Playwright 學習路徑（從入門到高級） ✅ 學習 如何用 AI 輔助寫測試（Trae CN + Playwright） ✅ 獲得 8 個完整的 Playwright Skill（可以直接複用） ✅ 學習 sogoodtool.com 的實際測試案例 ✅ 有問題可以隨時提問，獲得解答
我推薦的 Skill
我整理了 8 個完整的 Playwright 自動化測試 Skill，放在我的知識星球裏：
playwright-cli | |
playwright-robust-locators | |
playwright-core-features-testing | |
playwright-positive-negative-testing | |
playwright-cli-url-docs-to-json-zh | |
playwright-cli-execute-stop-zh | |
json-testcase-to-excel-zh | |
ai-testing-skill |
如何獲取？
這些 Skill 都已經放在我的 「Bigtalk軟件測試進階」 知識星球裏了。
掃描下方二維碼，加入知識星球，即可獲得：
✅ 8 個完整的 Playwright 自動化測試 Skill ✅ sogoodtool.com 的實際測試案例 ✅ 我會在星球裏持續更新更多測試乾貨 ✅ 可以向我提問，我會在星球裏解答
微信掃碼，加入「Bigtalk軟件測試進階」
想轉型 AI 測試工程師？想掌握 Playwright 自動化測試？
掃描二維碼，加入知識星球，開始你的進階之路！ 🚀
下一篇：《【AI 測試 Skill 入門篇】02 | 第一個自動化測試：sogoodtool.com 實戰案例》，敬請期待！