Teach on Udemy

Turn what you know into an opportunity and reach millions around the world.

Learn More

Your cart is empty.

Keep shopping

Cucumber Playwright TypeScript Automation Framework

Name: Cucumber Playwright TypeScript Automation Framework
Rating: 4.3 (234 reviews)

Learn how to develop a world class Cucumber, Playwright & Typescript automation framework from the ground up.

Created byCameron Bradley

Last updated 11/2023

English

What you'll learn

Setting up your local development environment.
Build and run our own locally running react application.
Creating our first automation test with cucumber, playwright and typescript.
Executing your automation test on your locally running application.
Deep dive into our first test and understand tagging, regex, step linking, cucumber params, element locators, developer tools and hooks.
Developing our understanding of Browser, Context and Page.
Adding your own unique element identifiers to the application code to enable more automation scenarios.
Setting up our automation framework to produce screenshots on test failure.
Implement Cucumber World to enable us to pass global variable and configuration within each scenarios separated context.
Leverage ENV files for better environment variable management.
Implement dynamic test configuration to provide more flexibility when running our cucumber scenarios.
Defining our element, page and host mappings in page specific .json files.
Introduce our own custom waitFor() function to add stability to our automation framework.
Adding a common ENV file to house all our common configuration across our automation framework.
Setup cucumber html reporter to report on our test suite results.
Reuse our waitFor to help stabilise and validate page has loaded before moving onto the next step.
Use the amazing debugging tools that Playwright provides, like Playwright Inspector.
Advanced chrome developer tool learnings like console logs and break points.
Automating Links, Buttons and Elements at specific index.
Automating Tables and asserting on an exact match between our Cucumber DataTable and the UI.
Automating Switches, Cards & Avatars.
Automating Drop Down Menus and Select Boxes.
Adding the ability to refresh our page during an automation test.
Automating Browser Alerts, Page Alerts and Tooltips.
Automating Text Areas and Hidden & Visible Text.
Automating stored values and expected values.
Preparing our automation suite for production Automation Suite Runs.
Running our automation on a production environment.
Storing login details in environment specific ENV files.
Leverage Example Tables from Cucumber to run scenarios on specific environments.
Emulate devices for our automation suite to run on leveraging Playwright Devices.
Introduce the ability to customise our console logs for errors, logs and debug and off.
Adding the ability to customise our automation failure errors.
Develop our own waitForSelector function that better integrated with our waitFor function.
Refactor our assertion and interaction steps for better stability and consistency.
Leverage random data in our automation suite form steps.
Demonstrate how quickly automation can be added with our world class automation framework.
Tagging our suite for @smoke and @regression in preparation for CI.
Learn to intercept responses with playwright and mock out our own custom responses.
Implement an accessibility automation testing suite across our react application.
Produce detailed accessibility improvement reports as well as fix some issues ourselves.
Pushing our project containing our automation framework & Suite to GitHub.
Setting up our local machine as a build agent in preparation to run our automation tests in CI.
Get our automation tests running on pull request and in CI (Continuous Integration)
Postman - Collections - Requests and Responses (GET, PUT, POST, PATCH, DELETE)
API Automation Test with Playwright and JavaScript (Learn Playwrights API capabilities)
Build a Cucumber, Playwright and TypeScript API Automation Framework
Develop and grow your understanding of TypeScript across the entirety of the course.
Implement Advanced Object Orientated Design Patterns and Separation of Concerns.

Course content

31 sections • 227 lectures • 32h 58m total length

Introduction12:49
- About me (Instructor)
- The Testing Talks Hub Difference
- Automation Framework Technology Stack
- The Power of Playwright Automation Framework
- Building a world-class automation framework with Playwright
- High Level Course Overview
- Key Online Resources to bookmark
- Some tips before taking the course
- Let’s connect
Why does building a robust automation framework matter45:58
We look at why automation framework architecture matters and the power of the automation framework you will build as part of this course.

- Why automation framework architecture matters
- The importance of building a 'Proof of Concept' automation framework
- How to leverage your wider team to help build a robust automation framework
- Key object-orientated design principles to use across your frameworks
- How this architectural approach can support multiple automation frameworks
- Finally, Some key observations (Successes and Challenges)

