"Element is not clickable at point" when element defined in content closure

[Nico Janssens]

Hi, 

A question about content closure.

In the content closure of a page object , I have defined some elements :

static content = {

   ....

          dashboardListSaveButton { $('[data-gtm="content-planner/filters/save"]')}

   ...

}

In that same page object , I have a method like 

def "save dashboard list"() {

   waitFor {

      dashboardListSaveButton.click()

   }

}

When running the test ( via spock framework) which makes use of the method above, I always get following exception : ElementClickInterceptedException: element click intercepted: Element is not clickable at point (924, 913)

When I modify the method like this 

def "save dashboard list"() {

   waitFor {

      $('[data-gtm="content-planner/filters/save"]').click()

   }

}

and rerun the test, it works fine. 

Is there any difference defining the element in the content closure or using the navigator directly in the method?

thx

Kind regards

Nico

[Michael Kutz]

Hey Nico,

the difference is the `waitFor` in the method. You can achieve the same behavior in the content block by adding a `wait: true` like this:

static content = {

    ...

    dashboardListSaveButton(wait: true) { $('[data-gtm="content-planner/filters/save"]')}

    ...

}

See https://gebish.org/manual/current/#content-dsl-wait

Kind regards

--
You received this message because you are subscribed to the Google Groups "Geb User Mailing List" group.
To unsubscribe from this group and stop receiving emails from it, send an email to geb-user+u...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/geb-user/6d2f7006-b5f5-47bb-bd7d-9d4a66dab8dd%40googlegroups.com.

[Nico Janssens]

Hey ,

Hmmm , I'm already using a waitFor closure in the method , which should result in the same behaviour as using the wait option in content block. Anyway when I apply the wait option and remove the waitFor in the method , I get the same error. 

---------------------------------------

dashboardListSaveButton { $('[data-gtm="content-planner/filters/save"]')}

def "save dashboard list"() {

   waitFor {

      dashboardListSaveButton

   }

}

---------------------------------------

VS

---------------------------------------

 dashboardListSaveButton(wait: true) { $('[data-gtm="content-planner/filters/save"]')}

def "save dashboard list"() {

      dashboardListSaveButton

}

---------------------------------------

thx

To unsubscribe from this group and stop receiving emails from it, send an email to geb-...@googlegroups.com.

[Marcin Erdmann]

Hi Nico,

Your problem is most likely a timing issue.

Is there any difference defining the element in the content closure or using the navigator directly in the method?

Strictly speaking there is, because the calls will go through different code paths but in general the outcome should be the same. Unless, like in your case, we are dealing with an async page which exposes certain timing properties. Using a selector is just about quicker than using a page definition and I suspect, and it's only a suspicion, that in this case it's quicker enough to lead to a different behaviour because the page is in a different state when clicking on the element.

I'd advise you to never put click() within waitFor() blocks - it will be prone to timing issues and can sometimes lead to the element being clicked multiple times. What I would do to make your test reliable is to identify the object which is overlaying the element you're clicking and causing the exception, wait for it to appear, dismiss it and then click on your target element. That way things will be reliable.

To unsubscribe from this group and stop receiving emails from it, send an email to geb-user+u...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/geb-user/581f4240-f58e-41d4-aced-74426616db39%40googlegroups.com.

[Nico Janssens]

Hi Marcin , 

Thanks for the reply.

After doing some debugging, I found out that the click is actually applied. The strange thing is that the error occurs : 

org.openqa.selenium.ElementClickInterceptedException: element click intercepted: Element is not clickable at point (924, 913)

  (Session info: chrome=79.0.3945.88)

Build info: version: '3.14.0', revision: 'aacccce0', time: '2018-08-02T20:19:58.91Z'

System info: host: 'BEC02TQ17BHTD5.local', ip: '10.217.11.203', os.name: 'Mac OS X', os.arch: 'x86_64', os.version: '10.14.6', java.version: '1.8.0_202'

Driver info: org.openqa.selenium.chrome.ChromeDriver

Capabilities {acceptInsecureCerts: false, browserName: chrome, browserVersion: 79.0.3945.88, chrome: {chromedriverVersion: 79.0.3945.36 (3582db32b3389..., userDataDir: /var/folders/8d/bwl_96yd0bx...}, goog:chromeOptions: {debuggerAddress: localhost:54252}, javascriptEnabled: true, networkConnectionEnabled: false, pageLoadStrategy: normal, platform: MAC, platformName: MAC, proxy: Proxy(), setWindowRect: true, strictFileInteractability: false, timeouts: {implicit: 0, pageLoad: 300000, script: 30000}, unhandledPromptBehavior: dismiss and notify}

Session ID: a1853ff8f110e25713bf295941e7dd1c

What happens is that I click a button in a page A (defined as page object) which gets me to a page B (defined as page object). Next I do an at verification of page B which is successful. Then I do some actions in page B and finally do a click on a save button which should do a save action and bring me back to page A.  I can actually see during the test run that the save button is clicked and page A is displayed. However after the save action , the error is thrown which is quite strange as the click action is actually performed?? The location mentioned in the error is the exact location of the save button in page B.  Also when looking in the geb reports a screenshot is taken of page A when click action has been performed.  Any idea why it keeps complaining about element not clickable?

thanks

Kind regards

Nico 

To view this discussion on the web visit https://groups.google.com/d/msgid/geb-user/581f4240-f58e-41d4-aced-74426616db39%40googlegroups.com.

[Marcin Erdmann]

Nico,

Unfortunately I don't have an explanation of why the error occurs. I might have a better idea if I had access to the full stacktrace and corresponding code.

Cheers,
Marcin

To unsubscribe from this group and stop receiving emails from it, send an email to geb-user+u...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/geb-user/72b2e5b1-870a-40d2-baac-ba4fa52574e0%40googlegroups.com.

[Nico Janssens]

Looks like the error occurs when the button is initially not in viewport. 

During the test , you can see that geb is moving to the element and actually clicks on it. When click is performed , I get the "element click intercepted: Element is not clickable at point  ..." error

When adding an interact closure in which i move to the element first also doesn't fix the issue

To view this discussion on the web visit https://groups.google.com/d/msgid/geb-user/72b2e5b1-870a-40d2-baac-ba4fa52574e0%40googlegroups.com.