How To Drag And Drop Element On A Web Page

Lets Kode It
A free video tutorial from Lets Kode It
Anyone can code - Changing Lives Everyday
4.5 instructor rating • 8 courses • 87,885 students

Lecture description

You will be able to learn how to drag and drop element on a web page using Actions Class of selenium webdriver and java

Learn more from the full course

Selenium WebDriver With Java - Novice To Ninja + Interview

Join the "Top Rated #1 Best Selenium Course"-Basics To Advanced Level With POM, Grid, Maven, GitHub, Jenkins, Interviews

43:34:03 of on-demand video • Updated August 2020

  • ***** At the end of this course, you will have detailed understanding of Web Automation Frameworks
  • You will be able to EXPLAIN, DESIGN and IMPLEMENT structured AUTOMATION FRAMEWORKS using Page Object/Factory Model
  • *** In-depth understanding of Selenium WebDriver CHALLENGES with real time examples
  • You will be able to implement CONTINUOUS INTEGRATION TESTING using JENKINS
  • ***** We have 10 dedicated INSTRUCTORS to help you with queries within 24 HOURS, resume preparation, Interview questions
  • You will be able to perform CROSS-BROWSER testing using SELENIUM GRID
  • You will be able to create GREAT LOOKING REPORTS using the best advanced REPORTING TOOL
  • You will have complete understanding of TestNG Framework
  • ***** You will have excellent command on Build Management using MAVEN
  • ***** You should be able to lead any Selenium Automation Project from scratch on your own
  • ***** You will have understanding of Behavior Driven Testing Using CUCUMBER, Gherkin language
  • ***** You will be able to understand and write efficient testing code
  • You will have required skills to automate any web application
  • You should be able to verify Data Integrity with the GUI of the application
  • Additional Knowledge of running Performance tests with Selenium WebDriver Automation
  • With all this knowledge gained, you should be easily able to clear Selenium Automation interviews
English Sell them back to the next one in this one maybe will see how we can drag and drop an element on of a page. And it's something like we're going dragon up every element it has to be available online but it has to be developed as a tropical. So that is something that one of us will take care. But if it is there on the UPS hey let's see how we can track it. So I'm not sure you're an example on the G20 website on this you are to where the white hot cum slash tropical. And basically there are a lot of lot of elements on the state left turn menu. And this is tropical. And if you notice there this one says drag me to my target and this one is tropics which means this is the source element from element and this is the human baby well a dragon. So I can't simply track the sediment to the target place. Do I see this. So let's let's see what we're doing. But first clicking the element and then holding our mouse and then moving it right and where we are moving it where we are moving it to the target element and then we're just really using the most. So these are the steps we are doing right. So let's see how we can perform the same steps using selenium but Traver But first you ought to kind of analyze and inspect the elements. Some of them bring up the fire pad. They inspect dual suits like this for us. Just want us to look at this. Let me just try it again. Let me just try it again. Yes that's it. So this selects the complete do an inside do Fisi this whole thing is inside the ice cream. And this is how the G the website is implemented to for all the elements. The demo that they have is under a different plane. So this whole thing is an. And you can very easily see that when I over my mouse on this side the ice cream tag everything that selected the elements these elements they all get selected which means this thing is inside alive. And this frame doesn't have an I.D. or it doesn't even have a name also. So we will use just a number to search to the frame and let's find out the ID for the elements. So this element has an ID tag it will. And this element has maybe copyable. So let's get started but decoding by numbering of the eclipse and on Eclipse what we have is we have the before method. We are just opening the UI and its biggest mistake you'll come to the Web site you will have the code pilot on board and you can see that you are here. And then we're just maximizing the browser and putting somebody's time it's minimised this method. And now let's come to the test. What we have is we're just getting the issue out of we're putting some sleep time. So guests can observe what's happening before switching the stream and before doing anything so when we go to the web say you have a time that OK nothing is happening I'm able to see that the page in the original state. And then we're switching to the frame by number 0. We're just using numbers 0 because there's only one team on the web page so we can easily do that. Now we're finding both the elements from element is the one that we found by taxability. Right. And then to Elliman to something where we want to drag the from. And so this guy has an ID drop the ball and we are just finding both the elements by ID. Now after that let's see what we want to do. For using the actions class. Soooo if you see the first thing we need is the import statement and it's our dog or been curious about selenium dog interactions dog actions after we import these statements. What we can do simply here is we just need to create an object and just see actions and action equals to yield actions. And it's going to take up a truck driver instance once it's initialized I can simply drag and drop and there are two ways I'm not sure that's why I have these two comments. The first one is the simple drag and drop and the second one is the action that will be just for fun manually as well. Click on hold we move the element we release and then build unperformed. This is something that we can see right now. So let's first take a look at the first three. So Axum daubed Taganrog. So the first one you see in Dragon rub it takes development source and the target. So if we just throw away the source element and the target element source is the from element and target is the two element. If they just simply do that we can actually drag and drop. And after that we just need to weld and dog park. So this is something that we need to provide to actually trust because it bears multiple actions and perform it. So we need to perform the action. Let me actually right now run the code and show you the demo of this part and then we will actually call the second policy. It's a rather nasty test to bring up the browser and then perform drag and drop just watch carefully Yes and it. So we see that this element moves from here to the element which was expecting it fade from element to element. So let's just close this part and just for a quick browser and let's see the second bit. So second as I've talked about the first one click the whole little mouse right. We are largely using it click clicking hole and we're moving on. I would say this is the manual operation that we perform right. And same thing selenium can simulate Nimbin more element to the target element. And then we release it. That's pretty much what we do in similar way on so selenium can just simply do that. Let me comment this code. Sue it doesn't it's a good one. And let's face it the neocortex I actually got click and hold it has a mythical click and hold which can take and all the element for us and what element we want to click on hold is from the play. So we're just going to type this offer this love we want to do we want to move to element so move to element and which element we want or do we want to move don't do anything doggy that way. After that a little we will not release it. It has released metadata so we can just use any of them. I'm just going to say the least on which element or maybe I can just say it's the minimum that I see God Bill and perform. That is pretty much it. Pretty easy and simple right. Well what we were doing manually we can just simulated in sitting him up there. So let's just fake it and then discard. And we should be able to see the same behavior. So it goes here and exact interrupted I know what it said and I'm just going to really one more time for you. So you can again see the answer and that's pretty much it guys guys suing the next leg just after the civil and they did it right. These always let me know when you have any cautions and I'll always be happy. And so I really want to make sure that all the students are happy with the Course and practice as much as possible. That's the most important thing. And thanks for that lesson