Getting started with Node.js9:46
- How to download and install Node
- Adding Node to your system $PATH (if required)
Setting up your development environment3:58
- Downloading and Installing your first (IDE) Integrated Development Environment
- Essential Cucumber Plugins for your (IDE) Integrated Development Environment
Setting up your development environment - VSCode5:45
- Downloading and Installing VSCODE
- Installing the Cucumber (Gherkin) Full Support Plugin
- Adding a VSCODE settings.json file
- Adding the the ability to step into cucumber scenario steps via the settings.json
- Stepping into our cucumber feature step definition
Cloning Repositories on GitHub & Starting your locally running React application7:14
- SSH Keys & Cloning your first GitHub repository
Setting up your first automation framework - part 19:34
- Yarn install packages for our react application
- Yarn start our locally running react application
- Creating our e2e folder within our react application project structure
- Initialising our package.json and tsconfig.json
- Yarn installing Playwright/test, Cucumber, TypeScript, ts-node and @types/node
Setting up your first automation framework - part 29:19
- Best practices - Automation folder structure
- Creating our first TypeScript file - Hooks.ts
- Setting up our hooks for Before, BeforeAll, AfterAll and After
- Introducing the concept of Browser, Context and Page with regards to Playwright Framework
- Importing our Cucumber & Playwright packages for the first time
- Creating our first Feature file and Cucumber scenario
Setting up your first automation framework - part 39:57
- Creating our first step definitions (navigation and assertion)
- Introducing the use of console log our step definitions
- Leveraging playwright page.goTo function to navigate to a page
- Our first text equals assertion using playwright/test
- Hooking up our cucumber run script within package.json
- Running our first automation test via the terminal
Key Learnings1:14
- Key Learnings for module 2
Module 2 Quiz

Running your automation test in IntelliJ using an NPM configuration3:35
- Running our tests in IntelliJ using an npm plugin configuration
Cucumber Scenario @tags - @dev, @smoke & @regression5:44
- Introducing different Cucumber @tags and their purpose
- Updating our package.json with @tag specific cucumber run scripts
- Running our automation tests using different @tags
Understanding regex, step linking and passing parameters via Cucumber steps12:28
- Understanding the benefit of passing parameters via cucumber steps
- Leveraging Regex to pass parameters within a Cucumber step
- Console logging our Cucumber step parameters leveraging string concatenation
- Implementing more flexible regex for text-based assertions
Working with element locators - Find and Update - Working with Developer Tools14:09
- Inspecting elements in our react application using developer tools
- Adding our first element locator to the react application codebase
- Introduce a new assertion cucumber step to check if the element is displayed
- Playwright locator function implemented to retrieve and store a locator object based on our element attribute
- toBeVisible leveraged from Playwright/test to determine if our element is visible
Understanding hooks and why 'test context' matters6:55
- Developing a deeper understanding of Hooks and how they work
- Understanding what HEADLESS mode is and seeing it first hand by running an automation test
- Understanding the power of running automation tests with segregated context
- Reviewing our understanding of Browser, Context and Page
Key Learnings1:33
- Key learnings for module 3
Module 3 Quiz

