How to pause in Playwright | Using the Pause Method in your Script

We are going to learn how to pause in Playwright. No, we are not talking about waiting here, we are just talking about freezing the screen so that you see your script being executed. At times while working with headed browsers, sometimes you want to grab hold of the screen to see how you are faring.

Of course, you could use the debug facility to do that, but why complicate things when you already have a small method to pause the script exactly where you want, right?

I am assuming that you have already some basic knowledge of how to work with Playwright.

Now that you are ready, let’s see how to pause and resume your script in playwright.

Steps on How to Pause in Playwright

To pause at a certain step in your script, all you need to do is to make use of the isolated page instance’s method called – pause.

Let us see an example of how to use that.

Let’s say we have the following code with us, where we are first navigating to the playwright website and then verifying whether we have the title ‘Playwright’ on it or not.

Step 1: To pause the script execution, you gotta use the following pause method in your script where you wish to take a hiatus:

await page.pause();

So our code now will look like this:

What it basically does is that, when you execute your code now, it will pause at the execution after line no. 5 (i.e. opening the Playwright website) gets executed.

Step 2: Go to your console, and run your script. You can use the following command to run it on Chromium on a headed browser:

npx playwright test --headed --project=chromium

When you run your script you will notice that the Playwright website opens and then the pause method executes. What it does opens the playwright inspector on the right side from where you can operate whether to resume running the code or make necessary changes.

How to Resume in Playwright

Now in order to move forward, there are two ways:

• Can click on the Resume button
• Call playwright.resume() method in the Dev console

Let us try to click on the resume button first on the page overlay.

Here’s a short video showing the execution:

As you can observe the script moves forward, the rest of the execution takes place and the test passes.

The other alternative to clicking on the resume button is to do it from the Dev console.

For that, you just have to open the Inspect element (shortcut – F12) and navigate to the console. Then type the following command:

playwright.resume()

and then press enter.

Here’s a short video showing how to do it from the dev console:

If you liked this tutorial on how to pause in playwright, you can see why I have been pushing on wanting everyone to learn playwright.