Udemy Playwright: Web Automation Testing From Zero to Hero: Difference between revisions
Jump to navigation
Jump to search
Udemy Playwright: Web Automation Testing From Zero to Hero (view source)
Revision as of 10:03, 20 May 2024
, 20 May→Section 3 - Playwright Hands-On Overview
Line 43: | Line 43: | ||
== Section 3 - Playwright Hands-On Overview == | == Section 3 - Playwright Hands-On Overview == | ||
* create new folder & <code>npm init playwright@latest</code> | * create new folder & <code>npm init playwright@latest</code> | ||
=== Ways to Run & Debug === | |||
* CLI Test Executions | * CLI Test Executions | ||
<nowiki> | <nowiki> | ||
npx playwright test | npx playwright test | ||
Line 53: | Line 53: | ||
* Test Execution with UI - ''OMG this debug UI is cool!'' | * Test Execution with UI - ''OMG this debug UI is cool!'' | ||
<nowiki>npx playwright test --ui</nowiki> | <nowiki>npx playwright test --ui</nowiki> | ||
* Test Execution with trace on | |||
<nowiki> | |||
npx playwright test --project=chromium --trace on | |||
npx playwright show-report</nowiki> | |||
: => you can now open the trace from the report (which looks similar to the ui tool above) | |||
: trace can be generated from Ci/CD pipeline too, and then you can view the results saved in a zip file with a trace viewer | |||
* Test Execution with debug <nowiki> | |||
npx playwright test --project=chromium --debug</nowiki> | |||
: this opens the PLaywright inspector showing the code, debugging controls, and console information | |||
: and the browser window | |||
* Test execution with VS Code Extension => Test Explorer | |||
: Navigate to the test you want to debug | |||
: set any breakpoint(s) | |||
: VS Code shows the code, debugging controls, and console information | |||
=== Tests Structure === |