Adding screenshots on test failure and test video recordings9:17
- Screenshots generated on test failure
- Automation tests recorded for each test run
- Screenshots and Recordings being stored in a generated reports folder
Introducing Cucumber World - Seperate Context Cucumber Scenarios - Part 111:09
- Understanding the benefits of Cucumber World
- Implementing Cucumber World and initialising our Browser, Context and Page as Screen
Introducing Cucumber World - Seperate Context Cucumber Scenarios - Part 214:28
- Implementing our own custom newBrowser function to return our browser object
- Adding our env function to parse and determine if our expected ENV variable is present or not
- Enabling the ability to run our automation tests across different browsers (Chromium, Webkit, Firefox)
- Refactoring and simplifying our hooks.ts to leverage our new world functions
Introducing Cucumber World - Seperate Context Cucumber Scenarios - Part 36:05
- Levering .this in Cucumber World to pass our screen object between Cucumber Steps
- Adding our UI_AUTOMATION_BROWSER to customise the browser we run our automation tests against
- Running our first automation suite on a new browser - firefox & webkit
Dynamic test configuration - A more flexible cucumber.js - part 19:52
- Enabling our automation framework to pass global configuration via Cucumber World
- Implementing Babel to compile TypeScript to JavaScript to overcome cucumber.js lack of support for es6 or TypeScript
- Refactoring and reducing duplication in our package.json script
- Single cucumber script in package.json that is --profile enabled
Dynamic test configuration - A more flexible cucumber.js - part 213:21
- Passing dynamic cucumber arguments via our new index.ts
- Moving away from cucumber.js plugin and leveraging an NPM configuration
- Running our automation tests via a yarn cucumber script with a @tag profile
ENV files for better environment variable management12:05
- Understanding the benefits fo ENV files for better environment variable management
- Implementing DotEnv for passing ENV files to the global process.ENV
- Leveraging ENV variables to replace static paths and file names in our automation framework
- Running our automation tests to validate and verify our changes to our automation framework
Cucumber reporter and our first Dynamic Test Runner Script14:38
- Implementing cucumber-html-reporter for our automation suite reporting
- Levering ENV variables to set our JSON & HTML report files
- Attaching our screenshots to our test report on failure via the After hook
- Pre and Post scripts to handle generating our required report folders and test reports for each automation suite run
- Creating our own dynamic run_tests bash script to make test execution easier from the terminal
- Reviewing our cucumber-html-report on test pass and failure.
Windows users (REQUIRED) - Adding your run_tests.bat to run your automation4:16
Windows users only:
- Why the run_tests.sh returns a COMMON_CONFIG_FILE command error
- Creating our run_tests.bat file to run our automation suite on windows
- Updating our pacakge.json to remove COMMON_CONFIG_FILE references
- Updating our run_tests.sh file with our export COMMON_CONFIG_FILE
Running your automation suite with npm instead of yarn6:53
Many of students reached out asking how we can run our automation suite with npm instead of yarn.
- Consistent exporting of COMMON_CONFIG_FILE across .bat and .sh files
- Refactoring the structure of our package.json scripts
- Updating our yarn references to npm
- Adding additional double dashes to enable passing multiple arguments with npm

This new order we call our scripts inside package.json also resolves the "TypeError: suite.features.forEach is not a function" that some students had reported seeing - especially if you attempted to run the suite with no tests.
Key Learnings2:20
Key Learnings for module 4
Module 4 Quiz

