I am using Selenium to test out a web site. The web site contains a date field, which when clicked, opens a popup from wherein I can choose the date.
My issue is that I wish to select a particular date using the Selenium IDE or Selenese. I have tried various methods, but have not been able to get a correct solution or been able to resolve it, except by manually specifying a date to the field in Selenese script. I am using Java to implement the test case.
An example could be checked by going to any airlines site and clicking on the date field for departure. The popup which comes up, I wish to capture a date on that. This could be a future date or the present date.
You need to implement some code that will navigate calendar to the desired date. Depending on the calendar appearance it may be required to navigate to the next month or year, so you need the code that will determine what needs to be done and then emulate required events for Selenium.
We had the same task in our tests and we end up with either selecting today's date or by entering the date into the field directly. We also made a code that will allow to select any date on the calendar by we did this only because we needed to test the calendar widget and we were the authors of the widget so we knew how it was made. However it resulted in writing a lot of code
Selenium IDE is limited in its ability to handle javascript. I've worked around it at times
by putting custom links in that do customized GETs, but it's a hack.
You could look at Sahi, which can do it. I haven't tried it though.
http://sahi.co.in/w/
Related
I am trying to implement basic automation using Power Automate Desktop to change date selection on webpage and download the report. To do this I am injecting following javascript, which does change the date for me but webpage does not get updated as it should be updated once new date is selected. I have attached the link for snap where I manually select the date and webpage updates.
Can anyone help me to achieve this task of updating webpage when new date is selected.
P.s: I am not familiar with Javascript, the code I am using was taken from someone else.
document.getElementById("accPanelFilter:formFilter:panelSearch:j_idt80:j_idt82:daySelectGasDay:daySelectGasDaycalendar:daySelectGasDaycalendarcalendar_input").value = "10-11-2021";
Recently I have received a project to make a webpage comply with WCAG 2.0 Level A. The part that I am running into a problem at the moment is the datepicker component. The datepicker component allows the user to select the date in two ways. One way is to manually type in a date, for example, 04/06/2014. The other way is to select the small image beside it and a calendar would basically pop-up and the user can select the date from there.
While researching over the web, some people have suggested that we do not have to make the image part of the datepicker component accessible since the text-field itself provides an alternative for accessibility. Is this acceptable (First Question)?
If this is the right way to go, how do I make it so that accessibility technology like screen reader would ignore the image icon (Second Question)? I have also tried to research for this issue. Basically, if it was just an image, we could set the "alt" attribute to null. But this image is actually embedded inside an "anchor" tag (which makes the image click-able) therefore this practice is invalid (verified by achecker.ca).
Update: HTML5 Accessibility: aria-hidden and role=”presentation” answers the second question
Any thoughts would be helpful. Thank you
The answer to the first question depends on what the usability reason is for showing a visual calendar? If you are showing it so that users can select a date based on use cases like "first Friday in Month X" or something similar, then simply providing a text input, while making the page at least usable, does not make the page functionally equivalent for screen reader and keyboard-only users and therefore does not pass WCAG 2.
Your answer to the second question that you posted, works for screen readers (in terms of removing the aforementioned functionality) but it now presents a problem to sighted keyboard-only users. You are therefore still not WCAG 2 compliant.
Making date pickers accessible, while difficult, is possible. Are you using the jQuery UI datepicker?
I'm looking for suggestions/recommendations for a JQuery/Javascript calendar that can display multiple months at once (ie. previous month, current month, next month) like so:
(The attached mockup shows a 4-month view, but I think we'll actually be doing a 3-month view).
I DO NOT need a date picker. This is basically meant to display a user's schedule, with no ability to choose a specific month/year (beyond the side-scrolling). We'll pull events out of our database, hook them into the calendar somehow, and then on a day click/hover (or both), display additional information. Events will not be editable from this view - it is display only.
I've looked into general JQuery calendar plugins (Ion Calendar, CLNDR), but none seem to have the basic multiple-month functionality I need. Multi-lingual support (or the ability to add multi-lingual text) is also important to us. I was really hoping to find a ready-made plugin for this - can't be the first time someone's tried to do it!
In case it's any use/help, we use ColdFusion and MSSQL Server. We've also got JQuery 1.9.1, JQueryUI 1.10.0 and Bootstrap 2.3.2.
Edit: I did look at the JQuery UI datepicker, but it won't work for the functionality I need. I can't see any way to attach data to a specific date, or to be able to style certain days differently than others. I think the primary issue w/ it is that it's a datepicker, not a display calendar.
Like Sean said in the comments, the best option you have is probably FullCalendar. Although multi-month isn't supported out of the box, you might be able to achieve it by adding multiple calendars. Check out Issue #199, which describes a possible solution.
Regarding the multi-lingual problem: although it isn't multi-lingual by itself, FullCalendar does support modifying the days, months, etc. See Text/Time Customization. You could use ColdFusion's MonthAsString and DayOfWeekAsString functions to make it multi-lingual yourself.
I have been using the dynArch calendar for some time now. Can't say I've explored all the alternatives but I can recommend this one. Its pretty flexible.
I have run into a problem today that selecting a date was suddenly not updating the text control.
Ultimately, the problem seems to be that when the linked text box is blank, the calendar does not update the linked text box on selecting a date. Further testing reveals that any non-date causes the unwanted behavior.
I have verified that this behavior has been lurking in my production code, so its something I need to address.
I have started walking through the js library to see if i can track it down, but thought I would reach out to the collective as well.
Any help or pointers would be appreciated.
Thanks
In my particular case, the reason I was not seeing the popup was becuase the target text box had an invalid date in it.
I did not research if i could make it pop up a calendar w/ today in it.
I am looking for javascript for enabling/disabling two date range/date
prompts in Cognos.
Does anyone have any javascript for disabling/enabling two date range prompts? If I select the Date1 prompt, then the Date2 prompt has to be greyed out and vice versa.
I am using Cognos 8.3 SP2.
How about taking the approach of conditionally rendering one date prompt or another based upon a selection from a radio button or combo box? Doing this would ensure that only one prompt is selected, and would not require javascript.
First off, I'll admit I usually put jQuery into my Cognos reports nowadays. If you don't have the ability to put it into a local library, you can link to the Google hosting of it. You do this using an HTML Element with a script tag inside it (detailed explanation here).
Second, you can put HTML Element (div or span tags with an id) around the prompts. This gives you a way to easily select them.
Third, you bind a function to each one (using .click() ) which uses the .hide() jQuery function on the other.