No video

WebdriverIO How to Record and Generate Test Scripts

  Рет қаралды 9,831

Automation Step by Step

Automation Step by Step

Күн бұрын

Пікірлер: 64
@Anishkcs
@Anishkcs Жыл бұрын
This was a new learning and it is interesting for quick automation solution.
@RaghavPal
@RaghavPal Жыл бұрын
Glad this helped
@kids-JoJo
@kids-JoJo 4 ай бұрын
Super.. I learnt new trick here..thank you brother
@RaghavPal
@RaghavPal 4 ай бұрын
Most Welcome. keep learning..
@SineQuaNon1
@SineQuaNon1 Жыл бұрын
Many thanks. That was, again, a great video.
@RaghavPal
@RaghavPal Жыл бұрын
Most welcome
@softwaretestinglearninghub
@softwaretestinglearninghub Жыл бұрын
This is a very interesting tool, thank you!
@RaghavPal
@RaghavPal Жыл бұрын
You are welcome!
@NITINN-ne9ze
@NITINN-ne9ze Жыл бұрын
thanks a lot great source to learn
@RaghavPal
@RaghavPal Жыл бұрын
You are welcome Nitin
@tahakarim83
@tahakarim83 Жыл бұрын
Really helpful thanks
@RaghavPal
@RaghavPal Жыл бұрын
Most welcome
@jeffmiller4405
@jeffmiller4405 Жыл бұрын
You are awesome!!! Thank you very much.
@RaghavPal
@RaghavPal Жыл бұрын
You're welcome!
@xXMrThomasXx
@xXMrThomasXx Ай бұрын
Usefull but I must refactor record script because it is not working on the begining. I should training this. I think. Thank you for the tutorial :) I don`t know about this extension.
@RaghavPal
@RaghavPal Ай бұрын
Yes, can improve and update as per your needs
@xXMrThomasXx
@xXMrThomasXx Ай бұрын
@@RaghavPal Yes, thats true
@kaanchanrajagopalan509
@kaanchanrajagopalan509 10 ай бұрын
Can we perform this automation for an OTT platform???
@RaghavPal
@RaghavPal 10 ай бұрын
Kaanchan Yes, WebdriverIO can be used to automate an OTT platform. WebdriverIO is a next-generation browser and mobile automation test framework for Node.js. It is built on top of the WebDriver protocol and provides a simple and intuitive API for writing automated tests. To automate an OTT platform using WebdriverIO, you will need to: 1. Install WebdriverIO and its dependencies. 2. Create a new WebdriverIO project. 3. Write your automated tests. 4. Run your tests. Here is a simple example of a WebdriverIO test that automates a login scenario on an OTT platform: ```javascript const { browser } = require('webdriverio'); describe('OTT Platform Login Test', () => { it('should be able to login to the OTT platform', async () => { await browser.url('example.com/ott'); await browser.findElement('name=username').setValue('johndoe'); await browser.findElement('name=password').setValue('password'); await browser.findElement('css selector=button[type="submit"]').click(); // Assert that the user is logged in await browser.pause(5000); expect(await browser.findElement('css selector=h1').getText()).toEqual('Welcome, John Doe!'); }); }); ``` To run this test, you can use the following command: ``` webdriverio test ``` This will start a browser and run the test. If the test passes, you will see a message like this: ``` ✔ OTT Platform Login Test ✓ should be able to login to the OTT platform (5s) ``` If the test fails, you will see a message like this: ``` ✖ OTT Platform Login Test ✕ should be able to login to the OTT platform (5s) ``` WebdriverIO provides a number of features that make it well-suited for automating OTT platforms, including: * Support for a wide range of browsers and devices * Support for parallel execution of tests * Support for reporting and logging * A large and active community If you are looking for a powerful and flexible automation framework for your OTT platform, WebdriverIO is a great choice.
@bharathkumarshiluveru9116
@bharathkumarshiluveru9116 Жыл бұрын
Raghav, how can we allow WebDriverIO to stop closing browser after first test in a suite, I wanted to continue the next test case on same browser. For example login in first case and then continue next test case on the same browser after login
@RaghavPal
@RaghavPal Жыл бұрын
Hi Bharath, To allow WebDriverIO to continue to the next test case on the same browser, you need to configure the persistentSession option in your wdio.conf.js file. Here's how you can set the persistentSession option to true: /* exports.config = { // ... other configuration options services: ['selenium-standalone'], capabilities: [{ browserName: 'chrome', 'goog:chromeOptions': { args: ['--no-sandbox'] } }], persistentSession: true, // ... other configuration options }; */ This will allow WebDriverIO to reuse the same browser session between test cases. The browser will not be closed after the first test case, and the next test case will continue on the same browser with the same session state. Note that this is different from using a single browser instance for all test cases in the suite, which is possible by using maxInstances configuration
@tuangkarombang5315
@tuangkarombang5315 5 ай бұрын
@@RaghavPal thank you sir this is what I looking for
@nandann3289
@nandann3289 Жыл бұрын
Hello Raghav, Thank you for the explanation. When I tried the same, the tests are generated in 'describe' and 'it' format which is for the Mocha framework. It would be great if you cloud let me know if the recording can be used with WDIO cucumber framework to record the steps.
@RaghavPal
@RaghavPal Жыл бұрын
Hi Nandan Install the "WebdriverIO Test Recorder" Chrome extension. Open your application in the Chrome browser. Click on the extension icon and start recording your interactions. Once you have recorded your test script, click on the "Export" button. Select "WebdriverIO" as the export format and copy the generated code. Paste the generated code into your WebdriverIO test script. Run the test script using WebdriverIO's Cucumber framework.
@AmalDevYT
@AmalDevYT Жыл бұрын
Is it possible to automate Flipkart login using webdriverio ?
@RaghavPal
@RaghavPal Жыл бұрын
Hi Amal Yes, it is possible to automate Flipkart login using WebDriverIO. See this example: const assert = require('assert'); describe('Flipkart Login', () => { it('should log in with valid credentials', () => { browser.url('www.flipkart.com/account/login'); // Enter the email address const emailInput = $('input[type="text"]'); emailInput.setValue('youremail@example.com'); // Enter the password const passwordInput = $('input[type="password"]'); passwordInput.setValue('yourpassword'); // Click on the Login button const loginButton = $('button[type="submit"]'); loginButton.click(); // Verify that the user has been logged in const myAccountLink = $('._2aUbKa'); assert(myAccountLink.isDisplayed()); }); });
@andrakritzinger1447
@andrakritzinger1447 8 ай бұрын
Hi Raghav, Is there a way to write a script to click on position of the screen, not the text? I have to submit carts, so each time one gets submitted, the cart which I clicked on is no longer available... so the script needs to run on "the next available" cart... Can you tell me how to do that please?
@RaghavPal
@RaghavPal 8 ай бұрын
Andra To click on a specific position of the screen using WebdriverIO, you can utilize the `browser.elementIdClick` command. This command requires the element ID of the element you want to click on. However, since the element IDs of the carts might change after each click, you'll need to dynamically identify the element to be clicked. Here's an approach to tackle this scenario: 1. **Locate the cart elements:** Use a CSS selector or XPath to locate all the cart elements that are currently displayed on the page. 2. **Identify the next available cart:** Iterate through the located cart elements and check if they are available or not. You can check for availability based on attributes, such as a disabled button or a specific text indicating availability. 3. **Click on the next available cart:** Once you've identified the next available cart, use its element ID with the `browser.elementIdClick` command to click on it. Here's an example code snippet that demonstrates this approach: ```javascript const {test, expect} = require('@playwright/test') test('Click on next available cart', async ({page}) => { // Assuming you have located cart elements using a CSS selector or XPath const cartElements = await page.$$('.cart-element'); // Iterate through cart elements and identify the next available cart let nextAvailableCart; for (const cartElement of cartElements) { // Check if the cart is available based on attributes, such as a disabled button or a specific text indicating availability if (isCartAvailable(cartElement)) { nextAvailableCart = cartElement; break; } } // Click on the next available cart if (nextAvailableCart) { const cartElementId = await nextAvailableCart.getAttribute('id'); await page.elementIdClick(cartElementId); } else { console.error('No available carts found'); } }) ``` In this example, `isCartAvailable` is a function that determines whether a cart element is available or not. You'll need to implement the logic for this function based on the specific attributes or indicators that represent cart availability on your website.
@Thachosenone40
@Thachosenone40 Жыл бұрын
Great tutorial! Can you have this generate the test cases in cucumber as well?
@RaghavPal
@RaghavPal Жыл бұрын
Yes, we can
@Thachosenone40
@Thachosenone40 Жыл бұрын
@@RaghavPal thank you for the response. How are we able to? Just search for the cucumber extension?
@RaghavPal
@RaghavPal Жыл бұрын
Yes, you can just search for the cucumber extension in WebdriverIO. To do this, open your WebdriverIO project in your IDE and open the `wdio.conf.js` file. In the `wdio.conf.js` file, add the following code: ``` plugins: ['cucumber'], ``` This will tell WebdriverIO to use the Cucumber extension. You can also specify the version of the Cucumber extension that you want to use. For example, to use the latest version of the Cucumber extension, you would add the following code to the `wdio.conf.js` file: ``` plugins: ['cucumber@latest'], ``` Once you have added the Cucumber extension to your WebdriverIO project, you can start writing your cucumber tests. Cucumber tests are written in a special language called Gherkin. Gherkin is a plain text language that is easy to read and write. Here is an example of a cucumber test: ``` Feature: Login Scenario: Login with valid credentials Given I am on the login page When I enter my username and password And I click on the login button Then I should be logged in ``` This cucumber test will login to a website with valid credentials. The `Feature` keyword defines the name of the feature. The `Scenario` keyword defines a scenario within the feature. The `Given` keyword defines a precondition for the scenario. The `When` keyword defines an action that is performed. The `And` keyword is used to chain multiple actions together. The `Then` keyword defines an expected result. You can learn more about Cucumber and Gherkin by visiting the Cucumber website: cucumber.io/.
@mitqa5536
@mitqa5536 Жыл бұрын
how to see another 4 videos in WebdriverIO playlist?
@RaghavPal
@RaghavPal Жыл бұрын
They are in processing, will be published soon
@panosgrigoriadis3534
@panosgrigoriadis3534 Жыл бұрын
So once I get that webdriverio .js file, can I go to LambdaTest and upload it and run the test there ? Does LambdaTest support that, or do I have to use Selenium for example ?
@RaghavPal
@RaghavPal Жыл бұрын
this can help webdriver.io/docs/wdio-lambdatest-service/
@NITINN-ne9ze
@NITINN-ne9ze Жыл бұрын
hi sir where will i get the exporter extension when i click on the dropdown button i dont see the list it says add extension.
@RaghavPal
@RaghavPal Жыл бұрын
Hi Nitin will need more details or point to the part of the video you are referring to
@sakshigoel5568
@sakshigoel5568 7 ай бұрын
i am unable to export my recording to webdriverio
@RaghavPal
@RaghavPal 7 ай бұрын
Sakshi will need more details and context. Can you tell me the steps you followed and where exactly you are facing issue
@SineQuaNon1
@SineQuaNon1 Жыл бұрын
I added webdriverio extention, but cannot see it under export dropdown. I see "Export Via Extensions" and "Get Extentions", but not webdriverio. Why is it that?
@RaghavPal
@RaghavPal Жыл бұрын
Hi There are a few reasons why you might not see the WebdriverIO extension under the export dropdown in the Chrome DevTools Recorder. * **The extension is not installed.** Make sure that you have installed the WebdriverIO extension from the Chrome Web Store. * **The extension is not enabled.** Once you have installed the extension, you need to enable it by clicking on the three dots in the top right corner of the Chrome DevTools window and selecting "More Tools" > "Extensions." Find the WebdriverIO extension in the list of extensions and make sure that the "Enabled" checkbox is checked. * **The extension is incompatible with your version of Chrome.** The WebdriverIO extension is only compatible with certain versions of Chrome. Make sure that you are using a supported version of Chrome. If you have checked all of these things and you still don't see the WebdriverIO extension under the export dropdown, then you can try the following: * **Restart Chrome.** Sometimes a simple restart can fix problems with extensions. * **Clear the Chrome browser cache.** This will remove any temporary files that might be causing problems with the extension. * **Reinstall the extension.** If all else fails, you can try uninstalling and reinstalling the extension. If you are still having problems, you can contact the WebdriverIO support team for help. Here are some additional steps you can take to troubleshoot the issue: 1. Open the Chrome DevTools and go to the Sources panel. 2. Click on the "Network" tab and filter the requests by "WebdriverIO". 3. Make sure that the extension is making requests to the WebdriverIO server. 4. If the extension is not making requests to the server, then the extension is not installed or enabled correctly. 5. If the extension is making requests to the server, but you still don't see the "Export as a WebdriverIO Test Script" option, then there may be a problem with the extension itself. You can try reinstalling the extension or contacting the extension developer for help.
@SineQuaNon1
@SineQuaNon1 Жыл бұрын
@@RaghavPal Many thanks for this detailed answer. I really appreciate that. 🙏
@SineQuaNon1
@SineQuaNon1 Жыл бұрын
@@RaghavPal I was AFK. Now, "Reinstall the extension" option worked perfectly. Thanks so much again.
@advaithgps3069
@advaithgps3069 11 ай бұрын
Hi, When i try to export i do not see the any option of extension which i have added
@RaghavPal
@RaghavPal 11 ай бұрын
Advaith I will need more information and details If it's about test script To export a test script with WebdriverIO, you can use the `testrunner.export()` command. This command takes an object as its argument, which specifies the options for the export. The object that you pass to the `testrunner.export()` command can include the following properties: * `output`: The path to the output file. * `format`: The format of the output file. * `options`: An object that contains any additional options for the export. For example, to export a test script to a JavaScript file called `test.js`, you would use the following code: ``` const testrunner = require('webdriverio/testrunner'); testrunner.export({ output: './test.js', format: 'javascript', }); ``` If you have added an extension to your WebdriverIO project, you can export a test script to the extension by specifying the extension's name in the `output` property. For example, to export a test script to the `my-extension` extension, you would use the following code: ``` const testrunner = require('webdriverio/testrunner'); testrunner.export({ output: './my-extension/test.js', format: 'javascript', }); ``` If you are not seeing the extension in the `output` property, it is possible that the extension is not installed correctly. Make sure that you have installed the extension and that it is listed in the `package.json` file for your WebdriverIO project
@advaithgps3069
@advaithgps3069 11 ай бұрын
@@RaghavPal Like when I add the extension and open the recording and try to export I don't see the webdriverio extension to export.
@advaithgps3069
@advaithgps3069 11 ай бұрын
Can we use the same test case for the mobile app, will the test case work.
@RaghavPal
@RaghavPal 11 ай бұрын
Whether or not a web test created using WebDriverIO for desktop browsers will work for mobile apps depends on a few factors, including: * The type of mobile app being tested. Is it a native app, a hybrid app, or a web app? * The specific tests being performed. Some tests, such as functional tests, may be more portable than others, such as performance tests. * The underlying framework being used to run the tests. WebDriverIO supports cross-platform testing, but some additional configuration may be required for mobile apps. In general, it is possible to use the same test case for both desktop browsers and mobile apps, but it is important to be aware of the potential differences and to make necessary adjustments. Here are some tips for using the same web test case for desktop browsers and mobile apps: * Use a cross-platform testing framework, such as WebDriverIO. * Use generic selectors whenever possible, instead of selectors that are specific to a particular browser or device. * Be aware of the differences in screen size and resolution between desktop browsers and mobile devices. * Use mobile-specific features, such as touch events and device orientation, when necessary. * Test your test cases on a variety of mobile devices to ensure compatibility. If you are unsure whether or not a particular test case will work for mobile apps, it is always best to test it on a real device. Here are some additional things to keep in mind: * Mobile apps may have different performance characteristics than desktop browsers. For example, mobile apps may have slower network connections or less powerful processors. * Mobile apps may also have different accessibility requirements than desktop browsers. For example, mobile apps may need to be tested with screen readers or other assistive technologies. It is important to tailor your test cases to the specific mobile app that you are testing and to the needs of your users.
@advaithgps3069
@advaithgps3069 11 ай бұрын
@@RaghavPal I totally understand, is there any way to generate the test case for native apps, could you suggest me how to write a test case for a particular scenario, for example for capture video or photo, is there any standard way for writing test cases for the components.
@harshajagtap9964
@harshajagtap9964 10 ай бұрын
@raghav I have added chrome extension for webdriverio , but still cannot export as webdriverio test script. also in my package.json I see only the following "name": "webdriverio-test", "version": "0.0.0", "description": "WebdriverioTest", "main": "server.js", "author": { "name": "" }, "devDependencies": { "@wdio/cli": "^8.16.20", "@wdio/cucumber-framework": "^8.16.19", "@wdio/devtools-service": "^8.16.20", "@wdio/local-runner": "^8.16.20", "@wdio/spec-reporter": "^8.16.17", "eslint": "^8.50.0" }, "eslintConfig": {}, "scripts": { "wdio": "wdio run ./wdio.conf.js" }, "dependencies": { "chromedriver": "^117.0.3"
@RaghavPal
@RaghavPal 10 ай бұрын
Harsha To export a test script as WebdriverIO from the Chrome Recorder extension, you need to follow these steps: 1. Make sure that you have the Chrome Recorder extension installed and enabled. 2. Open the Chrome DevTools Recorder. 3. Record the test steps that you want to export. 4. Click the Export button and select "Export as WebdriverIO Test Script". 5. Save the test script to a file. If you are unable to export the test script as WebdriverIO, make sure that you have the WebdriverIO Chrome Recorder extension installed and enabled. You can also try restarting Chrome. If you are still unable to export the test script, please provide more information about the error message that you are receiving. Your package.json file looks correct. You do not need to add any additional dependencies to export a test script as WebdriverIO. To run your WebdriverIO test script, you can use the following command: ``` npx wdio run ./wdio.conf.js ``` This will run the test script in the `wdio.conf.js` file. Here is an example of a simple WebdriverIO test script: ```javascript describe('My Test Suite', () => { it('should open the Google home page', async () => { await browser.url('www.google.com/'); }); }); ``` This test script will open the Google home page and verify that the page is loaded correctly. You can use if-then-else statements in your WebdriverIO test scripts to control the flow of the test. For example, you can use an if-then-else statement to check if a certain element is present on the page and then perform different actions depending on the result. Here is an example of a WebdriverIO test script that uses an if-then-else statement: ```javascript describe('My Test Suite', () => { it('should check if the searchbar is present on the page', async () => { const searchbarElement = await browser.$('#searchbar'); if (searchbarElement.isDisplayed()) { // The searchbar is present on the page } else { // The searchbar is not present on the page } }); }); ``` This test script will check if the element with the ID `searchbar` is present on the page. If the element is present, the test will pass. If the element is not present, the test will fail. You can use if-then-else statements to verify any information on a webpage, as long as you can find the element that contains the information and get the text or value of the element.
@bharathkumarshiluveru9116
@bharathkumarshiluveru9116 Жыл бұрын
Hi Raghav, I need to compare text with the getText() on an element. How can we achieve this. I tried with expect but somehow it was not working
@RaghavPal
@RaghavPal Жыл бұрын
Hi Bharath, You can use the expect() function from the @wdio/jasmine-framework package to assert that the text from the element matches the expected text. Eg: const expectedText = 'Hello World!'; const element = $('css selector for the element'); const actualText = await element.getText(); expect(actualText).toEqual(expectedText); Make sure to replace 'css selector for the element' with the actual selector for the element you want to extract the text from.
@bharathkumarshiluveru9116
@bharathkumarshiluveru9116 Жыл бұрын
@@RaghavPal Thanks Raghav, I'm able to get it work using toBe() method. await expect(actualtext).toBe(expectedText)
@carlirowsperrirow4694
@carlirowsperrirow4694 Жыл бұрын
How can we have access to the other 4 videos that are hidden ??
@RaghavPal
@RaghavPal Жыл бұрын
They are in processing, will be public soon
@bharathkumarshiluveru9116
@bharathkumarshiluveru9116 Жыл бұрын
Hi Raghav, can you please let me know how to perform rightClick using WebDriverIO
@RaghavPal
@RaghavPal Жыл бұрын
Hi Bharath, Here is an example of how you can use the rightClick() command to perform a right-click on an element: /* // Import the browser object const browser = require('webdriverio').remote({ desiredCapabilities: { browserName: 'chrome' } }) // Navigate to a website browser.url('www.example.com') // Locate the element you want to right-click on const element = browser.$('#elementId') // Perform a right-click on the element element.rightClick() */
@bharathkumarshiluveru9116
@bharathkumarshiluveru9116 Жыл бұрын
@@RaghavPal Thank you Raghav, for sharing the code. I'm getting this error while running it: Can you please help. TypeError: browser.url is not a function
@bharathkumarshiluveru9116
@bharathkumarshiluveru9116 Жыл бұрын
Raghav, I'm able to get it working. I tried this. await element.click({button:right})
@risajoyfulguirinas1507
@risajoyfulguirinas1507 Жыл бұрын
Hi, where did you get the base code?
@RaghavPal
@RaghavPal Жыл бұрын
If you are talking about the setup, can check the earlier sessions
Easiest way to Run WebdriverIO Tests from Jenkins
34:25
Automation Step by Step
Рет қаралды 9 М.
Getting Started with WebdriverIO | Complete Tutorial for Beginners Step by Step
56:49
Kids' Guide to Fire Safety: Essential Lessons #shorts
00:34
Fabiosa Animated
Рет қаралды 16 МЛН
小丑把天使丢游泳池里#short #angel #clown
00:15
Super Beauty team
Рет қаралды 46 МЛН
Ik Heb Aardbeien Gemaakt Van Kip🍓🐔😋
00:41
Cool Tool SHORTS Netherlands
Рет қаралды 9 МЛН
WebDriver BiDi: Future of browser automation
13:42
Chrome for Developers
Рет қаралды 19 М.
Extent Reports in java selenium framework
26:40
QA Automation Classes
Рет қаралды 4,6 М.
How to record Selenium Test Execution Video || Monte ScreenRecorder API
19:40
Naveen AutomationLabs
Рет қаралды 26 М.
WebdriverIO waitFor* methods | commands
25:39
qavbox
Рет қаралды 743
The best way to add WebdriverIO Project to Git and GitHub
23:08
Automation Step by Step
Рет қаралды 4,1 М.
WebdriverIO Tutorial | Full Crash Course | Latest Version
1:23:00
SDET Unicorns by Dilpreet Johal
Рет қаралды 2,1 М.
How To Inspect Hidden / Disappeared Elements In Just One Click
8:52
Naveen AutomationLabs
Рет қаралды 53 М.
Do you know this way to Run WebdriverIO tests from Jenkins using GitHub project
17:55
Kids' Guide to Fire Safety: Essential Lessons #shorts
00:34
Fabiosa Animated
Рет қаралды 16 МЛН