Creating Mappings for Host URLS and Page ROUTES - part 111:09
- Understanding the value of mappings when building an object-orientated and reusable automation framework
- Implementing our first global.ts types definition file and creating types for our pages and hosts config
- Creating our hosts.json file containing our localhost URL
- Creating our pages.json file containing our home page ROUTE
- Adding hosts configuration and pages configuration to Cucumber World
Creating Mappings for Host URLS and Page ROUTES - part 27:00
- Initialising our hosts and pages configuration within our index.ts
- Retrieving hosts and pages json at runtime and storing it all as an object
- Passing our global config world parameters via our dynamic cucumber arguments inside index.ts
- Replacing our pageId string type with our new global PageID type
- Retrieving our globalConfig within our step definition by leveraging Cucumber World .this
Creating Mappings for Host URLS and Page ROUTES - part 312:23
- Developing our navigateToPage function
- Passing our global pagesConfig and hostsConfig to our new function
- Retrieving our host URL and page Route from global config based on our cucumber parameters
- Leveraging playwright goto function to then navigate to our page
- Running our automation test to validate our new global configuration and mappings are working as expected
Creating Element Mappings and using Global Variables to pass page - part 18:44
- Understanding the value of mapping our page elements
- Adding our ElementKey and ElementLocator to our global.ts type definitions
- Creating our pageElementMappings global.ts type definition
- Adding global variables to our global.ts types definition
- Initialising our pageElementMappings json files at runtime and storing them as object
Creating Element Mappings and using Global Variables to pass page - part 29:12
- Storing each page element mapping .json as respective objects based on pageId at runtime inside
- Setting our current page ID on navigation to page to globalVariables current screen
- Pass our new global variable for the current screen to our steps via Cucumber World
Creating Element Mappings and using Global Variables to pass page - part 37:03
- Creating our new getElementLocator function to retrieve our element mapping from the .json file based on our current page name
- Introduce the ability for our getElementLocator to also find our element mapping inside a new common.json designed for attributes that might be common across multiple pages
- Add our new ENV variable for where we will store all our element mapping json files
Creating Element Mappings and using Global Variables to pass page - part 49:54
- Adding our mappings within our home.json and common.json mapping files
- Running our automation test to validate our changes have been successful
- Updating our existing step definitions that interact with an element to leverage our getElementLocator function
- Running our automation suite to validate that everything is working as expected.
Introducing our custom waitFor() function - Removing playwright@test - part 18:38
- Understanding why implementing our own custom waitFor can be a powerful mechanism to further ensure stability when running your automation suite on an environment.
- Developing and deep-diving into our waitFor function - Understanding how it works and how we can set timeout and retry times.
Introducing our custom waitFor() function - Removing playwright@test - part 27:34
- Removing playwright@test and replacing it with native assertions
- Running our automation test and testing out our new waitFor function
- Introducing a default timeout across our suite that exceeds our waitFor timeout
- Creating a new envNumber function to convert our ENV variables from string to number
Introducing our custom waitFor() function - Removing playwright@test - part 37:47
- Verifying that our waitFor will retry until our respective timeout is hit.
- Refactoring our existing steps to leverage our new waitFor function
- Running our automation suite to check our new changes have not broken anything
Key Learnings1:15
Key Learnings from module 5
Module 5 Quiz

Matching our Page URL to our expected route Regex13:19
- Create our new current Path Matches Page Id function to test if our browser URL matches our pageId regex within page.json
- Leveraging our waitFor function to retry until our URL matches our pageId regex within page.json
Determining our pageId by matching our page URL to our page Regex - part 112:55
- Removing our current screen global variable for a better solution
- Creating our new getCurrentPageId function to retrieve our pageId based on matching the current page URL to a Regex found within our pages.json
- Leveraging the TypeScript Object.keys and .find function to retrieve our pageId from pages.json
Determining our pageId by matching our page URL to our page Regex - part 26:39
- Refactoring our getElementLocator to leverage our new getCurrentPageId function
- Debugging via console.log our new get getElementLocator function to deepen our understanding
- Running our automation tests to validate our pageId is updating in realtime as we transition between pages
- Create our new click button step definition
Determining our pageId by matching our page URL to our page Regex - part 312:51
- Create our new click button step definition leveraging our getElementLocator function
- Introduce playwright waitForSelector function to determine if our element is visible
- Introducing html-behavior to house our html interaction functions leveraging playwright
Determining our pageId by matching our page URL to our page Regex - part 412:22
- Adding our directed to step to add additional stability when navigating around the application
- Leveraging our waitFor function inside our new directed to navigation step
- Validating our automation test can run function and update our pageId across multiple page transitions.
Introducing Form Steps - Our first end to end test - part 113:12
- Developing our fill in the form input step
- Building our step leveraging our console log, getElementLocator and custom waitFor function
- Adding our new inputValue function within HTML behaviour to focus and fill our input using Playwright
- Run our automation test and validate our new form step
Introducing Form Steps - Our first end to end test - part 28:17
- Double-checking our automation suite is functioning as expected in HEADLESS mode
- Developing our select the option in form step
- Building our step leveraging our console log, getElementLocator and custom waitFor function
- Adding our new selectValue function within HTML behaviour to focus and selectOption
- Run our automation test and validate our new form step
Introducing Form Steps - Our first end to end test - part 314:14
- Seeing how we can now leverage our reusable Cucumber steps to automate out our form functionality
- Adding our respective form mappings and building out our first end to end automation test
Key Learnings1:41
Key Learnings from Module 6
Module 6 Quiz

