Playwright Beginner Tutorial 2 | How to install
HTML-код
- Опубликовано: 11 июл 2024
- ▬ ALL FREE COURSES ► automationstepbystep.com/
▬ ASK RAGHAV ► bit.ly/2CoJGWf
QUIZ - forms.gle/UMhid4JwJDB1fmVUA
00:00 Introduction
00:50 Prerequisites
04:33 How to install Playwright
05:02 Option 1 - using node commands
12:35 Playwright project structure
18:34 Option 1 - using vs code extension
25:20 Outro
Visual Studio Code ► bit.ly/2V15yvt
Prerequisites
Node JS
node -v npm -v
IDE ( VS Code )
Install using command as npm package
Step 1 - Create a new folder and open in VS Code
Step 2 - Goto Terminal and run command - npm init playwright@latest
Step 3 - Following will be added
- package.json - node project management file
- playwright.config.js - Configuration file
- tests folder - basic example test
- tests-examples folder - detailed example tests
- .gitignore - to be used during git commit and push
- playwright.yml - to be used during ci cd pipeline (github workflows)
Step 4 - Check playwright added - npm playwright -v
Step 5 - Check playwright command options - npx playwright -h
Using VS Code extension
Step 1 - Create a new folder and open in VS Code
Step 2 - Goto Extensions section and install Playwright extension from Microsoft
Step 3 - Goto View - Command Palette and type playwright - select install playwright
Step 4 - Select the browsers and click ok
Step 5 - It will install the libraries and create the project folders
#playwright #automation #testing
CI CD DEVOPS
JENKINS BEGINNER ► bit.ly/2MIn8EC
JENKINS TIPS & TRICKS ►bit.ly/2LRt6xC
JENKINSFILE ► bit.ly/3JSMSZ7
DOCKER ► bit.ly/2MInnzx
KUBERNETES ► bit.ly/2MJIlMK
UI TESTING
SELENIUM BEGINNERS ► bit.ly/2MGRS8K
SELENIUM JAVA FRAMEWORK ► bit.ly/2N9xvR6
SELENIUM PYTHON ► bit.ly/2oyMp5x
SELENIUM TIPS ► bit.ly/2owxc50
SELENIUM BUILDER ► bit.ly/2MKNtlq
SELENIUM 4 ► bit.ly/3AiJOlP
KATALON STUDIO ► bit.ly/2wARFdi
ROBOT FRAMEWORK with RIDE ► bit.ly/2Px6Ue9
ROBOT FRAMEWORK with Eclipse► bit.ly/2N8DZxb
PROTRACTOR ► bit.ly/2KtqVkU
ACCELQ ► bit.ly/3PlsAsh
TEST PROJECT ► bit.ly/2DRNJYE
CUCUMBER BDD ► bit.ly/3Cnno4z
CYPRESS ► bit.ly/3PpEukM
XPATH & WEB LOCATORS ► bit.ly/3PpEvoQ
API TESTING
WEB SERVICES (API) ► bit.ly/2MGafL7
SOAPUI ► bit.ly/2MGahmd
POSTMAN ► bit.ly/2wz8LrW
POSTMAN 2022 ► bit.ly/3JWm4qX
JMETER API TESTING ► bit.ly/3AgVPar
KATALON STUDIO API ► bit.ly/2BwuCTN
REST ASSURED ► bit.ly/3zUdhRD
KARATE API ► bit.ly/3w3H5Ku
API MOCKING ► bit.ly/3bYPsjS
MOBILE TESTING
APPIUM ► bit.ly/2ZHFSGX
MOBILE TESTING ►bit.ly/2PxpeUv
PERFORMANCE TESTING
JMETER BEGINNER ► bit.ly/2oBbtIU
JMETER INTERMEDIATE ► bit.ly/2oziNVB
JMETER ADVANCED ► bit.ly/2Q22Y6a
JMETER TIPS & TRICKS ► bit.ly/2NOfWD2
GATLING ► bit.ly/3QrWfkV
IDE
ECLIPSE ► bit.ly/3AnRhQP
INTELLIJ IDEA ► bit.ly/3AnyDZ8
PROGRAMMING
JAVA BEGINNERS ► bit.ly/2PVUcXs
JAVA TIPS & TRICKS ► bit.ly/2CdcDnJ
GROOVY ► bit.ly/2FvWV5C
JAVASCRIPT ► bit.ly/2KJDZ8o
TYPESCRIPT ► bit.ly/3dvJBmz
PYTHON ► bit.ly/2Z4iRye
BUILD TOOLS
MAVEN ► bit.ly/2NJdDRS
GRADLE ► bit.ly/30l3h1B
SOURCE CODE MANAGEMENT
GIT & GITHUB ►bit.ly/2Q1pagY
GITLAB ► bit.ly/2kQPGyQ
CLOUD SERVICES
BROWSERSTACK ► bit.ly/3w7kxZn
SAUCELABS ► bit.ly/3w7kAo1
LAMBDATEST ► bit.ly/3C6TBwM
JSON ► bit.ly/3w450tq
XML ► bit.ly/3PqRneH
VIRTUALIZATION ► bit.ly/2SItIL9
MOCK INTERVIEWS ► bit.ly/3QGwwVJ
SUNDAY SPECIAL ► bit.ly/2wB23BO
GITHUB PROJECTS ► github.com/Raghav-Pal/
STORIES BY RAGHAV ► automationstepbystep.com/stor...
Every LIKE & SUBSCRIPTION gives me great motivation to keep working for you
You can support my mission for education by sharing this knowledge and helping as many people as you can
If my work has helped you, consider helping any animal near you, in any way you can
NEVER STOP LEARNING
Raghav Pal
Well explained. This series will be very helpful whoever wants to learn Playwright. I am expecting all videos run time will be like.
That's the plan!
Once again Raghav nails this introduction.. best on the web by far
Thanks a lot
A very well spoken and super informative series of tutorials, this has been helping me so much as I'm learning, thank you!!!
Great to know this.. keep learning
Wow, the information you give is great. In the first video, usually tutorials will label a few generic benefits to using it, but you really went into detail on things. This second video is really starting to impress me with your teaching.
Are you a licensed teacher? You talk like an experienced programmer and teacher. You explain everything that would be a possible question, before anyone even asks the question! Very informative, very good. You are the most impressive teacher online, doing this all on a 50GB hard drive with 3FPS ahahaha.
Thanks a lot for the kind words and feedback. Humbled.
I have been a follower of this channel from the day, I shifted into IT. I have learnt a lot from here. highly respect your concern on developing from the base. Pls proceed with these kind of tutorials.
Much appreciated Dushan
Hi you have helped me understand alot since i started learning playwright testing thank you so much
Most welcome
That very first mouse click was all I needed. I'm using the Python version. Thank you!!!! (Didn't see that first dropdown...)
Glad it helped James
Very clear and simple ! thank you
Most welcome
@@RaghavPal can you sir give me a roadmap to master automation testing ? Thank you
I will do a session
Wow Excellent Tutorial for Me. thanks for this.
Most welcome
Great tutorial! Keep up the good work.
Thanks a lot
Thank you so much! You are the best tutor!
Thanks a lot Irina
This is a great video . Thanks! Raghav.
Most welcome Chandanprasad
Very effective Thanks a lot sir 🙏
Most welcome Manoj
Really appreciated for sharing.
Glad you enjoyed it
Thanks Raghav. Scored 4/5
Well done Mohan
Awesome explanation. Very useful for the beginners who wants to get into automation. Can you also please do a series with C#?
Thanks a lot..I will plan
super, well explained
Glad you liked it Vanaja
Awesome explanation. Very helpful for the beginners who wants to learn automation. Can you please also do the series with C#?
Sure, will plan on this.. thanks for watching
Thank you Raghav 👍
My pleasure Akif
Very informative.Thank you
I don't see any quiz questions on playwright in your website .other topics it's present
I just started with the course..Can you add more Project examples for playwright using bdd framework.That helps in practical for beginners in automation with playwright
Interview questions and answers on playwright
Sandhya
For playwright you can find QUIZ link in the description of the videos
Thanks,
Got 5 in the Quiz
Good, all the best for next Anil
very good session, mate. Thank you. And may I know which software you are using for your presentation like to share you desktop and showing camera at the same time in a single screen?
Thanks Ravi, I use mac annotation tools
Thank you, Quiz score 4/5
Great score
I scored 4/5, I failed the first question. The answer was both.
Thank you so much for this, it's been really helpful.
Most welcome
Hi sir. firstly your way of explaining and teaching is really the best among all.
I got an issue with WebKit sometimes the execution gets failed either in headed or nonheaded mode.
Hi Sai, thanks. you will need to check the logs. Can also increase timeout in config file
@@RaghavPal Thank you sir
Thank you for the detailed sessions.
You explained 2 installations "Install using npm package" and "Install using VS code extension" , what the difference is between?
Suman
Let's explore the difference between installing Playwright using the npm package and using the VS Code extension:
1. Install Using npm Package:
- Functionality: When you install Playwright via npm (`npm install -D @playwright/test@latest`), it adds Playwright as a development dependency to your project.
- Usage: You can import Playwright in your test scripts and use it directly within your project.
- Browser Binaries: You'll need to download browser binaries and their dependencies separately using `npx playwright install --with-deps`.
- Project Scope: Limited to the specific project where you installed it.
2. Install Using VS Code Extension:
- Functionality: The Playwright VS Code extension includes a recent copy of the `@playwright/test` npm package.
- Usage: If you don't have Playwright installed via npm in your project, the extension uses its internal copy of Playwright.
- Browser Binaries: The extension handles browser binaries automatically.
- Project Scope: Available globally within VS Code for all projects.
In summary, both methods work, but the extension simplifies setup and provides a global Playwright instance within VS Code. Choose based on your project's needs
--
Thanks!
Thanks a lot Deepthi
thank you for the series 🙏 I want to use playwright with python, do you have any content or suggestion?
Hi E K,
Not for now, You can still watch the 1st few tutorials and then can follow the Python steps from the official documentation. I will plan to do a session on this
Thankyou for starting this series on Playwright sir. Can you please answer below queries:
1. Which programming language will you be using in this series ?
2. Will you be covering Framework part as well in this series ?
3. How long will it take for all the videos of this series to be on your RUclips channel ? Just asking so that we can plan our learning accordingly.
Thankyou in advance. 😊
Hi Hitesh,
1. Which programming language will you be using in this series ?
I will start with JavaScript, but will also do other languages in future. In any case the playwright concepts and actions will remain same
2. Will you be covering Framework part as well in this series ? Yes
3. How long will it take for all the videos of this series to be on your RUclips channel ? Just asking so that we can plan our learning accordingly.
I am planning to add all videos within 2-3 weeks
Thankyou sir, this helps. 😊
@@RaghavPal Only with javascript or Typescript also?
I will do session with TypeScript too, in any case you can follow the current sessions too
Hi Raghav, Nice session on playwright , Can you pls suggest which framework is better playwright or Cypress, as both are gaining a lot of traction. We have to create an automation framework from scratch for testing MERN based app.
Hi Sumit, you will need to understand the key differences between Playwright and Cypress, and then evaluate against your needs
Here are a few things that you should know that will help you in your selection:
*Browser support* : Both Playwright and Cypress support multiple web browsers (Chrome, Firefox, Safari and Edge), but Playwright also supports mobile browsers (iOS and Android)
*Programming Language* : Both Playwright and Cypress are built on JavaScript. Playwright allows you to write tests in JavaScript, TypeScript and Python, Java, C#
Cypress, supports JavaScript & TypeScript for now
*Concurrency* : Playwright allows you to run tests concurrently in multiple browsers, while Cypress only allows you to run tests in a single browser at a time
*API* : Both Playwright and Cypress have similar APIs for interacting with web pages and automating tasks. However, Playwright has more powerful and expressive APIs, it also supports modern web standards such as WebAssembly and WebRTC
*Test running* : Cypress uses a specialized Test Runner that runs in the browser, Playwright does not need a specialized Test Runner
*Debuggability* : Cypress has a built-in dashboard and a powerful debugging tool that allows you to easily debug test failures. Playwright, on the other hand, does not have a built-in dashboard, but it provides the ability to attach a browser's dev tools to debug the tests
*Time-travel* : Cypress has a unique feature called "Time-travel" that allows you to see the state of your application at any point in time during a test. Playwright does not have this feature
When choosing between Playwright and Cypress, you should consider the specific requirements of your project and the features you need.
If you need to test multiple browsers simultaneously, or mobile browsers, Playwright may be a better choice. If you need to debug your tests easily or need the "Time-travel" feature, Cypress may be a better choice
It's worth noting that both frameworks are actively developed and have a large community, so you can always get support and find solutions for any issues you may encounter
It's also a good idea to consult with a developer experienced with end-to-end testing and familiar with both frameworks, to help you choose the best tool for your needs
@@RaghavPal Thank you so much for your response. Sure , will work on your suggestions.
Good initiative and explanation. Thanks for your teaching. Can you upload playwright playlist with python also?
I will do Parthi, thanks for watching
@@RaghavPal this is helpful , please upload the playwright playlist with python series
Hi Raghav? Which language is recommended to use with playwright? And your suggestion ?
Jagadeesh
Playwright supports multiple languages, and the choice depends on your familiarity and project requirements. Here are the recommendations:
1. JavaScript and TypeScript:
- Playwright for Node.js has its own test runner with parallelization, screenshot assertions, and more.
- TypeScript is recommended for its strong type system and better tooling support
2. Python:
- Use the Playwright Pytest plugin for end-to-end tests. It provides context isolation and runs on multiple browser configurations
3. Java:
- Choose a testing framework like JUnit or TestNG based on your project needs
4. .NET:
- Playwright for .NET includes NUnit and MSTest base classes for writing end-to-end tests
Ultimately, pick the language you're most comfortable with and project needs
-
Hi, I want to know scope of playwright, is it important/ famous same as selenium.
Playwright has some awesome features and it will gain momentum soon, Not as popular as Selenium for now, as it is very new compared to Selenium
sir can u guide which language should I learn to start career in QA ? PYTHON , JAVA OR ANY OTHER ? it will be very helpful
Can start with Java, Python
Hey when doing "testing: focus on playwright view" Visual studio is telling me "no test cases have been found in this workspace yet" i just updated to the latest version of node but that isnt working do you know what this could be due to ?
Michael
there are a few possible reasons why you might be getting the "No test cases have been found in this workspace yet" message in Visual Studio when you run the "testing: focus on playwright view" command.
* You may not have any Playwright tests in your workspace. To create a Playwright test, you need to create a new file with the .spec.ts extension and import the `@playwright/test` module
* The Playwright extension may not be installed or enabled in Visual Studio. To install the Playwright extension, open the Extensions view (Ctrl+Shift+X) and search for "Playwright Test for VSCode". Click the Install button to install the extension
* The Playwright configuration file may not be set up correctly. The Playwright configuration file is called playwright.config.js and it is located in the root of your workspace. The configuration file tells Playwright how to find and run your tests.
Here are some things you can check to troubleshoot the issue:
* Make sure you have at least one Playwright test in your workspace.
* Check if the Playwright extension is installed and enabled in Visual Studio.
* Open the playwright.config.js file and make sure it is set up correctly.
If you are still having trouble, you can try the following:
* Restart Visual Studio.
* Clear the Playwright cache. To do this, open the Command Palette (Ctrl+Shift+P) and type "Playwright: Clear Cache".
* Reinstall the Playwright extension.
I hope this helps
Can you also talk about limitations of Playwright? And can we integrate BrowserStack with PlayWright ?
Sure, will have a session
At minute 23:40 there is an option to run the test (Testing: Focus on Playwright View) but if I type "playwright" or "testing" I can't see that option, did I forget to do something else? Thanks
Jorge
Check after getting this extension playwright.dev/docs/getting-started-vscode#installation
Hello, Raghav, When I try to type, the sentence "require('@playwright/test')", It shows this message, "File is a CommonJS module; it may be converted to an ES module.ts(80001)"
var require: NodeRequire
(id: string) => any (+3 overloads)".
What I should to do ?. Thank you!!!
Susel
For the issue with the "File is a CommonJS module; it may be converted to an ES module" error you're encountering when using `require('@playwright/test')`. This error arises because you're trying to import a CommonJS module (`@playwright/test`) using the `require` syntax, which is typically used for CommonJS modules, in an ES module (likely a TypeScript file).
Solutions:
There are two primary approaches to resolve this issue:
1. Import Syntax for ES Modules:
- Since you're likely working with an ES module (indicated by the `.ts` extension and the TypeScript error code `ts(80001)`), use the `import` syntax to import ES modules:
```typescript
import { test } from '@playwright/test';
```
This approach is the recommended way to import modules in modern JavaScript environments that support ES modules.
2. `require` with Interop Compatibility (Less Common):
- If you have a specific reason to use `require` (e.g., working with a mixed codebase of CommonJS and ES modules), you can leverage TypeScript's interop capability. However, this approach is generally not preferred as it can lead to compatibility issues:
```typescript
const { test } = require('@playwright/test').default; // Accessing the default export
```
Important Note: This approach might require additional configuration or type definitions depending on your project setup.
Additional Considerations:
- TypeScript Project Setup: Ensure your TypeScript project is configured to handle ES modules correctly. You might need to adjust your `tsconfig.json` file to set the `module` option to `esnext` or `commonjs`.
- Package Manager: Verify that you've installed `@playwright/test` using a package manager that supports ES modules, such as npm or yarn.
Hi Raghav,Which combination is best to learn with playwright?Playwright with java,javscript or typescript?
When it comes to learning Playwright, you have a few language options to choose from. Let's explore them:
1. Playwright with TypeScript:
- Advantages:
- Playwright was originally built on top of Puppeteer (which controls Chrome) and has since expanded its support to multiple languages, including TypeScript.
- TypeScript provides static typing, better tooling, and improved code quality.
- Playwright's official documentation and examples often use TypeScript.
- Recommended for: Developers who prefer strong typing and want to leverage TypeScript's features.
- IDE Recommendation: Visual Studio Code (VS Code) is a great choice for TypeScript development
2. Playwright with JavaScript (Node.js):
- Advantages:
- JavaScript is widely used and has a large community.
- If you're already comfortable with JavaScript, this might be the quickest path.
- Playwright's JavaScript API is similar to Puppeteer's, making the transition easier.
- Recommended for: Developers familiar with JavaScript or Node.js.
- IDE Recommendation: VS Code is also a good choice for JavaScript development.
3. Playwright with Java:
- Advantages:
- Java is a mature language with extensive libraries and frameworks.
- If you're already proficient in Java, this could be a good fit.
- However, Playwright with Java might have some limitations compared to TypeScript or JavaScript.
- Recommended for: Java developers who want to explore Playwright.
- IDE Recommendation: IntelliJ IDEA or Eclipse for Java development.
Ultimately, the best choice depends on your existing skills and preferences. TypeScript is a strong contender due to its type safety and alignment with Playwright's features. JavaScript is a safe bet if you're already comfortable with it. Java can work well if you're specifically interested in exploring Playwright with Java
-
@@RaghavPal Thank you so much :)
Legend
Thanks for watching
Hi, Raghav. Could you make a tutoring about playwright automation testing for the Electron application, please? Thank you! 🙂
I will plan Elena
sir while installing using VS code extension why it as taken typescript directly not asked for js or ts? also we have not selected options for github actions also
You can still continue, the extension will work even if you are using JS as shown in the video and it's okay for not having github actions for now, It creates a github yaml file, that you can add separately only when you have to do github workflow ci cd, else not needed
@@RaghavPal thanks a lot sir.
Hi Raghav,
I am getting the below error.
-npm : The term '-npm' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if a path
was included, verify that the path is correct and try again.
At line:1 char:1
+ -npm init playwright@latest
+ ~~~~
+ CategoryInfo : ObjectNotFound: (-npm:String) [], CommandNotFoundException
+ FullyQualifiedErrorId : CommandNotFoundException
Please suggest.
Sagar
The error message `'npm' is not recognized as an internal or external command, operable program or batch file.` means that your computer cannot find the `npm` command. This can happen for a few reasons:
* `npm` is not installed on your computer.
* The `npm` installation directory is not in your PATH environment variable.
* You are using the wrong command to run `npm` commands.
To fix this error, you can try the following:
1. **Make sure that `npm` is installed on your computer.** You can download `npm` from the official website.
2. **Add the `npm` installation directory to your PATH environment variable.** This will tell your computer where to find the `npm` command. To do this, follow these steps:
* Open the Control Panel.
* Click on System and Security.
* Click on System.
* Click on Advanced system settings.
* Click on Environment Variables.
* Under System variables, find the Path variable and double-click on it.
* At the end of the Path variable value, add a semicolon (;) followed by the full path to the `npm` installation directory. For example, if you installed `npm` to the directory `C:\Program Files
odejs`, you would add `;C:\Program Files
odejs` to the Path variable value.
* Click OK to save your changes.
3. **Restart your computer.**
Now, you should be able to run `npm` commands in a terminal. To initialize a Playwright project, you can run the following command:
```
npm init playwright@latest
```
If you are still getting the error message after following these steps, you can try the following:
* Make sure that you are using the correct command to run `npm` commands. The `npm` command is simply `npm`.
* Try restarting your computer.
* Try reinstalling `npm`.
If you are still having trouble, please post a question on Stack Overflow or the Playwright community forum.
Additionally, you can try running the following command to install Playwright:
```
npx playwright install
```
This does not require `npm` to be installed on your computer.
Hey Raghav "npx playwright test .\tests\example.spec.js" says "No tests found". Can you pls help here?
Santhosh
Try to replace backslashes \ with forward slashes / in the path, Also check the path is correct by writing few letters of the folder/file name and press tab to auto complete
Sir Please create video on installation using Java and test cases run using java language
I will plan
Hi Raghav, I am getting some certificate error for browser while running npm init install in my office laptop. Due to which I am unable to run my script on any browser.
Could you please suggest how to handle this.
Hi Ankit
here are some suggestions on how to handle the certificate error for browser while running npm init install in your office laptop:
1. Check the date and time on your laptop. The certificate error may be caused by the date and time on your laptop being incorrect. To check the date and time, open the Control Panel and go to the "Date and Time" section. Make sure that the date and time are correct.
2. Add the website's certificate to your laptop's trusted certificates store. The certificate error may be caused by the website's certificate not being trusted by your laptop. To add the website's certificate to your trusted certificates store, open the Control Panel and go to the "Internet Options" section. Click on the "Content" tab and then click on the "Certificates" button. In the "Trusted Root Certification Authorities" store, click on the "Import" button and then select the website's certificate file.
3. Use a different browser. The certificate error may be specific to the browser that you are using. To try to resolve the issue, try using a different browser, such as Chrome or Firefox.
4. Contact your IT department. If you are still unable to resolve the issue, you may need to contact your IT department for assistance. They may be able to help you troubleshoot the issue and resolve the certificate error.
Here are some additional things to keep in mind:
* The certificate error may be caused by other factors, such as a problem with your internet connection.
* It is always a good idea to check the documentation for the website that you are trying to access to see if they have any specific instructions on how to resolve certificate errors.
*
I hope this helps
Sir can i start learning play write even if don't know node js and js. Is it mandatory?
Yes
@@RaghavPal Thanks a lot sir, I will continue watching playwright videos. Thanks a lot for sharing your knowledge sir
is it required to install node.js if i am setting up playwright for python setup ?
which IDE is best recommended ?
For python you can use pip
You can use Pycharm , VS Code
@@RaghavPal thanks for making clear...i could not find anywhere where they have described pre-requisite for playwright setup for different programming languages - it was helpful - so python playwright has no dependency on node.js (but to make clear - the whole playwright tool works based on node.js protocols right ?)
you can find documentation on Playwright with Python here - playwright.dev/python/docs/intro
Hi, I want to learn automation for Salesforce, can you recommend what should I learn like playwright, provar or something else?
Pranali
here are some recommended tools for learning automation for Salesforce:
*1. Selenium with Salesforce Lightning Web Components (LWC):*
Selenium is a widely used open-source automation framework that supports various web browsers and programming languages. It's a popular choice for automating Salesforce, especially for legacy UI elements. To automate LWC components, you'll need to use Salesforce's Lightning Web Components Jest driver alongside Selenium.
*2. Cypress:*
Cypress is another popular automation framework that offers a modern and user-friendly approach. It provides a visual test builder, automatic DOM manipulation, and time travel debugging, making it easier to test complex UIs. Cypress is well-suited for automating Salesforce Lightning Experience and Aura applications.
*3. Playwright:*
Playwright is a newer automation framework developed by Microsoft. It offers cross-browser support, parallel execution, and advanced features like network interception and geolocation spoofing. Playwright is a powerful tool for automating Salesforce applications, especially when dealing with complex interactions and multiple browsers.
*4. Provar:*
Provar is a Salesforce-specific automation framework developed by Salesforce itself. It provides a declarative testing language tailored for Salesforce objects and processes. Provar is a good choice for automating Salesforce business processes and data-driven testing.
*5. Salesforce UI Test Automation Framework (UAT):*
UAT is a Salesforce-provided framework that offers a visual test builder, record-and-replay functionality, and integrations with Salesforce development tools. UAT is a good choice for beginners and those who prefer a visual test creation approach.
In addition to these tools, consider using Salesforce-specific features like Salesforce's Testing Service and Salesforce's Data Loader for data-driven testing.
Here's a summary of each tool's strengths:
*Selenium:* Mature and widely supported, good for legacy UI elements.
*Cypress:* Modern and user-friendly, good for Lightning Experience and Aura applications.
*Playwright:* Powerful and versatile, good for complex interactions and multiple browsers.
*Provar:* Salesforce-specific, good for business processes and data-driven testing.
*UAT:* Visual and easy to use, good for beginners and Salesforce development integrations.
The best tool for you will depend on your specific needs, experience level, and project requirements. Consider factors like:
* **Your programming language proficiency:** If you're familiar with JavaScript, Cypress or Playwright might be a good choice. If you prefer a declarative approach, Provar could be suitable.
* **Your project scope:** If you're automating legacy UI elements, Selenium might be a good fit. If you're mainly dealing with Lightning Experience or Aura applications, Cypress could be a better choice.
* **Your team's experience:** If you have beginners on your team, UAT could be a good starting point. If you have experienced automation engineers, Playwright could provide more flexibility and power.
Remember, learning automation takes practice and experimentation. Try out different tools, explore tutorials and documentation, and seek help from the community when needed.
Do you have Provar training videos? It would be really very very helpful if you can guide me to learn Provar@@RaghavPal
I will check and plan
Thank you so much, Requesting you to plan this asap as I have gone through your Playwright training sessions and they are very helpful for me, As a beginner you make it very easy to understand.
I am not well versed in programming, can I still do automation or will I have to learn coding first?
Yes, you can, just learn as you go and if you can learn some very basics of the programming language you are using in your project.
@@RaghavPal My company uses Python with Selenium. The problem is, I have no opportunity to learn it on the job. We have 1 or 2 automation testers that do everything. 1 in the US. 1 in India. I have to learn Python and Selenium on my own.
You can take out some time daily and learn with online lectures.. Can find my lectures here - automationstepbystep.com/
Wow, thank you!
Most welcome Viktor
Hi Raghav, I have installed Ruby and Node JS for my purposes but after successfully installing playwright I do not seem to have the playwright.config.js file in root folder, or anywhere else. Should it be created automatically on install? Any idea where it could be or how to find it? Thanks in advance.
Here's how you can create the config file:
1. Manual Creation:
- If the `playwright.config.js` file is not automatically generated during installation, you can create it manually in your project's root folder.
- Open your text editor or IDE and create a new file named `playwright.config.js`.
- Inside this file, you'll define your test configuration, including options like test directories, browsers, reporters, and more.
2. Basic Configuration Example:
- Below is a basic example of a `playwright.config.js` file. You can customize it according to your project's needs:
```javascript
const { devices } = require('@playwright/test');
module.exports = {
// Look for test files in the "tests" directory, relative to this configuration file.
testDir: 'tests',
fullyParallel: true, // Enable parallel execution of tests
forbidOnly: !!process.env.CI, // Fail CI builds if test.only is accidentally left in the code
retries: process.env.CI ? 2 : 0, // Retry failed tests (useful for CI)
reporter: 'html', // Choose a test reporter (e.g., 'html', 'dot', 'list')
use: {
baseURL: '127.0.0.1:3000', // Set your base URL
trace: 'on-first-retry', // Collect traces when retrying failed tests
},
projects: [
{
name: 'chromium',
use: {
...devices['Desktop Chrome'], // Use Chrome as the browser
},
},
// Add other browser configurations as needed
],
webServer: {
command: 'npm run start', // Command to start your web server
url: '127.0.0.1:3000', // URL where your app is hosted
reuseExistingServer: !process.env.CI, // Reuse existing server during local development
},
};
```
- Adjust the settings in this configuration file based on your project's specifics.
3. Folder Structure:
- Ensure that your test files (usually with `.spec.js` or `.spec.ts` extensions) are located in subfolders within the specified `testDir`.
- For example, if your tests are in a folder called `smokeTests`, make sure the structure is like this:
```
├── playwright.config.js
└── tests
└── smokeTests
├── test1.spec.js
├── test2.spec.js
└── ...
```
4. Run Tests:
- Once you've created the configuration file, you can run your tests using the following command:
```
npx playwright test
```
Remember to adjust the configuration according to your project's needs, and you should be all set! If you encounter any issues, feel free to ask for further assistance.
..
@@RaghavPal Hi Raghav, thanks for the reply and the solution. Will follow instructions. Thank you.
I just installed all the latest software and do not have a playwright.yml file, the timeout code is not in the config file. I'm only at 16:23 into the video. Hope this will not be an issue following more of this playwright series of videos :(
Let's clarify how to set timeouts for your Playwright tests:
1. Test Timeout:
- By default, each test in Playwright has a timeout of 30 seconds.
- This timeout includes the time spent executing the test function, as well as any fixtures, `beforeEach`, and `afterEach` hooks.
- If a test exceeds this timeout, it will produce an error.
- You can adjust the test timeout by modifying the configuration.
2. Global Timeout:
- Playwright Test also supports a global timeout for the entire test run.
- This prevents excessive resource usage when something goes wrong.
- There is no default global timeout, but you can set a reasonable one in the configuration.
- For example, you can set a global timeout of one hour (3600 seconds) in your configuration.
3. Configuration Example:
- To configure timeouts, create or modify your `playwright.config.ts` file (or equivalent if using plain JavaScript).
- Here's an example of setting both test and global timeouts:
```typescript
// playwright.config.ts
import { defineConfig } from '@playwright/test';
export default defineConfig({
timeout: 5 * 60 * 1000, // Set test timeout to 5 minutes
globalTimeout: 60 * 60 * 1000, // Set global timeout to 1 hour
});
```
4. Usage in Tests:
- You can also adjust timeouts for individual tests, hooks, or fixtures.
- For example:
- To set a longer timeout for a specific test: `test.setTimeout(120000);`
- To extend the timeout for all tests running in a `beforeEach` hook: `testInfo.setTimeout(testInfo.timeout + 30000);`
Remember to customize the timeouts according to your specific needs.
I have installed all the prerequisites and trying to install Playwright and I am having an error while installing playwright on VSC editor. It says"npm : The term 'npm' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the
spelling of the name, or if a path was included, verify that the path is correct and try again.
At line:1 char:1
+ npm init playwright@latest" where did I go wrong?
The error message you're encountering, "npm : The term 'npm' is not recognized as the name of a cmdlet, function, script file, or operable program," indicates that the `npm` command-line interface (CLI) is not recognized or properly installed on your system. Let's troubleshoot this issue:
1. Check Node.js Installation:
- First, ensure that Node.js is correctly installed on your system. You mentioned that you've installed all prerequisites, but let's verify that Node.js is indeed installed.
- Open a command prompt or terminal and type the following command:
```
node -v
```
- If it displays the Node.js version (e.g., `v14.17.0`), Node.js is installed correctly. If not, download and install Node.js from the official website: [Node.js Downloads](nodejs.org/en/download/).
2. Restart Your System:
- Sometimes, changes to environment variables (like adding Node.js to the system PATH) require a system restart to take effect.
- Restart your computer to ensure that any changes you've made are applied.
3. Add Node.js and npm to PATH:
- The issue might be related to the system PATH not including the path to Node.js and npm.
- Follow these steps to add Node.js and npm to your system PATH:
- Open the Control Panel.
- Click on "System" or "System and Security."
- Click on "System Info" or "System Properties."
- Click on "Advanced system settings" (usually on the left sidebar).
- In the "System Properties" window, click the "Environment Variables" button.
- Under "System variables," find the "Path" variable and click "Edit."
- Add the following paths (if not already present):
```
C:\Program Files
odejs
C:\Users\\AppData\Roaming
pm
```
Replace `` with your actual Windows username.
- Click "OK" to save the changes.
- Close and reopen any command prompts or terminals.
4. Verify npm Installation:
- After adding Node.js to the PATH, open a new command prompt or terminal.
- Type the following command:
```
npm -v
```
- If it displays the npm version (e.g., `7.24.0`), npm is installed correctly.
5. Try Again:
- Now that you've added Node.js and npm to the PATH, try running the Playwright installation command again:
```
npm init playwright@latest
```
- It should work without any issues.
Remember to restart your system after making changes to the environment variables
--
I am not able to see the tests folder in test explorer. Please help
I will check, May be some changes in new version
Hello Raghav,
I need to automate Microsoft dynamics 365 apps via playwright with C# dotnet . Could you pls guide with setup and configurations ?
ok Meeta
Here's a step-by-step guide to get you started:
Step 1: Install required packages
In your.NET project, install the following NuGet packages:
* `Microsoft.Playwright` (latest version)
* `Microsoft.Playwright.Chromium` (latest version)
You can install these packages using the NuGet Package Manager in Visual Studio or via the.NET CLI:
```
dotnet add package Microsoft.Playwright
dotnet add package Microsoft.Playwright.Chromium
```
Step 2: Import required namespaces
In your C# code file, import the following namespaces:
```csharp
using Microsoft.Playwright;
using Microsoft.Playwright.Chromium;
```
Step 3: Launch the browser
Create a new instance of the `Playwright` class and launch a Chromium browser instance:
```csharp
using var playwright = await Playwright.CreateAsync();
var browser = await playwright.Chromium.LaunchAsync(headless: false);
```
Note: Set `headless` to `false` to see the browser in action. For production, you can set it to `true` to run the browser in headless mode.
Step 4: Create a new browser context and page
Create a new browser context and page:
```csharp
var context = await browser.NewContextAsync();
var page = await context.NewPageAsync();
```
Step 5: Navigate to Dynamics 365 app
Navigate to your Dynamics 365 app URL:
```csharp
await page.GotoAsync("your-dynamics-365-app-url.com");
```
Replace `your-dynamics-365-app-url.com` with your actual Dynamics 365 app URL.
Step 6: Authenticate with Dynamics 365
Authenticate with your Dynamics 365 app using credentials or any other authentication mechanism:
```csharp
// Example: Authenticate using username and password
await page.FillAsync("input[name='username']", "your-username");
await page.FillAsync("input[name='password']", "your-password");
await page.ClickAsync("button[type='submit']");
```
Replace `your-username` and `your-password` with your actual credentials.
Step 7: Perform actions on the Dynamics 365 app
Now you can perform actions on the Dynamics 365 app using Playwright's API. For example, you can click on a button, fill out a form, or extract data from the page:
```csharp
// Example: Click on a button
await page.ClickAsync("button:text('Click me')");
// Example: Fill out a form
await page.FillAsync("input[name='field1']", "value1");
await page.FillAsync("input[name='field2']", "value2");
// Example: Extract data from the page
var text = await page.InnerTextAsync("div:class('data-container')");
Console.WriteLine(text);
```
Step 8: Close the browser
Finally, close the browser instance:
```csharp
await browser.CloseAsync();
```
That's it! You've successfully set up and configured Playwright with C#.NET to automate Microsoft Dynamics 365 apps.
Remember to replace the placeholders with your actual values and adjust the code according to your specific requirements
-
@@RaghavPal :- thankyou so much Raghav. Appreciate your help.. Also I would like to know how can I encrypt the credentials in the scripts.. I don't want to reveal the password in the scripts as I have to login from my Microsoft official account to dynamics CRM. Could you pls guide on this ?
Let's break down the problem step by step and find a solution.
Step 1: Identify the encryption options
To encrypt your credentials, you have a few options:
a. Environment Variables: You can store your credentials as environment variables on your system. This way, your script can access the credentials without hardcoding them.
b. Configuration Files: You can store your credentials in a configuration file (e.g., appsettings.json or web.config) and encrypt the file using a secure encryption method.
c. Secure Storage: You can use a secure storage mechanism like Azure Key Vault, HashiCorp's Vault, or a similar service to store your credentials.
d. Windows Credential Manager: On Windows, you can use the Windows Credential Manager to store your credentials securely.
Step 2: Choose an encryption option
For this example, let's choose option b, Configuration Files, as it's a simple and widely-used approach.
Step 3: Implement encryption using configuration files
In your C#.NET project, create a configuration file (e.g., appsettings.json) with the following structure:
```json
{
"DynamicsCrm": {
"Username": "your_username",
"Password": "your_password"
}
}
```
Step 4: Encrypt the configuration file
To encrypt the configuration file, you can use the `Microsoft.Extensions.Configuration` NuGet package. Specifically, you'll use the `ChainedTokenProvider` class to encrypt the configuration file.
In your C# code, add the following using statements:
```csharp
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.Configuration.Json;
```
Create a method to encrypt the configuration file:
```csharp
private static void EncryptConfigFile(string configFilepath)
{
var config = new ConfigurationBuilder()
.AddJsonFile(configFilepath, optional: false)
.Build();
var tokenProvider = new ChainedTokenProvider(
new[] { new JsonWebTokenProvider() }
);
var encryptedConfig = tokenProvider.Protect(config["DynamicsCrm:Username"]);
config["DynamicsCrm:Username"] = encryptedConfig;
encryptedConfig = tokenProvider.Protect(config["DynamicsCrm:Password"]);
config["DynamicsCrm:Password"] = encryptedConfig;
var jsonConfig = new JsonConfigurationFile();
jsonConfig.Write(config, configFilepath);
}
```
Call this method to encrypt the configuration file:
```csharp
EncryptConfigFile("appsettings.json");
```
Step 5: Read encrypted credentials in your script
In your Playwright script, read the encrypted credentials from the configuration file:
```csharp
var config = new ConfigurationBuilder()
.AddJsonFile("appsettings.json", optional: false)
.Build();
var username = config["DynamicsCrm:Username"];
var password = config["DynamicsCrm:Password"];
// Decrypt the credentials
var tokenProvider = new ChainedTokenProvider(
new[] { new JsonWebTokenProvider() }
);
username = tokenProvider.Unprotect(username);
password = tokenProvider.Unprotect(password);
// Use the decrypted credentials to log in to Dynamics CRM
```
By following these steps, you've successfully encrypted your credentials in the script using a configuration file. When you run your Playwright script, it will read the encrypted credentials, decrypt them, and use them to log in to Dynamics CRM
-
@@RaghavPal thanks Raghav for detailed answer.
Can we automate web applications integrated with ArcGis maps tool?
Hi Raja, I will need to check on this. Have not worked on it yet
Hi after giving the comment I am gettingan error i.e. npm is not recognised-as the name of a cmdlet, function, script file or operable program.
May I know the reason for the above error?
Hi Kajal, this can help - www.webdevtutor.net/error-solutions/npm-the-term-npm-is-not-recognized-as-the-name-of-a-cmdlet-function-script-file-or-operable-program
I cannot find the playwright view option once i search with command + shift + p could you advice please
Asmaa
Playwright doesn't have a view option accessible directly through the Command + Shift + P shortcut since it doesn't have a built-in UI like web browsers. However, depending on how you're using Playwright, there are different ways to view the results of your tests:
1. Browser Debugger:
* If you're running Playwright tests in a browser (like Chromium, Firefox, WebKit), you can use the browser's developer tools to inspect the page, network requests, console logs, and other information. Each browser has its own way to access the developer tools, usually by pressing F12 or similar keys.
2. Trace Viewer:
* Playwright has a built-in Trace Viewer that allows you to visually explore recorded traces of your tests. You can record traces with the `trace: 'on'` option in your configuration and then open the Trace Viewer with `npx playwright view trace.json`. This allows you to step through each action taken by your test and see snapshots of the browser state at different points.
3. Console Output:
* Playwright logs test results and actions to the console by default. You can see this output in your terminal where you ran the playwright test command.
4. Reporting Tools:
* Several third-party reporting tools integrate with Playwright, providing visual dashboards and reports for test results. Popular options include Playwright Report, Allure Report, and QMetry. These tools will provide different ways to view test results depending on their specific features.
5. IDE Extensions:
* Some IDEs have extensions that provide specific integration with Playwright, offering debugging and visualization features within the IDE. For example, the VS Code Playwright extension offers debugging and trace viewing capabilities.
do u have playwright series with c#?
Not yet Arpita
Could you please create a playwright series with c#
I will plan
I am good in python , so can i use pycharm as IDE for playwrite
Kalpana
While PyCharm's built-in support for Playwright is limited, here are some approaches you can combine to enhance your workflow:
1. Install Required Plugins:
- Maestro:
- This plugin integrates Playwright under the IntelliJ IDEA testing framework, providing features like running and debugging tests, viewing test results, and generating locators.
- Install it from the JetBrains plugin marketplace.
- Playwright for WebStorm:
- While designed for WebStorm, this plugin also works in PyCharm and adds basic Playwright project creation, file type support, and code completion.
- Install it from the JetBrains plugin marketplace.
2. Enable Experimental Web Support:
- Go to File > Settings > Languages & Frameworks > Web Technologies.
- Select "Enable JavaScript and Node.js support".
- This allows basic code completion and syntax highlighting for JavaScript/TypeScript files.
3. Create a Basic Playwright Project (If Needed):
- While PyCharm isn't tailored for Playwright projects, you can use the Maestro plugin's project creation wizard as a starting point.
- This might not provide all the bells and whistles of a dedicated Playwright IDE, but it can create a workable structure.
4. Leverage Other Python Tools:
- PyCharm's debugging capabilities excel in Python. Use `pdb` or print statements for JavaScript debugging when necessary.
- Consider external testing libraries like `pytest` or `unittest` for writing Python-based test suites that interact with Playwright.
5. Explore Alternatives:
- If extensive Playwright support is vital, consider other IDEs like WebStorm (from the same JetBrains family) or VS Code with dedicated Playwright extensions.
Remember:
- PyCharm primarily serves as a Python IDE, and its support for Playwright is not officially documented or actively maintained. You might encounter limitations or need workarounds.
Hi sir i am getting this error
npm : the term 'npm' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or path was include, verify that the path again correctly
npm init playwright@latest
Category info : objectnot found (npm:string) []
Fully qualified errorid : commandnot found exception
Here are the steps to troubleshoot and get npm working correctly:
1. Install Node.js:
- npm comes bundled with Node.js, so if you don't have Node.js installed, download and install it from the official website: [nodejs.org/](nodejs.org/)
- Follow the installation instructions for your operating system.
2. Check Environment Variables:
- Windows:
- Open System Properties > Advanced system settings > Environment Variables.
- Under "System variables", find "Path" and click "Edit".
- Ensure the path to your Node.js installation's "bin" directory is included (e.g., `C:\Program Files
odejs\bin`).
- If not, add it and click "OK".
- macOS/Linux:
- Open a terminal and run `echo $PATH` to view your PATH environment variable.
- If the Node.js "bin" directory is missing, add it to your PATH using a text editor like nano or vim.
3. Verify Installation:
- Open a new command prompt or terminal window.
- Type `npm -v` and press Enter.
- If npm is installed correctly, you'll see its version number.
4. Address Conflicts:
- If you have multiple Node.js versions, ensure you're using the correct one that has npm installed.
- Use tools like `nvm` (Node Version Manager) to manage multiple versions effectively.
5. Reinstall npm (if necessary):
- If npm is still not working, reinstall it using:
- `npm install -g npm`
6. Run the Command:
- Once npm is working, try running the command again:
- `npm init playwright@latest`
Additional Tips:
- Check for Typos: Double-check the command for any typos.
- Use Correct Command Prompt: Use the command prompt or terminal associated with the Node.js installation.
- Run as Administrator: If necessary, run the command prompt or terminal as an administrator.
Sir, Can you please add video for installation and running tests using python also.
I will plan
npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead. After writing the npm --version this message displays ok? or not?
Yes, it is okay if you see the message "npm WARN config global --global, --local are deprecated. Use --location=global instead." after you run npm --version
This message is simply informing you that the --global and --local options for npm are deprecated, and that you should use the --location=global option instead.
npm : The term 'npm' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if a path was
included, verify that the path is correct and try again.
At line:1 char:1
+ npm init playwright@latest
+ ~~~
+ CategoryInfo : ObjectNotFound: (npm:String) [], CommandNotFoundException
+ FullyQualifiedErrorId : CommandNotFoundException
I am getting this error please help
Hi Mr Seven
The error message suggests that the command 'npm' is not recognized by your system. This issue typically occurs when Node.js and npm (Node Package Manager) are not properly installed or not added to your system's PATH environment variable.
To resolve this issue, you can follow these steps:
1. Install Node.js: Ensure that you have Node.js installed on your system. You can download the latest version of Node.js from the official website (nodejs.org) and follow the installation instructions specific to your operating system.
2. Add Node.js and npm to PATH: During the installation of Node.js, there is an option to add Node.js and npm to your system's PATH environment variable. Make sure this option is selected, as it allows you to access Node.js and npm from any location in the command prompt.
3. Verify Installation: After installing Node.js, open a new command prompt window and run the following commands to verify the installation:
```
node -v
npm -v
```
These commands should display the versions of Node.js and npm installed on your system. If you still encounter an error, make sure to close and reopen any open command prompt windows to apply the changes to the PATH environment variable.
By following these steps, you should be able to resolve the 'npm' command not recognized error and successfully use npm for managing your packages and dependencies.
iam unable to access, run, execute the visual studio by using of playwright node js command.(im unable to install the playwright)
Pavan
I'm ready to assist you with troubleshooting the Playwright installation and Visual Studio integration issues. To provide the most effective guidance, please share the following information:
1. Specific Error Messages:
- When you attempt to install Playwright or run Node.js commands within Visual Studio, what exact error messages do you encounter? Please provide the full text of any errors or warnings.
2. Environment Details:
- Operating System: Which version of Windows are you using?
- Visual Studio Version: Which specific edition of Visual Studio are you using (e.g., Visual Studio 2022 Community, Visual Studio Code)?
- Node.js Version: What version of Node.js is installed on your system? You can check by running `node -v` in a terminal.
3. Installation Steps:
- Describe the exact steps you've taken to install Playwright. Did you use npm or yarn? Did you encounter any errors during the installation process?
4. Integration Methods:
- How are you attempting to use Playwright within Visual Studio? Are you using the Test Explorer, a custom task runner, or another method?
5. Code Snippets:
- If possible, share relevant code snippets from your Node.js scripts or Visual Studio project files that demonstrate how you're trying to integrate Playwright.
Once I have this information, I can provide more tailored troubleshooting steps. However, here are some general potential causes and solutions to consider:
Common Issues:
- Incorrect Node.js Path: Ensure Visual Studio is configured to use the correct Node.js installation where Playwright is installed. Check project settings and environment variables.
- Missing Dependencies: Verify that all required dependencies are installed using `npm install` or `yarn install` within your project directory.
- Test Explorer Configuration: If using Visual Studio's Test Explorer, ensure it's configured to recognize Playwright tests (usually by installing an appropriate extension or adding a configuration file).
- Permissions: Confirm that your user account has permissions to access the necessary files and folders.
- Conflicting Software: Temporarily disable antivirus or firewall software to rule out interference.
Hi Raghav,
Could you please make a video of playwright with Java.
I will do Sneha
Hi Raghav I was a manual functional tester with 7 years experience and 6 years of break. I got an opportunity to work in a small sample project s a Part of recruitment process. UI testing using playwright. I am newly starting to learn automation and playwright and hoping to complete the project. I reached at your video. If i can get any one-to-one help from your team as I learn and work that will be great help. Please respond.
Hi
You can check all sessions here
automationstepbystep.com/
Apart from this there is no live or 1-to-1 sessions. You can always ask your ques in comments
hi , i had an error : " Cannot find module 'C:\Users\velyh\AppData\Roaming
pm
ode_modules
pm\bin
pm-cli.js'", reinstall already node js
Dima
The error message you're encountering, "Cannot find module 'C:\Users\velyh\AppData\Roaming
pm
ode_modules
pm\bin
pm-cli.js'," indicates that the system cannot locate the specified module. Let's troubleshoot this issue:
1. Check Node.js Installation:
- Confirm that Node.js is installed correctly on your system.
- Open a command prompt and run:
```
node -v
```
- If it doesn't display the version, reinstall Node.js from the official website.
2. Check npm Installation:
- Verify that npm (Node Package Manager) is installed alongside Node.js.
- Run the following command to check npm's version:
```
npm -v
```
- If npm is missing, reinstall Node.js to ensure npm is included.
3. Update npm:
- Even if npm is installed, it's a good practice to update it to the latest version:
```
npm install -g npm
```
4. Check npm Global Modules Path:
- The error message suggests that npm is looking for the `npm-cli.js` module in the global modules path.
- Ensure that the global npm modules path is correctly set. You can check it using:
```
npm config get prefix
```
- It should point to a valid directory where npm global modules are installed.
5. Reinstall npm:
- If the global modules path is incorrect or npm is still not working, try reinstalling npm:
```
npm install -g npm
```
6. Clear npm Cache:
- Sometimes cached data can cause issues. Clear the npm cache:
```
npm cache clean --force
```
7. Check PATH Environment Variable:
- Confirm that the directory containing npm binaries is included in your system's PATH environment variable.
- If not, add it manually or reinstall Node.js to set it up correctly.
8. Run npm Repair:
- Run the following command to repair npm:
```
npm install -g npm@latest
```
9. Restart Command Prompt:
- After making any changes, close and reopen the command prompt to apply them.
10. Try a Different Terminal:
- If you're using a specific terminal (e.g., Git Bash), try using the default Windows Command Prompt or PowerShell.
Remember to replace `C:\Users\velyh\AppData\Roaming
pm
ode_modules
pm\bin
pm-cli.js` with the actual path where npm is installed.
..
Hi Raghav..I'm facing few difficulties to luanch the browser. Is there any way, we can coonect for sometime (It will be pay) please . It's urgent
Kanchan
I may not be able to do a live call. However I check all my comments and you can expect a reply within 24 hrs. Please let me know your issue here with all steps and details
for ndm i am getting this messege
(npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead)
this can help stackoverflow.com/questions/72401421/message-npm-warn-config-global-global-local-are-deprecated-use-loc
Hii , hope you are doing well .I need a help from you
Right now i have 1.5 years of testing experience in selenium Java and manual testing.
I would like to learn any AI powered automation testing tools
Could you please suggest any
Nishanth
Sure, I can help you with that. Here are some AI-powered automation testing tools that you can learn:
*Testim:* Testim is an AI-powered test automation platform that can automate web, mobile, and API tests. It uses machine learning to identify and automate repetitive tasks, and it can also generate test cases automatically.
*Applitools:* Applitools is an AI-powered visual testing tool that can automate the testing of UI elements. It uses machine learning to identify and compare UI elements, and it can also generate test cases automatically.
*Katalon Studio:* Katalon Studio is an AI-powered automation testing platform that can automate web, mobile, and API tests. It uses machine learning to identify and automate repetitive tasks, and it can also generate test cases automatically.
*Tricentis Tosca:* Tricentis Tosca is an AI-powered test automation platform that can automate web, mobile, and API tests. It uses machine learning to identify and automate repetitive tasks, and it can also generate test cases automatically.
*Testsigma:* Testsigma is an AI-powered test automation platform that can automate web, mobile, and API tests. It uses machine learning to identify and automate repetitive tasks, and it can also generate test cases automatically.
These are just a few of the many AI-powered automation testing tools that are available. The best tool for you will depend on your specific needs and requirements.
If you are new to AI-powered automation testing, I recommend starting with a tool that is easy to learn and use. Testsigma is a good option for beginners because it has a drag-and-drop interface and it does not require any coding experience.
Once you have learned the basics of AI-powered automation testing, you can then move on to more complex tools.
I hope this helps!
@@RaghavPal Thank you so much sir
@@RaghavPal Sir what about test craft ? is it good for future
Can learn it
Hi Sir, need your help to run playwright javascript automation scripts in microsoft edge brower how to run scripts in msedge sir?
Sanjeev
To run Playwright JavaScript automation scripts in Microsoft Edge browser, you can follow these steps:
*1. Install Playwright and Microsoft Edge browser:*
Ensure you have Node.js installed on your system, as Playwright requires Node.js version 12 or above. You can check the Node.js version using the command `node -v` in your terminal.
Next, install Playwright using the following command in your terminal:
```bash
npm install playwright
```
This will install Playwright globally on your system.
To install the Microsoft Edge browser, download the latest version from the official Microsoft Edge website ([www.microsoft.com/en-us/edge/download?form=MA13FJ](www.microsoft.com/en-us/edge/download?form=MA13FJ)). Install the browser according to the instructions provided on the website.
*2. Create a Playwright script:*
Create a JavaScript file (.js) to write your Playwright automation script. This script will contain the code to automate tasks in Microsoft Edge browser.
*3. Configure Playwright to use Microsoft Edge:*
In your Playwright script, you need to configure Playwright to use Microsoft Edge as the browser for automation. Here's an example of how to do this:
```javascript
const playwright = require('playwright');
(async () => {
const browser = await playwright.chromium.launch({ headless: false }); // Set headless to true for headless execution
const page = await browser.newPage();
await page.goto('www.example.com'); // Replace with the target URL
// Add your automation logic here
await browser.close();
})();
```
In this example, Playwright is configured to use the Chromium browser, which is the underlying engine of Microsoft Edge. The `headless` option is set to false, which means the browser will be launched in a visible window.
*4. Run the Playwright script:*
To execute the Playwright script, save it as a JavaScript file and run the following command in your terminal:
```bash
node script.js
```
Replace `script.js` with the actual filename of your Playwright script.
This will launch the Microsoft Edge browser and execute the automation tasks defined in your script.
Hello Raghav. Why Javascript is used for Playwright ?
Vinay
Playwright can use JavaScript, Python and Java too
JavaScript provides following:
**1. Versatility and Accessibility:** JavaScript is a ubiquitous programming language widely used for web development, making it a natural choice for Playwright. This allows developers familiar with JavaScript to quickly adapt to Playwright without learning a new language. Its vast community and readily available resources further enhance its accessibility.
**2. Client-Side Automation:** JavaScript is the dominant language used on the client-side of web applications, enabling Playwright to directly interact with the browser's DOM and manipulate elements. This allows for precise and granular control over the application's behavior during automation.
**3. Scripting and Automation Capabilities:** JavaScript is inherently adept at scripting and automation tasks, making it ideal for writing test scripts and automating complex workflows within Playwright. Its flexibility allows for dynamic and adaptive automation scenarios that can adjust to different conditions.
**4. Integration with Browsers:** JavaScript is natively supported by all major web browsers, ensuring seamless integration between Playwright and the browser environment. This eliminates the need for additional language interpreters or runtime environments, simplifying development and execution.
**5. Performance and Efficiency:** JavaScript engines are highly optimized for performance, allowing Playwright scripts to execute rapidly and efficiently. This is crucial for automation scenarios that require high responsiveness and minimal overhead.
**6. Ecosystem and Community:** JavaScript boasts a vast and vibrant ecosystem of libraries, frameworks, and tools that enhance Playwright functionality. This allows developers to leverage existing tools and libraries to extend Playwright's capabilities and tackle various automation challenges.
**7. Future-Proofing:** JavaScript remains a dominant force in web development, with constant updates and improvements. This ensures that Playwright will continue to be relevant and compatible with future web technologies and advancements.
While other languages like Python and Java can also be used with Playwright, JavaScript's unique combination of versatility, client-side accessibility, automation capabilities, and integration with browsers makes it the preferred choice for most Playwright developers.
@@RaghavPal - Thank you for Update. Now i got to know about selection of JS than other lang.
Hi Raghav, I am starting your videos on Playwright. I have Cypress background, I guess it will be easy for me to catch playwright sessions. #raghav
yes, will be easy for you. All the best Atul
@ragav do u have any course playwright with c#
not yet Aswathy
@@RaghavPal waiting 🤩
are playwright javascipt and typescript are same ? cos i could not see anywhere the difference
TypeScript is like a wrapper over JavaScript with some more features and functionality for Types, when you run TypeScript it transpiles down to JavaScript
@@RaghavPal Thanks a lot for your reply - but how to start with javascript+playwright - does it includes the same step explained below and save the file extension as filename.js and execute ?
In the sessions, I have used JavaScript
Hello sir.. I want to learn testing and make a carrier in it.. plz guide me where and how to start.. plz reply
What is your background and exp
I done my cs in 2014 but now I completely disconnected with technical terms. I am a homemaker right now n want a new start
ok, so you can plan how much time can you take out daily, if you like to start with automation, start with UI Automation or API automation, create a plan, Can find the sections here - automationstepbystep.com/
Ok sir.. thnku for replying
Hi, I am getting this error when trying to installa the playwright.
PS C:\Users\zaidih\Desktop\Playwright> npm init playwright@latest --yes -- --quiet --browser=chromium --browser=firefox --browser=webkit --gha
npm ERR! code ERR_UNESCAPED_CHARACTERS
npm ERR! Request path contains unescaped characters
Can you please help me in resolving this error?
Hi Hasan
The error message you are getting is caused by the fact that there are unescaped characters in the path to the Playwright binary. This can happen if you are using a path that contains spaces or other special characters.
To resolve this error, you need to escape the characters in the path. You can do this by using the `%` character before each special character. For example, if the path to the Playwright binary is `C:\Program Files\Playwright`, you would need to escape the spaces by using the following path:
```
C:%2FProgram%20Files%2FPlaywright
```
Once you have escaped the characters in the path, you should be able to install Playwright without any errors.
Here are some additional details:
* The `ERR_UNESCAPED_CHARACTERS` error is a common error that can occur when you are installing a binary that contains unescaped characters in the path.
* You can use the `%` character to escape special characters in a path. For example, the `%20` character represents a space.
* You can use the `npm install --verbose` command to see the full error message. This will help you to identify the specific characters that are causing the error.
I hope this helps
hey any chance you can make a series for dotnet/ C# please
I will plan on this Carole
@@RaghavPal Thanks 😊 Am really looking forward to that.
Hi Raghav, I've installed Playwright for JavaScript. Now, I want to use TypeScript. How can I switch from JavaScript to TypeScript?
Rajat
Can try the following steps:
1. Install TypeScript:
- First, install TypeScript as a development dependency in your project:
```
npm install --save-dev typescript
```
2. Create a tsconfig.json File:
- TypeScript uses a configuration file called `tsconfig.json` to manage project options.
- Create a basic `tsconfig.json` file in your project root (or customize it further as needed):
```json
{
"compilerOptions": {
"outDir": "./built",
"allowJs": true,
"target": "es5"
},
"include": ["./src//*"]
}
```
- Adjust the options according to your project requirements.
3. Rename Your JavaScript Files to TypeScript (.ts):
- Rename your existing `.js` files to `.ts`.
- TypeScript will infer types based on your code.
4. Type Annotations and Definitions:
- Add type annotations to your variables, function parameters, and return values.
- Use TypeScript's built-in types or create custom ones.
- Install type definitions for external libraries using `@types/package-name`.
5. Compile TypeScript to JavaScript:
- Run the TypeScript compiler to transpile your `.ts` files to `.js`:
```
npx tsc
```
- This will generate the compiled JavaScript files in the specified `outDir`.
6. Update Your Imports:
- Update your import statements to use `.ts` extensions:
```typescript
// Before
const { chromium } = require('playwright');
// After
import { chromium } from 'playwright';
```
7. Run Your Tests:
- Run your Playwright tests as usual:
```
npx playwright test
```
8. Enjoy TypeScript Benefits:
- TypeScript will catch type-related errors during development, improving code quality.
- You'll benefit from better autocompletion and tooling support.
..
@@RaghavPal Thanks
Sir, I am unable to install the playwright in Visual code when I enter the npm init playwright@latest and enter then I get this error The 'npm' is not recognized as the name of a cmdlet, function, script file, or operable program. I don't know how to resolve this. Please help me on this.
Hi Rajesh
The error message "The 'npm' is not recognized as the name of a cmdlet, function, script file, or operable program" means that the npm command is not found in your system's PATH environment variable. This means that you need to add the npm directory to your PATH variable.
To do this, open the Environment Variables dialog box by typing `env` in the Windows search bar. Then, click on the **Environment Variables** button.
In the Environment Variables dialog box, select the **Path** variable and click on the **Edit** button.
In the Edit environment variable dialog box, add the directory where the npm binary is located to the **Path** variable. The default location of the npm binary is `C:\Program Files
odejs
pm`.
Once you have added the npm directory to your PATH variable, you should be able to run the `npm init playwright@latest` command without any errors.
Here are the steps in detail:
1. Open the Environment Variables dialog box.
2. Select the **Path** variable and click on the **Edit** button.
3. In the Edit environment variable dialog box, add the directory where the npm binary is located to the **Path** variable.
4. Click on the **OK** button.
5. Try running the `npm init playwright@latest` command again.
If you are still getting the error message, then you may need to restart your computer.
I hope this helps
@@RaghavPal Awesome sir thank you so much for your detailed information. I really appreciate your way of response 🙏. I'll try and reply once I get resolved this issue. Then I need one guide from you that now I am looking to shift my job since I'm working with the current company past 3.7 years in the same project as manual test engineer. Before joining in this company I was working manual cum automation engineer like selenium java and had certified in RPA Uipath developer. And Appium mobile automation.
Additionaly Now I got accelq certified engineer but I'm not interested in accelq automation.
I'm in intrested with selenium java and RPA Uipath. Now I lost my knowledge on selenium java and Appium Uipath tools because in my current company I didn't get chance to work with any automation tools. Due to this I'm in frustrated now and struggling to recall my all automation stuffs I'm 33 years old.
So Sir can you please guide me what to do now how can I gather all my automation stuffs back to jump into good company with high package.
Recently I reasearched about Javascript playwright automation which is becoming trending in current market but here I want suggestions from you like shall I recall my selenium java stuffs to try new job or learn the JS playwright and try the job according to it so which one is better for me sir? I awaiting for your worthful reply.
Rajesh
Here are some things you can do to get back into automation testing:
* **Recall your Selenium Java and Appium skills.** This is the foundation of your automation skills, so it's important to make sure you have a good understanding of them. You can do this by reviewing your old code, taking online courses, or reading books
* **Learn about JavaScript Playwright.** This is a new automation tool that is gaining popularity. It's worth learning about if you want to stay ahead of the curve. You can learn about Playwright by reading the documentation, taking online courses, or watching tutorials
* **Update your resume and start applying for jobs.** Once you have refreshed your skills, it's time to start looking for a new job. Make sure your resume highlights your automation skills and experience
* **Network with people in the automation testing community.** This is a great way to learn about new opportunities and get your foot in the door. You can network by attending conferences, joining online forums, or connecting with people on LinkedIn.
It's hard to say which one is better for you, as it depends on your personal preferences and the specific jobs you are applying for. However, both Selenium Java and Playwright are in high demand, so you should be able to find a job with either one.
Here are some additional tips for getting back into automation testing:
* **Don't be afraid to start small.** If you're feeling rusty, start by automating simple tasks. This will help you get back into the swing of things and build your confidence.
* **Be patient.** It takes time to learn new skills and get back into the swing of things. Don't get discouraged if you don't find a job right away. Keep practicing and networking, and eventually you will find the right opportunity.
I hope this helps
@@RaghavPal wow nice 👍🙂 my heartfully thanks for your reply sir. Definitely I will beging to recall my automation stuffs as your guide. Really your suggestiona will make me to step up 😊
when I enter npm init playwright@latest it only create package.json file, why is that? 😢
can someone help?
Hi Ummu
When you run the command `npm init playwright@latest`, it initializes a new Node.js project with Playwright as a dependency. The command `npm init` is used to create a new `package.json` file, which is a configuration file for your Node.js project.
The `package.json` file contains information about your project, such as its name, version, dependencies, and scripts. It is an essential file in Node.js projects and is used to manage project dependencies, scripts, and other project-specific configurations.
Running `npm init playwright@latest` creates the `package.json` file and adds Playwright as a dependency in the `dependencies` section of the file. The Playwright dependency is automatically added because you specified `playwright@latest` in the command.
After running the command, you can check the contents of the `package.json` file to see that Playwright has been added as a dependency. You can also install the Playwright package by running `npm install`, which will fetch and install the specified dependencies (including Playwright) based on the `package.json` file.
In summary, the `npm init playwright@latest` command is primarily used to initialize a new Node.js project with Playwright as a dependency, and the creation of the `package.json` file is an expected outcome of this command.
Sir , Can u make playwright with Java for beginners
I will plan Fiza
Hi Raghav,
I am getting this error whenever I try to run the project. "Error: EPERM: operation not permitted, rmdir"
Anam
The "Error: EPERM: operation not permitted, rmdir" message typically occurs when Playwright encounters permission issues related to directory operations. Let's troubleshoot and find a solution:
1. Run as Administrator:
- First, ensure that you're running your terminal or command prompt as an administrator.
- Right-click on your terminal icon and select "Run as administrator."
- Then try running your Playwright project again.
2. Check Permissions:
- Verify that you have the necessary permissions to create or modify directories in the specified location.
- If you're working in a system directory (e.g., `C:\\Program Files`), you might need elevated permissions.
- Consider creating your project in a user-specific directory (e.g., `C:\\Users\\\\my-playwright-project`)
3. Clean Cache:
- Sometimes cached data can cause issues. Try cleaning the npm cache:
```bash
npm cache clean --force
```
4. Install Packages Globally:
- If you're installing global packages (e.g., Playwright), use the `-g` flag:
```bash
npm install -g playwright
```
5. Check Path Length:
- Long file paths can lead to permission errors. Ensure that your project path isn't too lengthy.
- Consider moving your project to a shorter directory path
6. Antivirus or Security Software:
- Some security software might interfere with file operations. Temporarily disable any antivirus or security tools and try again.
Remember to adapt these steps based on your specific environment and project setup
-
@@RaghavPal I did all the steps thoroughly, but still no luck. I've been noticing that my project runs the first time and a folder named "test-results" gets created and after the first run, that's when it complains with not having permission to access the "test-results" folder.
manually check the folder permissions
@@RaghavPal I managed to get it working through the permissions, thank you.
why does it show "Happy Hacking" after installation of extension
Sheetal
The message "Happy Hacking!" appearing after installing a Playwright extension is a friendly welcome message displayed by the Playwright team. It's a way to acknowledge your extension installation and encourage you to start using Playwright for your automation needs.
There's no specific reason for the "Happy Hacking!" message beyond being a fun and positive way to welcome users to the Playwright community. It's a small gesture that shows the Playwright team is passionate about their project and wants to create a positive user experience.
While the message itself doesn't have any functional purpose, it can be a nice reminder to start exploring the capabilities of Playwright and unleash your automation potential. So, embrace the "Happy Hacking!" spirit and embark on your journey of automating tasks with Playwright
Hi Raghav, Could you share me the link Playwright with Python.?
Vijay
I am yet to create tutorials on Playwright with Python. You can check the official documentation here - playwright.dev/python/docs/intro
Is the playwright open source?
Yes, Playwright is an open source project developed and maintained by Microsoft. It is available under the Apache 2.0 license, which allows users to freely use, modify, and distribute the software
I followed same steps for installing but i am getting some errors
Will need to see the errors and logs
Hi Raghav, could you please please please upload playwright with c#
I will plan on this Prashanthi
@@RaghavPal Thank you. Hope you upload soon..
Sir please make video for python too
Sure Dhwani.. I will plan
its possible with poetry?
Josh
will need to know specific things you want to try and check
@@RaghavPal with python try to install like “poetry add playwright install with-dep “ something like that
not sure on this
how to avoid creating page instances in every test in a single file in javascript, could you please share a video if it is made
Aparna
Can check the Page Object Model video of this playlist- ruclips.net/video/rAec3mZFhF0/видео.htmlsi=QdR5BRlniUMugyJF
@@RaghavPal My question was i have 10 tests in a single file , in each test method i do not want to create the page class instances to call the methods in that class, is there a way i can avoid that repetition and create the instances globally and then use the instance variable in all the tests
to avoid repetition and create reusable code for your Playwright tests, you can follow these best practices:
1. Page Object Models (POM): Consider using a page object model. This approach encapsulates common operations on a specific page into a helper class. You define element selectors and methods within the class, making it easier to maintain and reuse across multiple tests. Here's an example in TypeScript:
```typescript
// playwright-dev-page.ts
import { expect, Locator, Page } from '@playwright/test';
export class PlaywrightDevPage {
readonly page: Page;
readonly getStartedLink: Locator;
readonly gettingStartedHeader: Locator;
readonly pomLink: Locator;
readonly tocList: Locator;
constructor(page: Page) {
this.page = page;
this.getStartedLink = page.locator('a', { hasText: 'Get started' });
this.gettingStartedHeader = page.locator('h1', { hasText: 'Installation' });
this.pomLink = page.locator('li', { hasText: 'Guides' }).locator('a', { hasText: 'Page Object Model' });
this.tocList = page.locator('article div.markdown ul > li > a');
}
async goto() {
await this.page.goto('playwright.dev');
}
async getStarted() {
await this.getStartedLink.first().click();
await expect(this.gettingStartedHeader).toBeVisible();
}
async pageObjectModel() {
await this.getStarted();
await this.pomLink.click();
}
}
```
2. Before and After Hooks: Use before and after hooks to set up common parts of your tests. For example, you can set up the page base URL or log in to your app before each test. This keeps your tests isolated and independent
3. Static Utility Methods: Create a module with loose functions (or static methods in a class) that accept the page as a parameter. While this pattern is great for reusability, it does require passing the page into function calls repeatedly
Choose the approach that best fits your project and helps you avoid repetition while maintaining clean and maintainable test code.
-
@@RaghavPal i have done all the above mentioned points, what i meant was for eg. i have create user page class, manage user page class setup search page class , indeed to call theses page class methods in a single test spec.jsfile indifferent tests , in each test i am doing let cruser = nee Crewtuser in order to get a method in that test which is repetition, in java we create all class instances in static block globally and use them in each junit test right similarly i need to learn how to do that in javascript, that was my question
@raghavPal nine of the videos on your tube playwright series covered this so am seeking help like this , i should actually be watching javascript videos to do that i guess
How to write script for login by using otp?
Here's an example Playwright script for logging in using OTP (One Time Password):
const { chromium } = require('playwright');
(async () => {
const browser = await chromium.launch();
const context = await browser.newContext();
// Navigate to login page
const page = await context.newPage();
await page.goto('example.com/login');
// Enter phone number and submit
await page.fill('#phone-input', '1234567890');
await page.click('#submit-button');
// Wait for OTP input field to appear
await page.waitForSelector('#otp-input');
// Get OTP code via SMS or other means
const otpCode = getOTPCodeSomehow();
// Enter OTP and submit
await page.fill('#otp-input', otpCode);
await page.click('#submit-button');
// Wait for login success or failure message
await page.waitForSelector('#login-message');
// Check if login was successful
const loginMessage = await page.innerText('#login-message');
if (loginMessage.includes('Success')) {
console.log('Login successful!');
} else {
console.log('Login failed :(');
}
await browser.close();
})();
This script navigates to a login page, enters a phone number, waits for an OTP input field to appear, retrieves the OTP code, enters the OTP code, and checks for a login success message. You will need to modify the script to fit your specific use case, including selecting the correct HTML elements for inputting the phone number, OTP code, and submitting the form.
@@RaghavPal Thanks sir
Frustrations showing at 06:27 "go to hell" 😆
ha ha .. not really
Can you please teach Playwright with language Java
I will plan on this Priti
Is it C# ?
no
@@RaghavPal I think its a huge need C# + Playwright frontEnd testing represention , r you planing to publish ?
I will plan
Sir while i am installing playwright i am getting error
Satish
Let me know the error
@@RaghavPal it's resolved thanks for your reply ☺
Hi at this point ruclips.net/video/IB2P1FBXjcQ/видео.html you show the installation with Javascript. After I have done this and I have created test cases with JavaScript they asked me to switch to TypeScript. So do I need to reinstall Playwright with Typescript? Can I use the Framework with two different languages configs? Is there any tool to migrate my javascript test cases to typescript?
Aggie
not sure why its asking you to switch to TypeScript, I hope there is support for JavaScript in your IDE, Can check by separately creating a javascript file and running a basic Hello world program
Can also follow the official documentation of Playwright and try again
@@RaghavPal Sorry I was not clear. The company I work asked me to switch and use typescript instead. With the installation itself I had no problem.
ok, so what issues are you facing now