AutomateTogether
AutomateTogether
  • 9
  • 63 729
Automate TOTP 2-Factor Authentication (2FA) with Playwright
A short tutorial to help you understand what goes into automating a TOTP-based 2FA flow using Playwright and the OTPAuth library.
Goal:
Automate a 2FA login using Playwright and OTPAuth.
Note:
There are multiple libraries out there for TOTP generation. Pick the one you like.
Timestamps:
00:00 Introduction
00:33 TOTP for 2FA
01:22 Approaching 2FA automation
02:23 Extracting the TOTP secret
03:48 Recording the script
05:32 Generating the TOTP token
08:19 2FA automation challenges
10:11 Resources
Environment:
- MacBook Pro (13-inch, M1, 2020)
- macOS Monterey (12.2.1)
- Node v14.15.4
- Playwright 1.24.2
Resources:
- QR decoder: zxing.org/w/decode.jspx
- OTPAuth library: hectorm.github.io/otpauth
- The excellent official Playwright docs: playwright.dev
- IETF RFC6238: www.rfc-editor.org/rfc/rfc6238.html
- ragog.link for more articles and notes
Contact:
- @rag0g on Twitter
- linkedin.com/in/ragog
-@Giovanni Rago on the official Playwright Slack channel
Disclaimer
These videos are meant to teach interested people, professionals and amateurs, how to use browser automation tools such as Playwright to write scripts for testing, synthetic monitoring, scraping and similar use cases. They center around popular websites to demonstrate real world scenarios for automation. Their aim is never to disrupt a website’s availability or violate its terms of service.
Before you attempt automation on a publicly available website, make sure you read the terms and conditions around automation (and specifically scraping) and abide by them.
มุมมอง: 18 210

วีดีโอ