Playwright Inspector - Stepping into our automation test13:03
- Understanding common reasons for test failures
- Some of the different debugging techniques available
- How to launch Playwright Inspector when we run our automation tests
- Playwright Inspector functionalities - Stepping through our automation test
- Pausing our tests with playwright's page.pause() function
Unlocking the benefits of Chrome Developer Tools - part 111:07
- Understanding the power of Developer tools
- Introducing a failure into our automation suite
- Adding a new should equal the text assertion step definition
- console logging our saved contact object within our react application
Unlocking the benefits of Chrome Developer Tools - part 29:34
- Enabling Chrome Developer Tools by default when our automation tests run
- Viewing our saved contact object via the console within Chrome Developer Tools
- Introducing debugger to our react application code and digging into the code via Chrome Developer Tools
Console logs, Breakpoints and Test Reports - part 17:51
- Using console.logs to debug our automation framework code
- Console logging our expected vs actual text and reviewing our console logs
- Introducing breakpoints to our code and using the IntelliJ debugger tool to step through our automation code
Console logs, Breakpoints and Test Reports - part 26:32
- The value of our cucumber reporter for debugging test failures
- Drilling down to the exact step failure within our cucumber reporter
- Reviewing our screenshot on failure within our cucumber reporter
- How to silence the cucumber publish message generated by cucumber reporter
Key Learnings1:16
Key Learnings for Module 7
Module 7 Quiz

Automation Test Radio Buttons - Check and Uncheck - part 116:13
- Introducing the Playground
- Understanding our approach to automating radio buttons
- Develop a new step definition to assert if a radio button is checked.
Automation Test Radio Buttons - Check and Uncheck - part 211:31
- Introduce a new interaction step definition to check a radio button
- Create a new checkElement function within our HTML behaviour to .check our radio button
- Develop an automation test that can test switching radio buttons is working as expected.
Introducing Negate to reduce duplication of step definitions - part 112:29
- Introducing the concept of negate into our Cucumber step definition
- Reducing duplication of step definitions by enabling the ability to assert on should and should not
- Refactoring our radio button scenario to leverage negate and more deeply test the functionality.
Introducing Negate to reduce duplication of step definitions - part 28:18
- Expanding negate across all our current assertion step definitions
- Refactoring our create contact scenario to leverage negate and more deeply test our functionality
- Discuss how we will further expand our Negate to interaction steps to ensure no repetition of code within our automation framework.
Automation test AutoComplete inputs, Input values and form validation - part 17:09
- Adding an automation test to interact with and assert on our AutoComplete component
- How to debug AutoComplete inputs with developer tools
Automation test AutoComplete inputs, Input values and form validation - part 29:09
- Creating our new contains the value step for use with form inputs
- Leveraging negate, getElementLocator, waitFor and native assertions to build a new consistent step definition
- Developing our getValue function within HTML behaviour to return our element value
- Mapping input id, text and values (Adding identifiers outside of data-id to our .json mapping files)
Automation test AutoComplete inputs, Input values and form validation - part 310:34
- Automation test input with different states - Active & Disabled
- Adding a new step to assert that our input equals the value
- Adding an automation test to validate our respective input equal the expected value
Automation test AutoComplete inputs, Input values and form validation - part 411:49
- Adding a new step to assert that our input is enabled or disabled
- Expanding on our input test to validate that our disabled and enabled inputs are as expected
- Adding a new automation test to validate our input validation error message
Running our automation suite in parallel & Introducing test retry6:12
- Expanding on our common cucumber arguments in index.ts to take in our parallel and retry parameters
- Adding our PARALLEL and RETRY ENV variables to our common.env
- Running our automation suite in parallel and validating parallel and retry are working as expected
Key Learnings1:09
Key learnings for module 8
Module 8 Quiz

