Some links on this page are affiliate links: if you buy through them we may earn a commission, at no extra cost to you.
If a Playwright test appears stuck in VS Code, first determine whether it is paused by design or whether the debug session failed to end. Look at the highlighted line and call stack, check for a breakpoint or page.pause(), then choose Continue to resume or Stop to end the session. If a launched Node.js debuggee ignores the first Stop command, press Stop again to force termination. Do not assume the same action is safe for an attach session: stopping an attach configuration disconnects VS Code while the target process keeps running.
Identify what “stuck” means
“Stuck” can describe several different states. The remedy depends on which one you see:
- Execution is paused at a line: a breakpoint,
debuggerstatement, or Playwright’spage.pause()is waiting for input. - The browser is open but no step advances: the test may be paused in Playwright Inspector or waiting for an actionability condition while the debugger is active.
- The test has finished but VS Code still shows an active session: the debuggee or a pre-launch task has not exited.
- Stop returns to VS Code but a process remains: you may be attached to an existing process rather than launching one.
- The same test repeatedly starts, pauses, or targets the wrong file: inspect the debug configuration and extension workflow.
The following sequence isolates these cases without deleting project files or killing unrelated processes.
Do these 3 things before closing this tab:
1Repair Windows errors before they cause bigger problems2Fix the driver behind crashes, sound loss and screen glitches3Clear out junk files and repair common Windows errors1. Inspect the current execution point
- Open VS Code’s Run and Debug view.
- Read the highlighted source line and the top frame in Call Stack.
- Check the editor gutter for a red breakpoint on that line or in a function above it.
- Look at the Debug Console for a visible exception, prompt, or waiting message.
When you use the Playwright extension’s Debug Test action, reaching a test breakpoint is intentional. A browser that remains open at that point is not, by itself, evidence of a hang. Select Continue (the play icon) to run to the next breakpoint or the end of the test, or use Step Over and Step Into to move through the code.
#1 Best Overall
2. Remove an unintended pause
Check for page.pause()
Search the test project for page.pause(). Playwright deliberately suspends execution at that call during a debug run and opens the Inspector. In the Inspector, click Resume to continue. If the pause was only for a one-time investigation, remove the call or guard it so normal runs cannot reach it.
test('checkout', async ({ page }) => {
await page.goto('https://example.test/checkout');
// Remove this after interactive inspection:
// await page.pause();
await page.getByRole('button', { name: 'Pay' }).click();
});Check ordinary breakpoints and debugger statements
Clear the red breakpoint with a click, or choose Run > Remove All Breakpoints. Also search for a JavaScript debugger; statement. Continue after removing the trigger, then rerun with Debug Test.
Distinguish a slow action from a pause
If the call stack is not marked as paused, inspect the current Playwright action. A locator may be waiting for the element to become visible, enabled, stable, and receive pointer events. The Inspector and UI Mode expose actionability logs, which helps separate a legitimate wait from a debugger stop. Do not repeatedly press Stop while an application is still loading unless you have confirmed that the session itself is the problem.
3. Resume or stop with the correct lifecycle
When the test should continue
Use Continue in VS Code, or Resume in Playwright Inspector. If execution immediately pauses again, another breakpoint, page.pause(), or debugger; statement is still being reached.
When the session should end
Use VS Code’s square Stop control. For a launched Node.js process that does not shut down after the first Stop, VS Code’s documented Node.js guidance is to press Stop a second time to force termination. Save any useful console output before doing so.
Launch versus attach
| Session type | What Stop does | Practical implication |
|---|---|---|
| Launch | VS Code attempts to stop the debuggee it started. | A second Stop can force a launched Node.js debuggee that failed to exit. |
| Attach | VS Code disconnects the debugger. | The target process continues running; stop it through its own terminal, task runner, or process manager. |
Before terminating anything, identify which configuration started the session. Blindly killing a process can interrupt a development server shared by other tests.
4. Audit .vscode/launch.json
If the problem recurs or VS Code launches the wrong file, open .vscode/launch.json and inspect the configuration selected in the Run and Debug drop-down.
What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
type: use the debugger type supported by your installed extension.request:launchstarts a process;attachrequires an already-running target and matching connection details.- Entry point: verify the test runner or script points at the intended project.
cwd: set the working directory to the project containingplaywright.configand dependencies.args: check test paths, project names, grep filters, and debug flags for stale values.envandenvFile: confirm required base URLs, credentials, and feature flags are available to the launched process.preLaunchTask: a task that never exits can make the debug session appear stuck before Playwright starts.
Attach configurations additionally need a running Node.js target and the correct inspector port or connection information. If the target was restarted, its old connection details may no longer work; stop the stale configuration and attach again to the new process.
5. Reproduce outside the VS Code test button
Running the same test from Playwright’s own tools tells you whether the issue belongs to the test, browser, or editor session.
Playwright Inspector for one test or line
From the project directory, run:
npx playwright test example.spec.ts:10 --debugReplace the file and line with the failing location. Inspector provides stepping, locator inspection, and actionability information. If the command behaves normally while VS Code remains active, focus on the VS Code configuration or extension workflow.
UI Mode for interactive investigation
npx playwright test --uiUI Mode lets you select tests, filter runs, use watch mode, and inspect logs, errors, network requests, DOM snapshots, and traces. It is useful when the test is not paused at a source line but appears to wait on a browser action.
The Tool Desk
Outbyte PC Repair FREERepair Windows errors before they cause bigger problemsFix Now →Outbyte Driver Updater FREEFix the driver behind crashes, sound loss and screen glitchesFind Drivers →Run without debugging
npx playwright test example.spec.ts:10A normal run provides a baseline. If it also waits indefinitely, the cause is likely in application readiness, a locator, a network dependency, or test teardown rather than the VS Code debugger.
6. Use traces after a run completes or fails
Tracing is retrospective: it does not resume a currently paused debugger, but it can show what happened before a timeout or failure. Open the trace in Trace Viewer and inspect the timeline, DOM snapshots, screenshots, and network activity. A trace can reveal that an action spent its timeout waiting for a selector, that a request never completed, or that the test finished while a separate process kept the session alive.
Capture traces using your project’s existing Playwright configuration or command-line options, then open the generated trace with the Playwright trace viewer. Keep the trace with the test report when handing the problem to a teammate; it records more useful context than a screenshot of the stuck browser.
7. Browser DevTools without losing the Playwright session
If you need Chrome DevTools, use the Playwright extension’s documented path: choose Run Test with Show Browser. This reuses the browser session and opens DevTools while the test remains connected. It is preferable to manually opening a second browser, which can create a different profile, storage state, or target than the one your test controls.
Recommended Free Tools
Common symptoms and targeted fixes
| Symptom | Likely explanation | Fix |
|---|---|---|
| Yellow execution line and browser paused | Breakpoint or page.pause() |
Continue/Resume, then remove the unintended pause trigger. |
| Stop appears ineffective in a launched test | Launched Node.js process did not exit cleanly | Press Stop a second time to force termination. |
| Stop returns to the editor but server remains | Attach session | Stop the target from its terminal or process manager; VS Code only disconnected. |
| Session never reaches the test | Pre-launch task, wrong working directory, or invalid entry point | Inspect preLaunchTask, cwd, and entry-point fields. |
| Inspector waits on a locator | Actionability conditions are not met | Use locator inspection and logs; verify the element, page state, and application readiness. |
| VS Code and command line disagree | Different environment, project, arguments, or browser settings | Compare working directory, environment variables, test arguments, and selected project. |
Performance, reliability, and safe cleanup
- Use a narrow test path such as
file.spec.ts:linewhile diagnosing; running the entire suite obscures the first failure. - Prefer UI Mode or Inspector for interactive work and traces for post-run analysis. Each exposes different evidence, so use the smallest tool that answers the current question.
- Do not increase every timeout before checking for a pause. A debugger breakpoint and a genuine application wait look similar from the outside but require opposite fixes.
- Keep launch and attach configurations separate and name them clearly in
launch.json. This prevents disconnecting from a shared server when you meant to terminate a test process. - After a forced stop, verify that no orphaned Playwright or Node.js process still owns the browser profile, inspector port, or test server before starting another run.
Or skip the browser setup
If your goal is a clean image or PDF of a page rather than interactive test debugging, ScreenshotNeo provides a single HTTP request. It accepts consent banners before capture and removes more than 60 known consent platforms, newsletter popups, and chat widgets; each cleanup step can be disabled. Bot checks, CAPTCHAs, blank pages, timeouts, failed loads, and cache hits are not billed, and the response identifies the page verdict and billing status in headers. Its MCP server includes take_screenshot, get_page_info, and capture_pdf for Claude, Cursor, and other MCP clients.
cURL:
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webpPython:
import requests
r = requests.get("https://api.screenshotneo.com/v1/shot", params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"}, timeout=90)
open("shot.webp", "wb").write(r.content)Node.js:
const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);See the ScreenshotNeo API documentation for options. Every plan includes the feature set: full-page and selector capture, device presets and custom viewports, dark mode, retina scale, PDF controls, custom CSS and JavaScript, clicks, waits, request blocking, headers, cookies, user agents, authorization, timezone and geolocation, transparent backgrounds, resizing, chosen-TTL caching, signed links, asynchronous webhooks, bulk capture of up to 100 URLs per call, usage data, and an OpenAPI specification. Existing parameter names used by other screenshot APIs also work.
The Free plan includes 1,000 shots each month with no card. Paid plans start at $5 for 3,000 shots; yearly billing gives two months free. Sign up for ScreenshotNeo and start with the free allowance.
FAQ
Why does Debug Test stop at a breakpoint every time?
Debug Test honors breakpoints. Remove or disable the breakpoint, then rerun with the normal Run Test action if you do not need interactive stepping.
Will Stop kill my development server?
Only a launched debuggee is the process VS Code attempts to stop. In an attach session, Stop disconnects VS Code and leaves the target running.
Should I use UI Mode or Inspector?
Use Inspector for a focused test or line; use UI Mode when you need test selection, watch mode, logs, network details, DOM snapshots, and traces.
Can a trace fix a currently paused test?
No. A trace helps analyze a completed or failed run. Resume or stop the active debugger first, then use tracing to investigate what happened.
Frequently Asked Questions
Why does Debug Test stop at a breakpoint every time?
Debug Test honors breakpoints. Remove or disable the breakpoint, then rerun with the normal Run Test action if you do not need interactive stepping.
Will Stop kill my development server?
Only a launched debuggee is the process VS Code attempts to stop. In an attach session, Stop disconnects VS Code and leaves the target running.
Should I use UI Mode or Inspector?
Use Inspector for a focused test or line; use UI Mode when you need test selection, watch mode, logs, network details, DOM snapshots, and traces.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
