[js] Replace WebElement.getSize/getLocation with a single getRect

Author: jleyba

javascript/node/selenium-webdriver/CHANGES.md

@@ -122,6 +122,8 @@ mode.
    -  Dropped support for "requiredCapabilities" from WebDriver.createSession
    -  actions now returns the new `lib/input.Actions` class
    -  removed touchActions
+*  Changes to `lib/webdriver.WebElement`:
+   -  Replaced getSize & getLocation with getRect
 *  Changes to `lib/webdriver.Alert`:
    -  Removed authenticateAs
 *  Changes to `lib/webdriver.Options` (`driver.manage()`):

javascript/node/selenium-webdriver/lib/command.js

@@ -145,6 +145,7 @@ const Name = {
   IS_ELEMENT_DISPLAYED: 'isElementDisplayed',
   GET_ELEMENT_LOCATION: 'getElementLocation',
   GET_ELEMENT_LOCATION_IN_VIEW: 'getElementLocationOnceScrolledIntoView',
+  GET_ELEMENT_RECT: 'getElementRect',
   GET_ELEMENT_SIZE: 'getElementSize',
   GET_ELEMENT_ATTRIBUTE: 'getElementAttribute',
   GET_ELEMENT_VALUE_OF_CSS_PROPERTY: 'getElementValueOfCssProperty',

javascript/node/selenium-webdriver/lib/http.js

@@ -292,8 +292,7 @@ const W3C_COMMAND_MAP = new Map([
   // Element interaction.
   [cmd.Name.GET_ELEMENT_TAG_NAME, get('/session/:sessionId/element/:id/name')],
   [cmd.Name.GET_ELEMENT_VALUE_OF_CSS_PROPERTY, get('/session/:sessionId/element/:id/css/:propertyName')],
-  [cmd.Name.GET_ELEMENT_LOCATION, get('/session/:sessionId/element/:id/rect')],
-  [cmd.Name.GET_ELEMENT_SIZE, get('/session/:sessionId/element/:id/rect')],
+  [cmd.Name.GET_ELEMENT_RECT, get('/session/:sessionId/element/:id/rect')],
   [cmd.Name.CLEAR_ELEMENT, post('/session/:sessionId/element/:id/clear')],
   [cmd.Name.CLICK_ELEMENT, post('/session/:sessionId/element/:id/click')],
   [cmd.Name.SEND_KEYS_TO_ELEMENT, post('/session/:sessionId/element/:id/value')],

javascript/node/selenium-webdriver/lib/webdriver.js

@@ -2082,26 +2082,27 @@ class WebElement {
   }
 
   /**
-   * Computes this element's bounding box, in pixels.
+   * Returns an object describing an element's location, in pixels relative to
+   * the document element, and the element's size in pixels.
    *
-   * @return {!Promise<{width: number, height: number}>} A
-   *     promise that will be resolved with the element's size as a
-   *     {@code {width:number, height:number}} object.
+   * @return {!Promise<{width: number, height: number, x: number, y: number}>}
+   *     A promise that will resolve with the element's rect.
    */
-  getSize() {
-    return this.execute_(new command.Command(command.Name.GET_ELEMENT_SIZE));
-  }
-
-  /**
-   * Computes the location of this element in page space.
-   *
-   * @return {!Promise<{x: number, y: number}>} A promise that
-   *     will be resolved to the element's location as a
-   *     {@code {x:number, y:number}} object.
-   */
-  getLocation() {
-    return this.execute_(
-        new command.Command(command.Name.GET_ELEMENT_LOCATION));
+  async getRect() {
+    try {
+      return await this.execute_(
+          new command.Command(command.Name.GET_ELEMENT_RECT));
+    } catch (err) {
+      if (err instanceof error.UnknownCommandError) {
+        const {width, height} =
+            await this.execute_(
+                new command.Command(command.Name.GET_ELEMENT_SIZE));
+        const {x, y} =
+            await this.execute_(
+                new command.Command(command.Name.GET_ELEMENT_LOCATION));
+        return {x, y, width, height};
+      }
+    }
   }
 
   /**

javascript/node/selenium-webdriver/test/actions_test.js

@@ -66,6 +66,8 @@ test.suite(function(env) {
       await driver.get(fileServer.whereIs('/data/actions/record_click.html'));
 
       const div = await driver.findElement(By.css('div'));
+      const rect = await div.getRect();
+      assert.deepEqual(rect, {width: 500, height: 500, x: 0, y: 0});
 
       await driver.actions({bridge: true}).click(div).perform();
 
@@ -77,6 +79,8 @@ test.suite(function(env) {
       await driver.get(fileServer.whereIs('/data/actions/record_click.html'));
 
       const div = await driver.findElement(By.css('div'));
+      const rect = await div.getRect();
+      assert.deepEqual(rect, {width: 500, height: 500, x: 0, y: 0});
 
       await driver.actions({bridge: true})
           .move({x: 10, y: 10, origin: div})

javascript/node/selenium-webdriver/test/rect_test.js

@@ -23,38 +23,27 @@ const {By} = require('..');
 const test = require('../lib/test');
 
 test.suite(function(env) {
-  describe('rect commands', function() {
+  describe('WebElement', function() {
     let driver;
-    let el;
 
     before(async function() {
       driver = await env.builder().build();
-      await driver.get(
-            'data:text/html,<!DOCTYPE html><style>'
-                + '*{padding:0; margin:0}'
-                + 'div{position: absolute; top: 50px; left: 50px;'
-                + 'height: 50px;width:50px;background: green;}'
-                + '</style><div>Hello</div>');
-      el = await driver.findElement(By.css('div'));
     });
 
     after(function() {
-      if (driver) {
-        return driver.quit();
-      }
-    });
-
-    it('WebElement.getLocation()', async function() {
-      let location = await el.getLocation();
-      assert.equal(location.x, 50);
-      assert.equal(location.y, 50);
+      return driver.quit();
     });
 
-    it('WebElement.getSize()', async function() {
-      let size = await el.getSize();
-      assert.equal(size.width, 50);
-      assert.equal(size.height, 50);
+    it('getRect()', async function() {
+      await driver.get(
+            'data:text/html,<!DOCTYPE html><style>'
+                + '*{padding:0; margin:0}'
+                + 'div{position: absolute; top: 50px; left: 40px;'
+                + 'height: 25px;width:35px;background: green;}'
+                + '</style><div>Hello</div>');
+      const el = await driver.findElement(By.css('div'));
+      const rect = await el.getRect();
+      assert.deepEqual(rect, {width: 35, height: 25, x: 40, y: 50});
     });
-
   });
 });