Automation test Checkboxes (Check and Uncheck) - part 110:16
- The difference between checkboxes and radio button
- Adding a new automation test to interact with and assert on Checkboxes
- Updating our radio button step definitions to accept checkboxes via Regex
Automation test Checkboxes (Check and Uncheck) - part 29:28
- Enabling our Check step definition to both check and uncheck radio button and checkboxes using Regex
- Creating our new unCheck function within HTML Behaviour to uncheck element using playwright
- Updating our checkboxes automation test to uncheck and assert on our now unchecked checkbox
Automating IFrames - Switching Frames mid test - part 111:49
- Understanding how Playwright works and interacts with IFrames
- Creating a new automation scenario with the intention of interacting and asserting on Iframes
- Creating a new form input step designed for IFrames
Automating IFrames - Switching Frames mid test - part 29:07
- Developing our new getIframeElement function which will return our element content frame
- Adding our new inputValueOnIFrame function within HTML behaviour to fill in input
- Running our automation test to validate our Iframe form field is being interacted with and filled in with text
Automating IFrames - Switching Frames mid test - part 311:44
- Adding our first IFrame assertion step definition to ensure an element on IFrame is displayed
- Adding our Iframe assertion step definition to ensure an element contains the text as expected
- Running our automation test to validate our Iframe assertion steps are working as expected
Automating IFrames - Switching Frames mid test - part 410:10
- Adding our Iframe assertion step definition to ensure an element equals the text as expected
- Building out the rest of our end to end automation test leveraging our new IFrame steps
- Understanding why separate steps for IFrame was the cleaner and less complicated solution for our automation framework.
Automating New Tabs and Windows - part 111:03
- Why Playwright makes our life easier to automate New Tabs and Windows
- Creating a new automation scenario with the intention of interacting and asserting on tabs
- Passing our desired page index through our cucumber scenario and converting it to Number
- Creating our new tab should contain the title assertion step definition
Automating New Tabs and Windows - part 211:39
- Adding our new title assertion steps to our tabs Cucumber scenario
- Creating our new fill in the form input on tab step definition
- Developing our new inputValueOnPage function with HTML Behaviour to focus and fill our pages element input
- Updating our tabs Cucumber scenario to validate our new form step is working on the tab as expected
Automating New Tabs and Windows - part 310:24
- Creating a new general step to simply wait an expected amount of time (For debugging purposes)
- Adding our new step element should be displayed on tab step definition
- Updating our tabs Cucumber scenario to validate our new form assertion step is working on the tab as expected
Automating New Tabs and Windows - part 413:03
- Adding our tab assertion step definition to ensure an element equals and contains the text as expected
- Building out the rest of our end to end automation test leveraging our new tab steps
- Understanding why separate steps for tabs was the cleaner and less complicated solution for our automation framework.
Automating New Tabs and Windows - part 58:39
- Updating our new tab interaction and assertion steps to work with new windows via Regex
- Copy and paste our Tab Cucumber Scenarios across to our new windows.feature
- Refactor our automation test to interact with the new window button
- Find and replace all our tab references and update to window across our windows.feature
- Quickly add multiple new automation tests to an entirely new functionality (new window) in minutes.
Key Learnings1:05
Key Learnings for module 9
Module 9 Quiz

Automating Links, Buttons and Clicking element at Index - part 18:56
- Adding an automation test that interacts with links
- Updating our click interaction step definition to enable button or link using Regex
- Running our link Cucumber scenario to verify our change is working as expected
Automating Links, Buttons and Clicking element at Index - part 29:30
- Adding an automation test that can interact with buttons (with the same element identifier) at Index
- Creating our new click element at index interaction step - leveraging regex to pass our desired index as a parameter.
Automating Links, Buttons and Clicking element at Index - part 312:44
- Creating our new clickElementAtIndex within our HTML behaviour
- Running our automation test to validate our button is being clicked at index
- Adding a new assertion step definition to assert on the text at index containing text
- Validating our button at index contains our expected text by running our automation test
Automating Links, Buttons and Clicking element at Index - part 45:07
- Building out our automation test to interact and assert on multiple buttons at respective indexes
Automating Tables - Matching our HTML table to Cucumber Data Table - part 19:37
- Understanding the power of cucumber Data Table to pass in our expected table data to our Cucumber table assertion step
- Creating our new table should equals the following Data Table step definition
- Understanding the respective Data Table functions we can access via the Cucumber framework
Automating Tables - Matching our HTML table to Cucumber Data Table - part 26:42
- Creating a function to return our HTML table data rows for use in our Cucumber table assertion step definition
- Adding our new Cucumber step definition to our Cucumber Scenario and matching up our Data Table to our HTML table data
- Running our automation test to validate that our new table step definition is working as expected
Automating Tables - Matching our HTML table to Cucumber Data Table - part 37:03
- Debugging our new table step definition to validate the data coming through our Data Table and HTML table
- Adding a should not equals the following Data Table step to our cucumber scenario
- Running our automation test to validate our table scenario is working as expected
Automating Switches - low code / no code7:43
- Starting to experience how we can add entirely new scenarios for new features by leveraging existing step definitions.
- Enabling our radio button/check box steps to interact and assert on switches by updating our step Regex
- Running our new switch automation test to validate our changes are working as expected
Key Learnings1:02
Key learnings from module 10
Module 10 Quiz

