戰(zhàn)指南:用 Codegen 錄制生成可維護(hù)的自動(dòng)化測(cè)試)
Playwright Test Generator 實(shí)戰(zhàn)指南用 Codegen 錄制生成可維護(hù)的自動(dòng)化測(cè)試【免費(fèi)下載鏈接】playwrightPlaywright is a framework for Web Testing and Automation. It allows testing Chromium, Firefox and WebKit with a single API.項(xiàng)目地址: https://gitcode.com/GitHub_Trending/pl/playwrightPlaywright當(dāng)前倉庫位于GitHub_Trending/pl/playwright內(nèi)置的**測(cè)試生成器Test Generator亦稱 Codegen**讓你只需在真實(shí)瀏覽器中執(zhí)行操作就能自動(dòng)生成對(duì)應(yīng)的自動(dòng)化測(cè)試代碼。本文系統(tǒng)講解如何在 VS Code 擴(kuò)展與 Playwright Inspector 中使用錄制生成能力深入剖析 viewport、移動(dòng)設(shè)備、深淺色模式、地理定位/語言/時(shí)區(qū)仿真以及登錄態(tài)保存與復(fù)用等進(jìn)階技巧并結(jié)合倉庫源碼說明這些命令行選項(xiàng)背后的解析與落地機(jī)制幫助你快速搭建高質(zhì)量、可讀性強(qiáng)且能持續(xù)維護(hù)的測(cè)試用例。測(cè)試生成器的工作原理與定位器選擇策略Playwright 測(cè)試生成器的核心價(jià)值在于你在瀏覽器窗口里人肉操作頁面它同步把每次點(diǎn)擊、輸入、導(dǎo)航翻譯成測(cè)試代碼因此即使是第一次接觸 Web 測(cè)試的開發(fā)者也能在幾分鐘內(nèi)產(chǎn)出一份可運(yùn)行、可斷言的測(cè)試文件是快速上手與給存量項(xiàng)目補(bǔ)齊測(cè)試覆蓋的高效起點(diǎn)。生成器并非簡單地把操作映射成脆弱的 CSS 選擇器而是會(huì)審視頁面結(jié)構(gòu)并挑選最優(yōu)定位器。根據(jù) docs/src/codegen.md 的說明其優(yōu)先級(jí)依次為role角色、text文本與 test id定位器如果頁面上存在多個(gè)元素都能匹配當(dāng)前定位器生成器還會(huì)自動(dòng)為定位器補(bǔ)上約束條件如結(jié)合可見性、層級(jí)或索引把它改進(jìn)成能夠唯一定位目標(biāo)元素、對(duì)頁面結(jié)構(gòu)變化更具彈性的形式。定位器的完整能力清單getByRole、getByText、getByTestId、locator.filter、locator.and等參見 定位器Locators指南。從源碼結(jié)構(gòu)看這套錄制 → 翻譯能力由三層構(gòu)成CLI 入口program.ts 注冊(cè)了codegen [url]命令并聲明了--target、--output、--test-id-attribute等專屬選項(xiàng)瀏覽器會(huì)話編排browserActions.ts 中的codegen()負(fù)責(zé)按參數(shù)啟動(dòng)瀏覽器、開啟錄制模式并把目標(biāo)頁面加載進(jìn)來多語言代碼生成器packages/isomorphic/codegen 目錄下實(shí)現(xiàn)了各目標(biāo)語言的翻譯器例如 javascript.ts含playwright-test測(cè)試框架與純javascript兩種風(fēng)格、python.ts、java.ts 與 csharp.tslanguages.ts 負(fù)責(zé)注冊(cè)并選擇生成器。在 VS Code 中直接錄制測(cè)試對(duì)于 JavaScript/TypeScript 用戶最順手的路徑是使用官方 VS Code 擴(kuò)展安裝Playwright Test for VSCode擴(kuò)展后即可從編輯器側(cè)邊欄一鍵錄制入門步驟詳見 VS Code 入門指南擴(kuò)展本身的實(shí)現(xiàn)代碼位于倉庫的 packages/extension 目錄入口為 manifest.json。此外該擴(kuò)展還支持直接從測(cè)試文件運(yùn)行用例、以 UI 模式調(diào)試、查看 Trace 等。錄制一條新測(cè)試Record new在Testing測(cè)試側(cè)邊欄點(diǎn)擊Record new錄制新測(cè)試按鈕。擴(kuò)展會(huì)自動(dòng)創(chuàng)建test-1.spec.ts文件同時(shí)彈出一個(gè)瀏覽器窗口。在瀏覽器中訪問你要測(cè)試的網(wǎng)址然后開始點(diǎn)擊、填寫、滾動(dòng)你的每一步用戶操作都會(huì)被實(shí)時(shí)生成到 VS Code 的測(cè)試文件中。錄制過程中還能隨時(shí)補(bǔ)上斷言Assertion點(diǎn)擊工具欄中的斷言圖標(biāo)再在頁面上點(diǎn)選目標(biāo)元素生成器會(huì)為你產(chǎn)出一句斷言可選類型有三種assert visibility可見性斷言斷言元素可見assert text文本斷言斷言元素包含指定文本assert value取值斷言斷言元素具有指定值如表單輸入值。錄制結(jié)束后點(diǎn)擊cancel按鈕或直接關(guān)閉瀏覽器窗口即可停止。隨后你可以在test-1.spec.ts中審閱生成的代碼并按需手動(dòng)微調(diào)。從光標(biāo)處繼續(xù)錄制Record at cursor如果測(cè)試文件已有部分用例希望接續(xù)一段操作先把光標(biāo)移動(dòng)到期望插入新步驟的位置再從 Testing 側(cè)邊欄點(diǎn)擊Record at cursor從光標(biāo)處錄制按鈕之后瀏覽器中的操作就會(huì)追加到光標(biāo)所在位置。若瀏覽器窗口尚未打開可先在啟用Show browser的情況下運(yùn)行一次該測(cè)試再點(diǎn)擊Record at cursor。交互式挑選定位器Pick locator除了錄制操作生成器還承擔(dān)定位器速查器的職能點(diǎn)擊 Testing 側(cè)邊欄中的Pick locator拾取定位器按鈕在瀏覽器窗口內(nèi)懸停元素即可看到該元素下方被高亮標(biāo)注的定位器點(diǎn)擊目標(biāo)元素定位器會(huì)出現(xiàn)在 VS Code 的Pick locator輸入框中按Enter把定位器復(fù)制到剪貼板隨處粘貼使用按escape取消。這種方式非常適合在既有測(cè)試中補(bǔ)充對(duì)某個(gè)元素的引用或者驗(yàn)證生成器認(rèn)為的元素定位是否正確。使用 Playwright Inspector 生成測(cè)試命令行方式除 VS Code 外**所有語言JavaScript/TypeScript、Python、Java、C#**都可使用codegenCLI 命令配合Playwright Inspector檢查器窗口工作運(yùn)行命令后會(huì)同時(shí)打開兩個(gè)窗口——一個(gè)是供你交互的目標(biāo)網(wǎng)站瀏覽器另一個(gè)是展示生成代碼、提供錄制控制的 Inspector 窗口。錄制完成后可將代碼復(fù)制到自己的編輯器或測(cè)試文件中。運(yùn)行 Codegen 命令codegen命令的基本形式是codegen后跟目標(biāo)網(wǎng)站 URL。URL 是可選的不帶 URL 運(yùn)行后也可以直接在瀏覽器地址欄里輸入任意網(wǎng)址開始錄制。# JavaScript / TypeScript npx playwright codegen demo.playwright.dev/todomvc # Python playwright codegen demo.playwright.dev/todomvc # Java mvn exec:java -e -D exec.mainClasscom.microsoft.playwright.CLI -D exec.argscodegen demo.playwright.dev/todomvc # C#使用 Playwright 提供的 pwsh 引導(dǎo)腳本 pwsh bin/Debug/netX/playwright.ps1 codegen demo.playwright.dev/todomvc示例中的demo.playwright.dev/todomvc是官方的 TodoMVC 演示應(yīng)用尤其適合體驗(yàn)勾選待辦、輸入新任務(wù)、刪除條目等典型操作被翻譯成代碼的過程。錄制一條測(cè)試用例運(yùn)行codegen后在瀏覽器窗口執(zhí)行操作Inspector 會(huì)同步展示生成的交互代碼??梢凿浿频膬?nèi)容包括操作Actions點(diǎn)擊、輸入填充等動(dòng)作只要與頁面交互即被記錄斷言Assertions點(diǎn)擊工具欄的斷言圖標(biāo)后點(diǎn)選頁面元素可生成上文提到的一類斷言。各語言JavaScript、Java、Python、C#的 Inspector 界面風(fēng)格一致均可完成下述流程操作完成后點(diǎn)擊record按鈕停止錄制再用copy按鈕把整段代碼復(fù)制到你的編輯器若想清空重錄點(diǎn)擊clear按鈕。全部完成后關(guān)閉 Inspector 窗口或在終端中停止對(duì)應(yīng)命令如按CtrlC即可退出錄制會(huì)話。錄制模式下拾取定位器Inspector 同樣提供定位器拾取能力適合在錄制間隙快速取一個(gè)穩(wěn)健定位器用于手寫代碼先點(diǎn)擊Record按鈕停止錄制此時(shí)Pick Locator拾取定位器按鈕會(huì)變?yōu)榭捎命c(diǎn)擊Pick Locator在瀏覽器中懸停元素查看高亮及其定位器點(diǎn)擊目標(biāo)元素對(duì)應(yīng)定位器代碼會(huì)出現(xiàn)在 Pick Locator 旁的輸入框中可在輸入框內(nèi)直接編輯精調(diào)該定位器或點(diǎn)擊copy復(fù)制后粘貼到代碼里。codegen 命令支持的完整選項(xiàng)從源碼 program.ts 可以看到codegen [url]除通用選項(xiàng)外還支持三個(gè)專屬參數(shù)選項(xiàng)作用-o, --output file name把生成的腳本直接保存到指定文件而非僅展示在 Inspector 中--target language指定生成的語言取值包括javascript、playwright-test、python、python-async、python-pytest、csharp、csharp-mstest、csharp-nunit、csharp-xunit、java、java-junit--test-id-attribute attributeName指定用于生成># 常用示例指定瀏覽器、無頭與否之外的會(huì)話參數(shù) npx playwright codegen --targetpython --test-id-attributedata-test \ -b chromium --ignore-https-errors demo.playwright.dev/todomvc用仿真參數(shù)錄制特定環(huán)境下的測(cè)試實(shí)際測(cè)試往往需要覆蓋不同設(shè)備與運(yùn)行環(huán)境Codegen 支持在錄制階段就套用仿真條件這樣生成的代碼會(huì)在測(cè)試中自動(dòng)復(fù)現(xiàn)同樣的上下文選項(xiàng)保證測(cè)試在一致條件下穩(wěn)定運(yùn)行自動(dòng)化測(cè)試對(duì)響應(yīng)式窗口尺寸尤其敏感必須固定視口才能避免布局抖動(dòng)。源碼中這些 CLI 選項(xiàng)統(tǒng)一在launchContext()browserActions.ts內(nèi)被解析并合并進(jìn)BrowserContextOptions最終隨生成的代碼一并落盤。仿真視口尺寸--viewport-sizePlaywright 打開瀏覽器時(shí)會(huì)把視口固定為指定寬高測(cè)試需在與開發(fā)一致的環(huán)境下執(zhí)行。--viewport-size接收形如800,600的寬高字符串源碼按逗號(hào)拆分并轉(zhuǎn)換為數(shù)值非法格式會(huì)拋出Invalid viewport size format錯(cuò)誤見 browserActions.ts。# JavaScript / TypeScript npx playwright codegen --viewport-size800,600 playwright.dev # Python playwright codegen --viewport-size800,600 playwright.dev # Java mvn exec:java -e -D exec.mainClasscom.microsoft.playwright.CLI -D exec.argscodegen --viewport-size800,600 playwright.dev # C# pwsh bin/Debug/netX/playwright.ps1 codegen --viewport-size800,600 playwright.dev仿真移動(dòng)設(shè)備--device--device用于按真實(shí)設(shè)備檔案錄制除了視口尺寸外還會(huì)同時(shí)設(shè)置 user agent、觸屏能力、設(shè)備縮放比等一系列移動(dòng)端特征。其實(shí)現(xiàn)方式是源碼先從playwright.devices中按名稱復(fù)制設(shè)備描述符作為上下文選項(xiàng)的基座browserActions.ts設(shè)備名也決定了默認(rèn)啟動(dòng)的瀏覽器內(nèi)核lookupBrowserType若設(shè)備名不存在會(huì)在 validateOptions 階段報(bào)錯(cuò)并列出現(xiàn)有設(shè)備清單設(shè)備描述符全集位于 packages/isomorphic/deviceDescriptors.ts。# JavaScript / TypeScript仿真 iPhone 13 npx playwright codegen --deviceiPhone 13 playwright.dev # Python playwright codegen --deviceiPhone 13 playwright.dev # Java mvn exec:java -e -D exec.mainClasscom.microsoft.playwright.CLI -D exec.argscodegen --deviceiPhone 13 playwright.dev # C# pwsh bin/Debug/netX/playwright.ps1 codegen --deviceiPhone 13 playwright.dev仿真深淺色模式--color-scheme--color-scheme可在錄制時(shí)就以指定配色方案呈現(xiàn)頁面從而生成對(duì)應(yīng)colorScheme: dark的測(cè)試上下文。取值僅允許light或dark其余值會(huì)在源碼校驗(yàn)階段直接報(bào)錯(cuò)browserActions.ts隨后被寫入contextOptions.colorScheme同文件 L151-L154。# JavaScript / TypeScript以深色模式錄制 npx playwright codegen --color-schemedark playwright.dev # Python playwright codegen --color-schemedark playwright.dev # Java mvn exec:java -e -D exec.mainClasscom.microsoft.playwright.CLI -D exec.argscodegen --color-schemedark playwright.dev # C# pwsh bin/Debug/netX/playwright.ps1 codegen --color-schemedark playwright.dev仿真地理位置、語言與時(shí)區(qū)對(duì)于依賴定位或本地化內(nèi)容的站點(diǎn)可用--timezone、--geolocation與--lang組合仿真。下面以必應(yīng)地圖為例錄制羅馬 意大利語場景頁面打開后先接受 Cookies點(diǎn)擊頁面右上角的locate me按鈕即可驗(yàn)證地理定位是否生效。# JavaScript / TypeScript npx playwright codegen --timezoneEurope/Rome --geolocation41.890221,12.492348 --langit-IT bing.com/maps # Python playwright codegen --timezoneEurope/Rome --geolocation41.890221,12.492348 --langit-IT bing.com/maps # Java mvn exec:java -e -D exec.mainClasscom.microsoft.playwright.CLI -D exec.argscodegen --timezoneEurope/Rome --geolocation41.890221,12.492348 --langit-IT bing.com/maps # C# pwsh bin/Debug/netX/playwright.ps1 codegen --timezoneEurope/Rome --geolocation41.890221,12.492348 --langit-IT bing.com/maps實(shí)現(xiàn)細(xì)節(jié)browserActions.ts--geolocation按緯度,經(jīng)度解析并自動(dòng)追加geolocation權(quán)限格式非法會(huì)提示Invalid geolocation format--lang被映射為contextOptions.locale--timezone被映射為contextOptions.timezoneId。附加的會(huì)話級(jí)仿真選項(xiàng)同一個(gè)codegen/open命令還支持以下會(huì)話控制選項(xiàng)全部在 program.ts 中聲明并在launchContext中生效-b/--browser選擇cr/chromium/ff/firefox/wk/webkit之一默認(rèn) chromium、--channel指定 Chrome/Edge 等發(fā)行渠道、--user-agent自定義 UA 串、--lang、--proxy-server/--proxy-bypass、--ignore-https-errors、--timeoutPlaywright 動(dòng)作超時(shí)毫秒數(shù)默認(rèn)無超時(shí)、--block-service-workers、--save-har/--save-har-glob會(huì)話結(jié)束導(dǎo)出 HAR 網(wǎng)絡(luò)檔案。注意源碼在非 headless 的 Linux/GTK 環(huán)境運(yùn)行 WebKit 時(shí)會(huì)關(guān)閉hasTouch/isMobile以規(guī)避滾動(dòng)問題browserActions.ts。保留與復(fù)用登錄態(tài)認(rèn)證相關(guān)錄制技巧許多真實(shí)項(xiàng)目需要登錄后才能測(cè)試核心功能。Codegen 支持把認(rèn)證單獨(dú)錄一次并沉淀為可復(fù)用的存儲(chǔ)狀態(tài)之后所有用例都能以已登錄狀態(tài)開始——這避免了在每個(gè)測(cè)試?yán)镏貜?fù)處理登錄表單也顯著提升錄制效率。先錄制認(rèn)證并導(dǎo)出存儲(chǔ)狀態(tài)--save-storage以 GitHub 為例運(yùn)行帶--save-storage的命令開始錄制完成登錄后關(guān)閉瀏覽器會(huì)話結(jié)束時(shí)會(huì)將cookies、localStorage 與 IndexedDB數(shù)據(jù)寫入指定的auth.json# JavaScript / TypeScript npx playwright codegen github.com/microsoft/playwright --save-storageauth.json # Python playwright codegen github.com/microsoft/playwright --save-storageauth.json # Java mvn exec:java -e -D exec.mainClasscom.microsoft.playwright.CLI -D exec.argscodegen github.com/microsoft/playwright --save-storageauth.json # C# pwsh bin/Debug/netX/playwright.ps1 codegen github.com/microsoft/playwright --save-storageauth.json保存動(dòng)作由源碼中的closeBrowser()完成——它會(huì)調(diào)用context.storageState({ path })把狀態(tài)序列化到目標(biāo)文件browserActions.ts。安全提醒a(bǔ)uth.json內(nèi)含敏感憑據(jù)只能保存在本地使用。請(qǐng)把它加入.gitignore或在完成測(cè)試生成后將其刪除?;謴?fù)登錄態(tài)繼續(xù)錄制--load-storage下次錄制時(shí)加上--load-storageauth.json存儲(chǔ)的 cookies、localStorage 與 IndexedDB 會(huì)被完整恢復(fù)多數(shù) Web 應(yīng)用會(huì)直接進(jìn)入已登錄狀態(tài)無需再次登錄即可繼續(xù)錄制# JavaScript / TypeScript npx playwright codegen --load-storageauth.json github.com/microsoft/playwright # Python playwright codegen --load-storageauth.json github.com/microsoft/playwright # Java mvn exec:java -e -D exec.mainClasscom.microsoft.playwright.CLI -D exec.argscodegen --load-storageauth.json github.com/microsoft/playwright # C# pwsh bin/Debug/netX/playwright.ps1 codegen --load-storageauth.json github.com/microsoft/playwright源碼側(cè)該選項(xiàng)被映射為contextOptions.storageStatebrowserActions.tssave-storage/load-storage兩個(gè)文件路徑參數(shù)可組成錄制認(rèn)證 → 復(fù)用認(rèn)證的完整閉環(huán)這與測(cè)試框架中setup項(xiàng)目 storageState全局登錄的實(shí)踐是一脈相承的。復(fù)用既有的瀏覽器用戶目錄--user-data-dir如果你希望直接復(fù)用某個(gè)既有瀏覽器配置文件其中可能已包含登錄狀態(tài)與個(gè)性化設(shè)置可用--user-data-dir為會(huì)話指定固定的用戶數(shù)據(jù)目錄。從源碼看該選項(xiàng)會(huì)走browserType.launchPersistentContext(userDataDir, ...)的持久化上下文路徑browserActions.ts而不是默認(rèn)的新建上下文。# JavaScript / TypeScript npx playwright codegen --user-data-dir/path/to/your/browser/data/ github.com/microsoft/playwright # Python playwright codegen --user-data-dir/path/to/your/browser/data/ github.com/microsoft/playwright # Java mvn exec:java -e -D exec.mainClasscom.microsoft.playwright.CLI -D exec.argscodegen --user-data-dir/path/to/your/browser/data/ github.com/microsoft/playwright # C# pwsh bin/Debug/netX/playwright.ps1 codegen --user-data-dir/path/to/your/browser/data/ github.com/microsoft/playwright版本警告自 Chrome 136 起瀏覽器的默認(rèn)用戶數(shù)據(jù)目錄已不允許通過自動(dòng)化工具如 Playwright訪問因此必須為測(cè)試單獨(dú)創(chuàng)建一個(gè)獨(dú)立目錄供其使用不能直接指向默認(rèn) Profile。使用 HTTP 基本認(rèn)證憑據(jù)--http-credentials對(duì)受 HTTP Basic Auth 保護(hù)的站點(diǎn)--http-credentials以用戶名:密碼格式提供憑據(jù)。與把賬號(hào)密碼內(nèi)嵌到 URL如https://user:passhost不同這種方式下憑據(jù)會(huì)被發(fā)送給錄制會(huì)話中任何要求認(rèn)證的來源且會(huì)寫進(jìn)生成的測(cè)試代碼對(duì)應(yīng)生成代碼中的httpCredentials上下文選項(xiàng)。源碼會(huì)在解析時(shí)校驗(yàn)必須包含冒號(hào)分隔符否則報(bào)格式錯(cuò)誤browserActions.ts。# JavaScript / TypeScript npx playwright codegen --http-credentialsusername:password example.com # Python playwright codegen --http-credentialsusername:password example.com # Java mvn exec:java -e -D exec.mainClasscom.microsoft.playwright.CLI -D exec.argscodegen --http-credentialsusername:password example.com # C# pwsh bin/Debug/netX/playwright.ps1 codegen --http-credentialsusername:password example.com在自定義瀏覽器上下文配置中觸發(fā)錄制page.pausecodegen的標(biāo)準(zhǔn)啟動(dòng)流程由 CLI 自動(dòng)完成但有時(shí)你需要在非標(biāo)準(zhǔn)配置下錄制例如預(yù)先掛好BrowserContext.route攔截請(qǐng)求、注入額外的上下文參數(shù)、準(zhǔn)備特殊的多頁面/多 Frame 場景后再開始錄制。此時(shí)可以在自己的腳本里顯式構(gòu)建瀏覽器與上下文然后調(diào)用page.pause()——Playwright 會(huì)據(jù)此單獨(dú)彈出一個(gè)帶 Codegen 控制界面的窗口讓你手動(dòng)開始錄制。JS/TSplaywright/test中的chromium與 Python 同步寫法如下Java 與 C# 的等價(jià)實(shí)現(xiàn)也一并給出const { chromium } require(playwright/test); (async () { // 必須以有頭headed模式運(yùn)行。 const browser await chromium.launch({ headless: false }); // 按需自由配置上下文。 const context await browser.newContext({ /* pass any options */ }); await context.route(**/*, route route.continue()); // 暫停頁面隨后手動(dòng)開始錄制。 const page await context.newPage(); await page.pause(); })();from playwright.sync_api import sync_playwright with sync_playwright() as p: # 必須以有頭headed模式運(yùn)行。 browser p.chromium.launch(headlessFalse) # 按需自由配置上下文。 context browser.new_context() # 傳入任意需要的選項(xiàng) context.route(**/*, lambda route: route.continue_()) # 暫停頁面隨后手動(dòng)開始錄制。 page context.new_page() page.pause()Python 異步寫法使用async_playwright流程一致只需把各調(diào)用改為awaitawait p.chromium.launch(headlessFalse)、await context.route(...)、await page.pause()等。對(duì)應(yīng)的 Java 實(shí)現(xiàn)基于page.pause()Java 中 route 放行方法為route.resume()C# 基于await page.PauseAsync()此處不再展開粘貼全部代碼模式相同。import com.microsoft.playwright.*; public class Example { public static void main(String[] args) { try (Playwright playwright Playwright.create()) { BrowserType chromium playwright.chromium(); // 必須以有頭headed模式運(yùn)行。 Browser browser chromium.launch(new BrowserType.LaunchOptions().setHeadless(false)); // 按需自由配置上下文。 BrowserContext context browser.newContext(); // 傳入任意需要的選項(xiàng) context.route(**/*, route - route.resume()); // 暫停頁面隨后手動(dòng)開始錄制。 Page page context.newPage(); page.pause(); } } }using Microsoft.Playwright; using var playwright await Playwright.CreateAsync(); var chromium playwright.Chromium; // 必須以有頭headed模式運(yùn)行。 var browser await chromium.LaunchAsync(new() { Headless false }); // 按需自由配置上下文。 var context await browser.NewContextAsync(); // 傳入任意需要的選項(xiàng) await context.RouteAsync(**/*, route route.ContinueAsync()); // 暫停頁面隨后手動(dòng)開始錄制。 var page await context.NewPageAsync(); await page.PauseAsync();四個(gè)語言版本的實(shí)現(xiàn)邏輯完全對(duì)應(yīng)均以非 headless 啟動(dòng)瀏覽器、在創(chuàng)建BrowserContext時(shí)注入自定義路由或其他選項(xiàng)最后通過Page.pause()進(jìn)入錄制界面。這一模式讓先攔截接口再錄制、帶自定義 Cookie/權(quán)限錄制等復(fù)雜前置條件成為可能。生成代碼的后續(xù)打磨與維護(hù)建議錄制只是起點(diǎn)。生成器產(chǎn)出的代碼通常會(huì)盡量使用語義化定位器但復(fù)雜業(yè)務(wù)場景下仍建議按以下要點(diǎn)人工收尾替換脆弱定位器若生成代碼退化為層級(jí)過深的locator(...)建議替換為 role/text/test-id 語義定位器locators.md 提供了完整指南并對(duì)動(dòng)態(tài)文本、循環(huán)列表使用filter與文本參數(shù)增強(qiáng)唯一性。補(bǔ)充更多斷言除錄制工具欄的三類斷言外可將expect(...).toBeVisible()、toHaveValue()、toHaveText()、toHaveURL()等斷言擴(kuò)展進(jìn)關(guān)鍵節(jié)點(diǎn)完整清單見 test-assertions-js.md。收斂狀態(tài)依賴對(duì)登錄態(tài)用例優(yōu)先采用--save-storage/--load-storage或全局storageState避免在每個(gè)用例里重復(fù)登錄認(rèn)證數(shù)據(jù)必須本地化保管。接入項(xiàng)目測(cè)試體系生成的文件可直接納入現(xiàn)有測(cè)試項(xiàng)目并復(fù)用其 fixture、并行分片與重試策略如需在錄制時(shí)直接落地文件可用--output指定輸出路徑。圍繞測(cè)試生成器倉庫還提供了一系列可繼續(xù)深挖的資源Inspector 與錄制相關(guān)的瀏覽器內(nèi)實(shí)現(xiàn)位于 packages/recorder/srcVS Code 擴(kuò)展源碼見 packages/extension針對(duì)生成器行為含 CLI 各選項(xiàng)、多語言輸出、設(shè)備仿真等的自動(dòng)化驗(yàn)證測(cè)試集中在 tests/library/inspector 目錄可作為功能邊界與預(yù)期行為的參考。結(jié)合本文的錄制流程與仿真/認(rèn)證技巧你完全可以把打開瀏覽器點(diǎn)一點(diǎn)變成一套可持續(xù)演進(jìn)的高質(zhì)量測(cè)試資產(chǎn)?!久赓M(fèi)下載鏈接】playwrightPlaywright is a framework for Web Testing and Automation. It allows testing Chromium, Firefox and WebKit with a single API.項(xiàng)目地址: https://gitcode.com/GitHub_Trending/pl/playwright創(chuàng)作聲明:本文部分內(nèi)容由AI輔助生成(AIGC),僅供參考