Get position of elements inside an SVG - Fix Issue #331

teampoltergeist · Nov 16, 2015 · 82ee395 · 82ee395
1 parent 5df7208
commit 82ee395
Show file tree

Hide file tree

Showing 6 changed files with 21 additions and 14 deletions.
diff --git a/lib/capybara/poltergeist/client/agent.coffee b/lib/capybara/poltergeist/client/agent.coffee
@@ -107,13 +107,13 @@ class PoltergeistAgent.Node
 
   isObsolete: ->
     obsolete = (element) =>
-      if element.parentNode?
-        if element.parentNode == document
-          false
+      if (parent = element.parentNode)?
+        if parent == document
+          return false
         else
-          obsolete element.parentNode
+          obsolete parent
       else
-        true
+        return true
     obsolete @element
 
   changed: ->
@@ -312,7 +312,8 @@ class PoltergeistAgent.Node
     offset
 
   position: ->
-    rect = @element.getClientRects()[0]
+    # Elements inside an SVG return underfined for getClientRects???
+    rect = @element.getClientRects()[0] || @element.getBoundingClientRect()
     throw new PoltergeistAgent.ObsoleteNode unless rect
     frameOffset = this.frameOffset()
 

diff --git a/lib/capybara/poltergeist/client/browser.coffee b/lib/capybara/poltergeist/client/browser.coffee
@@ -268,7 +268,6 @@ class Poltergeist.Browser
   mouse_event: (page_id, id, name) ->
     # Get the node before changing state, in case there is an exception
     node = this.node(page_id, id)
-
     # If the event triggers onNavigationRequested, we will transition to the 'loading'
     # state and wait for onLoadFinished before sending a response.
     @currentPage.state = 'mouse_event'

diff --git a/lib/capybara/poltergeist/client/compiled/agent.js b/lib/capybara/poltergeist/client/compiled/agent.js
@@ -186,11 +186,12 @@ PoltergeistAgent.Node = (function() {
     var obsolete;
     obsolete = (function(_this) {
       return function(element) {
-        if (element.parentNode != null) {
-          if (element.parentNode === document) {
+        var parent;
+        if ((parent = element.parentNode) != null) {
+          if (parent === document) {
             return false;
           } else {
-            return obsolete(element.parentNode);
+            return obsolete(parent);
           }
         } else {
           return true;
@@ -449,7 +450,7 @@ PoltergeistAgent.Node = (function() {
 
   Node.prototype.position = function() {
     var frameOffset, pos, rect;
-    rect = this.element.getClientRects()[0];
+    rect = this.element.getClientRects()[0] || this.element.getBoundingClientRect();
     if (!rect) {
       throw new PoltergeistAgent.ObsoleteNode;
     }

diff --git a/lib/capybara/poltergeist/client/node.coffee b/lib/capybara/poltergeist/client/node.coffee
@@ -31,11 +31,8 @@ class Poltergeist.Node
 
   mouseEvent: (name) ->
     this.scrollIntoView()
-
     pos = this.mouseEventPosition()
-
     test = this.mouseEventTest(pos.x, pos.y)
-
     if test.status == 'success'
       if name == 'rightclick'
         @page.mouseEvent('click', pos.x, pos.y, 'right')

diff --git a/spec/integration/session_spec.rb b/spec/integration/session_spec.rb
@@ -378,6 +378,10 @@
         @session.click_link 'some link'
       end
 
+      it 'can click an element inside an svg' do
+        expect { @session.find(:css, '#myrect').click }.not_to raise_error
+      end
+
       context 'with #two overlapping #one' do
         before do
           @session.execute_script <<-JS
@@ -437,6 +441,8 @@
       end
     end
 
+
+
     context 'double click tests' do
       before do
         @session.visit '/poltergeist/double_click_test'

diff --git a/spec/support/views/click_test.erb b/spec/support/views/click_test.erb
@@ -45,5 +45,8 @@
   <div id="four" class="box"></div>
   <div id="log"></div>
   <svg id="svg" class="box"></svg>
+  <svg xmlns="http://www.w3.org/2000/svg" version="1.1">
+    <rect id="myrect" width="300" height="100" style="fill:rgb(0,0,255);stroke-width:1;stroke:rgb(0,0,0)" />
+  </svg>
 </body>
 </html>