Requirements

The course has been designed to take you from beginner to expert in building a world class automation framework.
You can complete this entire course on MAC, Windows on Linux.

Description

This course has been designed to simulate a real-world experience in building a Cucumber, Playwright & TypeScript automation framework from the ground up for a fully-featured application.

Upon completion, you will be able to apply your learnings and the automation framework you have built into your respective companies and projects. We are confident you will become an expert in building a world-class automation framework.

Our course and the automation framework we will build together has been developed with guidance from some of the globes leading testing and software engineering professionals and because of that we believe we can offer an incredible course where we will:

- Develop your automation framework against a real react application running on your local machine.

- Build an end-to-end automation framework from the ground up for a full-featured end-to-end react application.

- Evolve your skills and continuously improve your automation framework as we progress through the course

- Learn how to build an object-orientated – engineer reviewed and approved automation framework.

We want this course to be the best decision you have ever made for your personal growth when it comes to improving your knowledge and skills in test automation framework architecture.

Across many hours of exciting content I will be at the bottom right of your screen instructing and cheering you along throughout the course. You will have everything you need to learn how to build a world-class automation framework.

----------- New Course Added in 2023 -----------

Happy New Year to all our wonderful students!

Playwright introduced the ability to support standalone API automation testing as part of the version 1.16 upgrade. Playwright is now considered a formidable option when selecting a great open-source automation framework for API Testing.

Many of our students reached out asking if we could consider updating the course with a some new lectures on how to build a Cucumber, Playwright and TypeScript API Automation Framework.

We have taken it a step further - By adding a comprehensive new course on the subject within your existing Build a Cucumber Playwright TypeScript Automation Framework course.

From Section 24 - 5+ hours of new content!

Rest API Testing (Automation) with Playwright & TypeScript

- Plan and roadmap your automation coverage with Postman.

- Develop your API automation framework against a real API.

- Build two end-to-end automation frameworks (Playwright + JavaScript & Cucumber, Playwright & TypeScript) from the ground up for a full-featured end-to-end API.

- Evolve your skills and continuously improve your automation framework as we progress through the course

- Learn how to build an object-orientated – engineer-reviewed and approved automation framework.

If you enjoy the new course all we ask for in return is a kind review! We will continue to bring amazing updates like this in the future. :)

Who this course is for:

Automation Engineers
Software Testers
Software Engineers
IT Professionals
Manual Testers looking to learn automation testing

Cucumber Playwright TypeScript Automation Framework

What you'll learn

Explore related topics

Course content

Introduction2 lectures • 59min

Your first automation test8 lectures • 57min

Deep diving into our first automation test6 lectures • 44min

Screenshots on failure, Cucumber World, ENV variable management and test reports11 lectures • 1hr 44min

Host URLS and Page ROUTE mappings, Our WaitFor function & first End to End test11 lectures • 1hr 31min

WaitFor our Page to be loaded - Simple Form Interactions9 lectures • 1hr 36min

Taking a pause - Playwright Debugging Tools6 lectures • 49min

The Playground - Automating all the things - Part 110 lectures • 1hr 35min

The Playground - Automating all the things - Part 212 lectures • 1hr 58min

The Playground - Automating all the things - Part 39 lectures • 1hr 8min

Requirements

Description

Who this course is for: