How To Implement getRect, getLocation, and getSize In Selenium 4 for x Coordinate, y Coordinate, Width, and Height
Video Chapters
0:21 getRect
7:30 getLocation & getSize
► Watch Complete Selenium 4 Playlist/Series
https://www.youtube.com/playlist?list=PLfp-cJ6BH8u_4AMzeLVizVfqn4SCywSTJ
► Download Code, Presentation, & Transcript From GitHub
https://github.com/RexJonesII/Free-Videos/tree/master/Video_157%20Selenium%20getRect
► Free Selenium PDF Book:
https://www.rexjones2.com/book-selenium-4-beginners/
► Free Java PDF Book:
https://www.rexjones2.com/book-part-1-core-java/
► All Paperback & eBooks:
http://tinyurl.com/Rex-Allen-Jones-Books
► Transcript
In our automation program, there are scenarios that requires us to get the position and/or dimension of a WebElement. The positions are x and y coordinates while the dimensions are width and height. Selenium 4 has the getRect method that allows to get both positions and dimensions.
x comes before y and width comes before height. The x coordinate is measured horizontally starting from the left to the right. The y coordinate is measured vertically starting from the top to the bottom. Width and height are ways to measure the size of an element. Notice, there are 2 differences between Selenium and how we normally measure in Math. On a web page, the length is not available as a Dimension and y is not measured starting from the bottom.
With Selenium 3, we have getLocation and getSize. The getLocation method returns x and it returns y while the getSize method is used to fetch the width and height. With Selenium 4, the new getRect method is a combination that gets the x coordinate, y coordinate, width, and height. In this video, I am going to show you all 3 methods: getRect, getLocation, and getSize then compare getRect to see if it returns the same value as getLocation and getSize.
If you are interested in programming and automation videos, subscribe to my YouTube channel then click the bell icon. Also, connect with me on LinkedIn, Facebook, and follow me on Twitter. The code, presentation, and transcript document will get placed on GitHub.
We are going to use this Orange HRM logo as our WebElement. When I inspect the logo, we see img as the tag name and src as the attribute but no id attribute. However, the parent has an id value of divLogo. There are different ways to get this value. This time, I’m going to use CSS. CTRL + F to bring up this Find by string, selector, or XPath then write hash tag # then divLogo - img. Bingo. Copy this value. Also, let’s look at the size and location. Go to Properties, select img and we see height as 81, width is 417, x is 423, and y is 75.
getRect
Let’s go to our Test Script and start with the getRect method to make sure the measurements are the same. @Test / public void getPositionDimension () {}
The WebElement is logoOrangeHRM = driver.findElement(By.cssSelector(“#divLogo - img”)); Paste the value. Now that we have the logoOrangeHRM. WebElement, we can access the getRect method. Do you see Rectangle? That means the getRect method returns a Rectangle. The description shows it returns the location and size of the rendered element. Since it returns a Rectangle, we assign the location and size to Rectangle with an object name like rectLogo =. That’s all we need to get the x and y coordinates plus the width and height. Import the Rectangle class from Selenium package. Also import the @Test annotation from TestNG.
Let’s print these values and start with x. sysout(“x: ” + rectLogo.get) and we see getHeight, getWidth, getX, and getY. Select getX then perform this same process for each method. sysout(“y: ” + rectLogo.getY()); sysout(“Width: ” + rectLogo.getWidth()); sysout(“Height: ” + rectLogo.getHeight());
Let’s Run. It’s the same values. x = 423, y = 75, Width = 417, Height = 81
Let me hover over this Rectangle class then open the Declaration, we see 2 constructors. The 1st constructor has 4 int parameters: x, y, height, and width. However, the 2nd constructor has a Point parameter and a Dimension. With Selenium 3, we had to use the Point and Dimension classes to help us get the location and size.
Both classes are still available in Selenium 3. Let’s compare getRect with getLocation and getSize.
getLocation & getSize
Go back to our Test Script and Erase these print statements then start from scratch. For location, we write logoOrangeHRM.getLocation. and we see Point as the Return Type. After selecting getLocation, we assign it to Point with any name like pointLogo =. Import the class from Selenium. Look at this, we write pointLogo., we see x, y, getX, and getY but notice, we do not have width and height.
Contact
✔ Twitter
https://twitter.com/RexJonesII
✔ LinkedIn
https://www.linkedin.com/in/rexjones34/
✔ GitHub
https://github.com/RexJonesII/Free-Videos
✔ Facebook
http://facebook.com/JonesRexII
#Selenium4 #Selenium4GetRect #SeleniumGetLocationGetSize
Тэги:
#How_To_Implement_getRect #getrect_selenium_4 #selenium_4_alpha #selenium_4_features #new_features_in_selenium_4 #selenium_version_4 #selenium_4_tutorial #selenium4 #selenium_4_release_date #selenium_4_new_features #selenium_4_webdriver #how_to_use_selenium_4 #getrect_in_selenium_4 #height_and_width_of_element_in_selenium #x_and_y_co-ordinates_in_selenium #getrect() #height_of_element #width_of_element #x_coordinate_of_element #y_coordinate_of_element #getSize #getLocation