Geb - Spock - Setting date range on a non-editable span field having Calendar

156 views
Skip to first unread message

Janani Sampath Kumar

unread,
Dec 7, 2016, 6:27:24 AM12/7/16
to Geb User Mailing List
Hi Team,

I'm a newbie to Geb and looking for some options to automate the Date Range Field in a web page.

1. Field is non-editable
2. On clicking, a calendar instance will pop-up where we need to select the start date and end date

Any help/guidance on the above is really appreciated !
Thanks in advance !

tu Mimi

unread,
Dec 7, 2016, 8:16:17 AM12/7/16
to Geb User Mailing List
Hi there,
Geb is using JQuery to access the html components. You need to know the id, class... of the field/ popup/ date component.
Regards
Tu

Marcin Erdmann

unread,
Dec 8, 2016, 4:31:44 PM12/8/16
to Geb User Mailing List
There are basically two options:
- you can interact with the field in the exact same way as a user would, that is by clicking and then interacting with the calendar
- if your application under test includes jQuery then, as suggested by Tu, you can work around the fact that the field is not editable by using jQuery to manipulate its value; I would suggest using Geb's jQuery integration (http://www.gebish.org/manual/current/#jquery-integration)

Whichever route you use I'd suggest using a module class to abstract out implementation details of how changing of the value it is implemented.

--
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+unsubscribe@googlegroups.com.
To post to this group, send email to geb-...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/geb-user/57599dc2-2d1c-47d0-9b38-36be7768faa5%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

Janani Sampath Kumar

unread,
Dec 12, 2016, 8:09:54 AM12/12/16
to Geb User Mailing List
Hi tu Mimi and Marcin Erdmann,

Thanks for your reply !
Using jQuery, I can simulate a user clicks, mouseover actions, sending keystrokes, etc. but I'm still not clear about setting different input values for date.
As an example, how to simulate the specific date say 10/09/2017 - 11/10/2018 ?
Can you please point me some working example ?

Thanks in advance ! 

On Thursday, December 8, 2016 at 9:31:44 PM UTC, Marcin Erdmann wrote:
There are basically two options:
- you can interact with the field in the exact same way as a user would, that is by clicking and then interacting with the calendar
- if your application under test includes jQuery then, as suggested by Tu, you can work around the fact that the field is not editable by using jQuery to manipulate its value; I would suggest using Geb's jQuery integration (http://www.gebish.org/manual/current/#jquery-integration)

Whichever route you use I'd suggest using a module class to abstract out implementation details of how changing of the value it is implemented.
On Wed, Dec 7, 2016 at 1:16 PM, 'tu Mimi' via Geb User Mailing List <geb-...@googlegroups.com> wrote:
Hi there,
Geb is using JQuery to access the html components. You need to know the id, class... of the field/ popup/ date component.
Regards
Tu


Am Mittwoch, 7. Dezember 2016 12:27:24 UTC+1 schrieb Janani Sampath Kumar:
Hi Team,

I'm a newbie to Geb and looking for some options to automate the Date Range Field in a web page.

1. Field is non-editable
2. On clicking, a calendar instance will pop-up where we need to select the start date and end date

Any help/guidance on the above is really appreciated !
Thanks in advance !

--
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 post to this group, send email to geb-...@googlegroups.com.

Brian Kotek

unread,
Dec 12, 2016, 9:35:40 AM12/12/16
to Geb User Mailing List
I doubt you'll find an example that helps much, since the specifics of how you'd do this depend completely on how the field works. You'll need to simulate a click on the field, wait for the date picker to appear, then click on the date picker's days to choose the date(s) you want. So the real key is knowing what the DOM Id and/or CSS class selectors are for the field, the date picker, and the individual day elements are so that you can click on them or wait for them to appear/hide.

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

To post to this group, send email to geb-...@googlegroups.com.
Reply all
Reply to author
Forward
0 new messages