Bug 1036365: Implement element.rect to marionette for getting element size and location; r=mdas

testing/marionette/client/marionette/marionette.py

@@ -162,6 +162,18 @@ class HTMLElement(object):
 
         return self.marionette._send_message("getElementLocation", "value", id=self.id)
 
+    @property
+    def rect(self):
+        """
+            this will return a dictionary with the following:
+
+            * x and y represent the top left coordinates of the WebElement relative to top left corner of the document.
+            * height and the width will contain the height and the width of the DOMRect of the WebElement.
+
+        """
+
+        return self.marionette._send_message("getElementRect", "value", id=self.id)
+
     def value_of_css_property(self, property_name):
         '''
         Gets the value of the specified CSS property name.

testing/marionette/client/marionette/tests/unit/single_finger_functions.py

@@ -98,8 +98,8 @@ def long_press_on_xy_action(marionette, wait_for_condition, expected):
     action = Actions(marionette)
 
     # Press the center of the button with respect to html.
-    x = button.location['x'] + button.size['width'] / 2.0
-    y = button.location['y'] + button.size['height'] / 2.0
+    x = button.rect['x'] + button.rect['width'] / 2.0
+    y = button.rect['y'] + button.rect['height'] / 2.0
     action.long_press(html, 5, x, y).perform()
     wait_for_condition(lambda m: expected in m.execute_script("return document.getElementById('button1').innerHTML;"))
 

testing/marionette/client/marionette/tests/unit/test_elementState_chrome.py

@@ -27,6 +27,12 @@ class TestStateChrome(MarionetteTestCase):
         self.assertFalse(l.is_enabled())
         self.marionette.execute_script("arguments[0].disabled = false;", [l])
 
+    def test_can_get_element_rect(self):
+        l = self.marionette.find_element("id", "textInput")
+        rect = l.rect
+        self.assertTrue(rect['x'] > 0)
+        self.assertTrue(rect['y'] > 0)
+
     ''' Switched on in Bug 896043 to be turned on in Bug 896046
     def test_isDisplayed(self):
         l = self.marionette.find_element("id", "textInput")

testing/marionette/client/marionette/tests/unit/test_elementsize.py

@@ -9,7 +9,7 @@ class TestElementSize(MarionetteTestCase):
         test_html = self.marionette.absolute_url("testSize.html")
         self.marionette.navigate(test_html)
         shrinko = self.marionette.find_element('id', 'linkId')
-        size = shrinko.size
+        size = shrinko.rect
         self.assertTrue(size['width'] > 0)
         self.assertTrue(size['height'] > 0)
 
@@ -34,7 +34,7 @@ class TestElementSizeChrome(MarionetteTestCase):
         newWin = wins.pop()
         self.marionette.switch_to_window(newWin)
         shrinko = self.marionette.find_element('id', 'textInput')
-        size = shrinko.size
+        size = shrinko.rect
         self.assertTrue(size['width'] > 0)
         self.assertTrue(size['height'] > 0)
 

testing/marionette/client/marionette/tests/unit/test_position.py

@@ -8,6 +8,6 @@ class TestPosition(MarionetteTestCase):
         self.marionette.navigate(test_url)
 
         r2 = self.marionette.find_element('id', "r2")
-        location = r2.location
+        location = r2.rect
         self.assertEqual(11, location['x'])
         self.assertEqual(10, location['y'])

testing/marionette/marionette-listener.js

@@ -168,6 +168,7 @@ function startListeners() {
   addMessageListenerId("Marionette:getElementValueOfCssProperty", getElementValueOfCssProperty);
   addMessageListenerId("Marionette:submitElement", submitElement);
   addMessageListenerId("Marionette:getElementSize", getElementSize);
+  addMessageListenerId("Marionette:getElementRect", getElementRect);
   addMessageListenerId("Marionette:isElementEnabled", isElementEnabled);
   addMessageListenerId("Marionette:isElementSelected", isElementSelected);
   addMessageListenerId("Marionette:sendKeysToElement", sendKeysToElement);
@@ -268,6 +269,7 @@ function deleteSession(msg) {
   removeMessageListenerId("Marionette:getElementValueOfCssProperty", getElementValueOfCssProperty);
   removeMessageListenerId("Marionette:submitElement", submitElement);
   removeMessageListenerId("Marionette:getElementSize", getElementSize);
+  removeMessageListenerId("Marionette:getElementRect", getElementRect);
   removeMessageListenerId("Marionette:isElementEnabled", isElementEnabled);
   removeMessageListenerId("Marionette:isElementSelected", isElementSelected);
   removeMessageListenerId("Marionette:sendKeysToElement", sendKeysToElement);
@@ -1527,6 +1529,25 @@ function getElementSize(msg){
   }
 }
 
+/**
+ * Get the size of the element and return it
+ */
+function getElementRect(msg){
+  let command_id = msg.json.command_id;
+  try {
+    let el = elementManager.getKnownElement(msg.json.id, curFrame);
+    let clientRect = el.getBoundingClientRect();
+    sendResponse({value: {x: clientRect.x + curFrame.pageXOffset,
+                          y: clientRect.y  + curFrame.pageYOffset,
+                          width: clientRect.width,
+                          height: clientRect.height}},
+                 command_id);
+  }
+  catch (e) {
+    sendError(e.message, e.code, e.stack, command_id);
+  }
+}
+
 /**
  * Check if element is enabled
  */

testing/marionette/marionette-server.js

@@ -1879,6 +1879,29 @@ MarionetteServerConnection.prototype = {
     }
   },
 
+  getElementRect: function MDA_getElementRect(aRequest) {
+    let command_id = this.command_id = this.getCommandId();
+    if (this.context == "chrome") {
+      try {
+        let el = this.curBrowser.elementManager.getKnownElement(
+            aRequest.parameters.id, this.getCurrentWindow());
+        let clientRect = el.getBoundingClientRect();
+        this.sendResponse({x: clientRect.x + this.getCurrentWindow().pageXOffset,
+                           y: clientRect.y + this.getCurrentWindow().pageYOffset,
+                           width: clientRect.width, height: clientRect.height},
+                           command_id);
+      }
+      catch (e) {
+        this.sendError(e.message, e.code, e.stack, command_id);
+      }
+    }
+    else {
+      this.sendAsync("getElementRect",
+                     { id:aRequest.parameters.id },
+                     command_id);
+    }
+  },
+
   /**
    * Send key presses to element after focusing on it
    *
@@ -2468,6 +2491,7 @@ MarionetteServerConnection.prototype.requestTypes = {
   "getElementValueOfCssProperty": MarionetteServerConnection.prototype.getElementValueOfCssProperty,
   "submitElement": MarionetteServerConnection.prototype.submitElement,
   "getElementSize": MarionetteServerConnection.prototype.getElementSize,
+  "getElementRect": MarionetteServerConnection.prototype.getElementRect,
   "isElementEnabled": MarionetteServerConnection.prototype.isElementEnabled,
   "isElementSelected": MarionetteServerConnection.prototype.isElementSelected,
   "sendKeysToElement": MarionetteServerConnection.prototype.sendKeysToElement,