Hooks and Parallel Test Execution in Playwright

Tutorial 8​​ ​​ Hook​​ and​​ Parallel Test Execution​​ in Playwright​​ 

What you will Learn​​ in this​​ blog:

  • beforeEach hook​​ 

  • Execute Tests in Parallel

  • Code snippet

beforeEach hook​​ ​​ 

Sometimes we might want to execute a specific piece of code before executing the​​ test(s). As an example, let us suppose we have​​ 10 tests​​ and each one of them has a step to launch the same website, example below

Now, it’s not a good idea to include the above piece of code in all the 10 tests

Instead, we can write this piece of code (to launch website) only once. This is where ‘hooks’ come into picture.​​ 

The code (to launch website) can be written as part of ‘beforeEach’ hook and the code under this hook will be​​ executed before each test. Hence, if we have 10 tests, the ‘beforeEach’ hook will automatically be called 10 times.

Let us see a practical example.

Launch​​ http://zero.webappsecurity.com/online-banking.html​​ 

Notice that on this webpage, we have h1 and h3 elements

Let us create a describe annotation having 2 simple tests. Both the tests are launching the same webpage (lines 5 and 11), see below​​ 

Before we add a hook, let us quickly execute the​​ above test to make sure​​ it passes

Next, select any test and copy it

Paste the test before both the tests,​​ remove the test description​​ (see​​ lines 4-6)​​ 

Next, type ‘test.beforeEach

Hit Enter

Next, copy line#9 (url) and​​ paste it inside the​​ ‘beforeEach’​​ hook (line#5)

Comment lines 9 and 15​​ as shown below

Save the file​​ and execute.​​ 

Notice below that the test passes this time as well

Similarly we can use ‘afterEach’ hook to execute some piece of code after every test.​​  ​​​​ 

Execute Tests in Parallel

To save time, sometimes we might want to execute our tests in parallel. But before we see how to do that, let us execute the 2 tests​​ 

Notice below few things:​​ 
a) the 2 tests are running using 1 worker
b) first test took 22s and second took 3s
c) total time taken is 30s

Now let us use the ‘parallel’ method, see line#3 below​​ 

Save and execute.

Notice below few things:​​ 
a) the 2 tests are running using​​ 
2 workers
b)​​ both the tests started​​ executing​​ simultaneously
c
) first test took 10s and second​​ test also​​ took 10s
d) total time taken is 20s

So this is how we can use parallel testing to execute our tests faster.

Code snippet

import​​ {test,expect}​​ from​​ '@playwright/test'

 

test.describe.parallel('test suite', ()​​ =>​​ {

   ​​ test.beforeEach(async​​ ({​​ page​​ })​​ =>​​ {

       ​​ await​​ page.goto('http://zero.webappsecurity.com/online-banking.html')          

    })          ​​ 

 

   ​​ test('working with forms',​​ async​​ ({​​ page​​ })​​ =>​​ {

       // await page.goto('http://zero.webappsecurity.com/online-banking.html')

       ​​ const​​ elem​​ =​​ await​​ page.locator('h1')

       ​​ await​​ expect(elem).toBeVisible()              ​​ 

    })

   ​​ 

   ​​ test('working with assertions',​​ async​​ ({​​ page​​ })​​ =>​​ {

       // await page.goto('http://zero.webappsecurity.com/online-banking.html')

       ​​ const​​ elem​​ =​​ await​​ page.locator('h3')

       ​​ await​​ expect(elem).toBeVisible()          

    })      ​​ 

})

Thank you for reading!

Share On

Share on facebook
Share on twitter
Share on linkedin
Share on whatsapp
Share on tumblr
Share on email

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top

Lifetime Membership Club

LIFETIME MEMBERSHIP BIG SALE - ALL LIVE COURES JUST - 7000 RS/ 99 USD
Attend All Live courses in just 7000 rs / $99 - offer ends 1st Nov 2024