Automating a web chat with Playwright
มุมมอง 1.5K2 ปีที่แล้ว
Goal: Get a first look at how Playwright enables control of multiple tabs and contexts through a practical example. Notes: - This is not a full-blown tutorial on multiple tabs; one such tutorial will come in the near future. - This is not one of my Automate Togethers, i.e. I am not live coding and I had a look at automating this scenario beforehand. Environment: - MacBook Pro (13-inch, M1, 2020...
Testing/monitoring reddit.com with Playwright! [Automate Together #2, Part 1]
มุมมอง 1.2K2 ปีที่แล้ว
A hands-on live automation session where you can see me try and write an automation script with Playwright running against reddit.com, with the goal of showing one way this can be done from beginning to end in a real-world environment and, in turn, helping Playwright users be more successful at automating monitoring and testing scenarios on their own target websites. Resources: - The excellent ...
Playwright Test or Playwright Library? In 2 minutes
มุมมอง 3.5K2 ปีที่แล้ว
Goal: Learn the main differences between Playwright Test and Playwright Library Questions answered: - What are they? - What are the differences and similarities - What to use each of them for Environment: - MacBook Pro (13-inch, M1, 2020) - macOS Monterey (12.2.1) - Node v14.15.4 - Playwright 1.20 Resources: - The excellent official Playwright docs: playwright.dev - ragog.link for more articles...
Playwright request interception
มุมมอง 14K2 ปีที่แล้ว
Goals: Learn the basics of network manipulation with Playwright 1. Inspecting requests and responses 2. Intercepting and blocking requests 3. Modifying responses for stubbing Environment: - MacBook Pro (13-inch, M1, 2020) - macOS Monterey (12.1) - Node v14.15.4 - Playwright 1.18 Resources: - The excellent official Playwright docs: playwright.dev/docs/network - My guide on request interception o...
Record Playwright scripts using Codegen
มุมมอง 3.9K3 ปีที่แล้ว
Goals: Learn the basics of using Playwright Codegen, including best practices to ship robust scripts to production. If you are a beginner, I’d recommend watching two previous videos on this channel: 1. Code-first Playwright intro tutorial on macOS: th-cam.com/video/i-46PlHmP2g/w-d-xo.html 2. Playwright selectors in-depth for beginners: th-cam.com/video/Vp6ltXMw4kE/w-d-xo.html Official Codegen d...
Writing a Playwright script testing/monitoring amazon.com! [Automate Together #1]
มุมมอง 5K3 ปีที่แล้ว
A hands-on live automation session where you can see me try and write an automation script with Playwright running against amazon.com, with the goal of showing one way this can be done from beginning to end in a real-world environment. Resources: The excellent official Playwright docs: playwright.dev/docs/in My guide on selectors on Checkly’s open-source guides: www.checklyhq.com/learn/headless...
Playwright selectors in-depth for beginners (with best practices and examples)
มุมมอง 14K3 ปีที่แล้ว
An in-depth look at selectors with Playwright for beginners. Consists of a general intro, best practices and practical examples. Goals: - Learn how to find & test selectors including a. CSS selectors b. XPath selectors c. Playwright text selectors - Learn selector best practices to a. Distinguish between solid and brittle selectors b. Optimise existing selectors when possible Resources shown: -...
Code-first Playwright intro tutorial on macOS (install to first script)
มุมมอง 1.9K3 ปีที่แล้ว
A Playwright intro tutorial that aims at getting you started writing Playwright code as quickly as possible. Finished script: pastebin.com/ayi5SH2k Goals: - Learn to set up Playwright on macOS - Learn to write a basic script a.Opening and closing the browser b.Clicking, typing and waiting c. Inspecting the page d. Headless and headful launch Resources shown: - nodejs.org - danube-webstore.herok...

ความคิดเห็น

  • @SlavZute
    @SlavZute 19 ชั่วโมงที่ผ่านมา

    Amazing video. I hope you're going to make more Playwright videos and testing videos in general, maybe? Very informative and very helpful!

  • @pixies64
    @pixies64 3 หลายเดือนก่อน

    love how im doing a coding test in 2024 and its using playwright not playwright test been a pain to find info on

  • @n4h92
    @n4h92 4 หลายเดือนก่อน

    can we do that with .json files?

  • @ompanhale-b8r
    @ompanhale-b8r 6 หลายเดือนก่อน

    how this can help us to automate otp which is coming on the gamil and also otp is coming after sending the invite from one portal and need to sigin in on to the next portal after putting password then to handle such senario can u please help me in that plz

  • @gaorutweandrewmosala1288
    @gaorutweandrewmosala1288 7 หลายเดือนก่อน

    This video was very helpful and good content overall, No BS!!

  • @davidev9107
    @davidev9107 8 หลายเดือนก่อน

    Java alternative ?

  • @pistolprasadyt8748
    @pistolprasadyt8748 8 หลายเดือนก่อน

    Awesomr bro.. From India

  • @oyerindedaniel7977
    @oyerindedaniel7977 10 หลายเดือนก่อน

    nice video

  • @ripperx444
    @ripperx444 11 หลายเดือนก่อน

    But you can't do this for web sockets can you? Sure you can see that a page opened a socket connection but you can't actually intercept and change the reply

  • @SlavaTravels
    @SlavaTravels 11 หลายเดือนก่อน

    Thanks, man! Very educational! I was always wondering how others overcome it!

  • @williamflores7323
    @williamflores7323 ปีที่แล้ว

    How can I do this in python?

  • @soumyabhat5308
    @soumyabhat5308 ปีที่แล้ว

    How to automate when you receive OTP via text msg in phone?.

    • @Vineetkumar-hu2cs
      @Vineetkumar-hu2cs ปีที่แล้ว

      I am too interested to know same asked by @soumyabhat5308

    • @sabbyLuthra
      @sabbyLuthra 5 หลายเดือนก่อน

      By using mock server.

  • @marijanarukavina9499
    @marijanarukavina9499 ปีที่แล้ว

    How can I make it work with Upwork, they have Authenticator app for OTP but I don’t know how to get secret since there is no QR code

  • @blecomp
    @blecomp ปีที่แล้ว

    Great video thanks for sharing. Did you made some video about mocking? Thanks again

  • @wangarewakungu9753
    @wangarewakungu9753 ปีที่แล้ว

    That was helpful. Kindly do the same with Python.

  • @pedritoap1
    @pedritoap1 ปีที่แล้ว

    Amazing, I did it and did work. Do you know if it is possible to do it with python with some library?

    • @wangarewakungu9753
      @wangarewakungu9753 ปีที่แล้ว

      I would like to know as well. Did you get a solution?

    • @diddi62
      @diddi62 ปีที่แล้ว

      me too @@wangarewakungu9753

  • @CTimmerman
    @CTimmerman ปีที่แล้ว

    And of course the two conflict. I just want to test WCAG as well as functionality, so i'll drop the test wrapper.

  • @mohitomish
    @mohitomish ปีที่แล้ว

    Java alternative?

    • @davidev9107
      @davidev9107 8 หลายเดือนก่อน

      I search it me too

  • @ravi14feb
    @ravi14feb ปีที่แล้ว

    Great Stuff, amazing content. I have a quick question about the Codegen record popup, I am unable to see JavaScript in the target dropdown, using Playwright version 1.29.1. any lead will be highly appreciated

  • @clifflikovo6836
    @clifflikovo6836 ปีที่แล้ว

    😂😂😂😂 where can i get the parry hotter book?

  • @MrSpinozadp
    @MrSpinozadp ปีที่แล้ว

    awesome! thx

  • @MichaelStrother
    @MichaelStrother ปีที่แล้ว

    Thank you for creating this... very helpful!

  • @amritesh94
    @amritesh94 2 ปีที่แล้ว

    Does this work with Microsoft Auth Azure as well? In the QR i am only getting the client secret and not the period and digits

    • @danielkovacs3664
      @danielkovacs3664 ปีที่แล้ว

      good questin it is interesting for me as well

    • @pabloarp9583
      @pabloarp9583 5 หลายเดือนก่อน

      I have exactly the same question. Do you know something about it? it is very frustating

    • @startFromNull
      @startFromNull 3 หลายเดือนก่อน

      Does anyone know this good question?

  • @HighRollersLounge
    @HighRollersLounge 2 ปีที่แล้ว

    That was useful, thank you!

  • @jaysont5311
    @jaysont5311 2 ปีที่แล้ว

    This is very cool. Thanks for sharing

  • @darsi567
    @darsi567 2 ปีที่แล้ว

    Can you show us how to mock the page after signup /login please

  • @flaviokonti5522
    @flaviokonti5522 2 ปีที่แล้ว

    Thanks man, this is useful

  • @varsharani849
    @varsharani849 2 ปีที่แล้ว

    hello sir can u plz make a video of how to handle the carousel for amazon website

  • @mikemace2860
    @mikemace2860 2 ปีที่แล้ว

    At last! All the docs and info seem to be geared towards running playwright test code with npx and test and assert. As a beginner I was tearing my hair out trying to write simple (non test and assert) scripts which I could run easily. None of them worked in the test environment and this video was an eye-opener for me. Many, many thanks

  • @mikemace2860
    @mikemace2860 2 ปีที่แล้ว

    Very informative video, thank you

  • @TristanBailey
    @TristanBailey 2 ปีที่แล้ว

    Some good advice on choice of selector for locator but more advice to build app better hocks rather than test better in playwright as title suggests

  • @varsharani849
    @varsharani849 2 ปีที่แล้ว

    Hello sir plz can u tell me how to perform click action or automate sub menu links of ecommerce website like if in a column more than 10 links so to perform click one by one

  • @ValorHeart
    @ValorHeart 2 ปีที่แล้ว

    Great explanation, you're using Playwright as "Library" here, right? i'll be happy to know if it's possible to use the html report and trace results in the Library mode as there isn't dedicated config file in that mode, right?

  • @peterspencer5112
    @peterspencer5112 2 ปีที่แล้ว

    Noob to CSS Selectors this is best video I've seen on the topic thanks

  • @prewinder
    @prewinder 2 ปีที่แล้ว

    Thank you, this was most helpful. Maybe you should turn this into a Udemy-class? You speak clearer than most of their tutors. What is the difference between using headless recorder versus playwrights recorder?

  • @rossfisher5543
    @rossfisher5543 2 ปีที่แล้ว

    Great video cheers! Better explanation than the docs.

  • @programandocomandersonsouza
    @programandocomandersonsouza 2 ปีที่แล้ว

    Hi friend. Good job.

  • @meddyba3518
    @meddyba3518 2 ปีที่แล้ว

    the danube website doesnt work anymore

  • @incialemdaroglu6964
    @incialemdaroglu6964 2 ปีที่แล้ว

    thank you for making it Cristal clear 🤩

  • @bloodylessy8608
    @bloodylessy8608 2 ปีที่แล้ว

    Hey ho. Great Video. Exactly what I was looking for so liked and subscripted :). Quick question : What is the best way to deal with some sort of "2 step authentication" (getting an code per email or clicking on a link to verify) I thought about some if/else condition like If "logged-in-page" is loaded within a certain timespan proceed... else print out in Error message "xy". Do you have an elegant solution for this case? (ps I know you could also open your mail acc. with playwright and fetch the needed data out of the arriving email, but on a Clear browser you should run into the same problem logging into your email acc). Best wishes and thank you mate :)

  • @incialemdaroglu6964
    @incialemdaroglu6964 2 ปีที่แล้ว

    thank you great video

  • @arturocdb
    @arturocdb 2 ปีที่แล้ว

    Hi, thank you for the video, i have question if you dont mind, its posible to obtain all product info in a data frame?, …, thank you!…

  • @prasadmadge8895
    @prasadmadge8895 2 ปีที่แล้ว

    Thanks for the awesome content. It helped allot.

  • @alekseyturchin1847
    @alekseyturchin1847 2 ปีที่แล้ว

    Awesome!!! Thanks for videos

  • @Matkotech
    @Matkotech 2 ปีที่แล้ว

    Awsome content, keep up the good work! 💪

  • @vitaly7196
    @vitaly7196 2 ปีที่แล้ว

    Great stuff! Thank you

  • @ValorHeart
    @ValorHeart 2 ปีที่แล้ว

    Thanks

  • @RockalaCarta
    @RockalaCarta 2 ปีที่แล้ว

    Excellent!... rock and coding... my passion!

  • @Arystan0271
    @Arystan0271 2 ปีที่แล้ว

    this is great content, much better than most popular videos on the topic. Really helped me understand the process of writing code. 👍

  • @SPDemergency1202
    @SPDemergency1202 2 ปีที่แล้ว

    Very cool ! Can we use xpaths instead of css selectors ? (since some folks might be transitioning from a selenium based framework) .