1 of 17

Playwright 1.38

What’s new

2 of 17

Tip of the Day

Keep @playwright/test up-to-date!

  • ✨ Evergreen browsers
  • 🐞 Bug Fixes
  • 🌈 New Features

​

3 of 17

Agenda: Playwright 1.38

  • 🌈 UI Mode Update
  • πŸ“š Form-Filling Update
  • 🀿 Miscellaneous

​

4 of 17

UI Mode Updates

5 of 17

UI Mode updates: summary

  1. Zoom into time range
  2. Network panel redesign
  3. Dock-to-right
  4. Browser installation prompt
  5. New β€œerrors” tab

6 of 17

​

​

πŸ“š Form-Filling Update

New in Playwright 1.38

7 of 17

Form-Filling: Recap

8 of 17

Form-Filling: Recap

locator.fill('John Doe')

locator.type('John Doe')

9 of 17

Form-Filling: Recap

locator.fill('John Doe')

locator.type('John Doe')

VERY FAST. As-if the value is pasted! οΏ½

  • Clears input element
  • Sets input value
  • Sends a single β€œinput” event

LESS FAST. As-if the value is typed!οΏ½

  • Does not clear input element
  • Sends `keydown`, `keypress`/`input` and `keyup` for each character

10 of 17

Form-Filling: Recap

locator.fill('John Doe')

locator.type('John Doe')

VERY FAST. As-if the value is pasted! οΏ½

  • Clears input element
  • Sets input value
  • Sends a single β€œinput” event

LESS FAST. As-if the value is typed!οΏ½

  • Does not clear input element
  • Sends `keydown`, `keypress`/`input` and `keyup` for each character

11 of 17

Form-Filling: Recap

locator.fill('John Doe')

locator.type('John Doe')

VERY FAST. As-if the value is pasted! οΏ½

  • Clears input element
  • Sets input value
  • Sends a single β€œinput” event

LESS FAST. As-if the value is typed!οΏ½

  • Does not clear input element
  • Sends `keydown`, `keypress`/`input` and `keyup` for each character

locator.pressSequentially('John Doe')

Playwright 1.38

12 of 17

​

​

🀿 Miscellaneous

New in Playwright 1.38

13 of 17

Playwright 1.38: Miscellaneous

  • browserContext.on('weberror')

14 of 17

Playwright 1.38: Miscellaneous

  • browserContext.on('weberror')
  • The reporter.onEnd() now reports startTime and total run duration.

​

15 of 17

Summary: Playwright 1.38

  • 🌈 UI Mode Update
    • Network panel redesign
    • Errors tab
    • Dock-to-right
  • πŸ“š Form-Filling Update
    • Use locator.fill('John Doe')
  • 🀿 Miscellaneous
    • browserContext.on('weberror')
    • Custom reporter API enhancement

​

16 of 17

Summary: Playwright 1.38

  • 🌈 UI Mode Update
    • Network panel redesign
    • Errors tab
    • Dock-to-right
  • πŸ“š Form-Filling Update
    • Use locator.fill('John Doe')
  • 🀿 Miscellaneous
    • browserContext.on('weberror')
    • Custom reporter API enhancement

​

npm i -D @playwright/test@latest

17 of 17

Playwright: Resources