Raising an HTML Event with JavaScript through Pega Robotics
I tried this solution and it works for those objects that have either an object name or object id. But in one of our application there is a text field with neither an object name nor id.
How can I modify the code to work in such a scenario?
I modified the code , by passing the element as the second parameter instead of the element ID.
As the second parameter I am passing the "this" property of the text box in question. But when executing, I am getting a run time error when the automation goes to the invokescript
Also attached is the screen-shot of the automation. Please advise
Code:
------
function os_RaiseEvent(eventname,element)
{
var event;
if(document.createEvent)
{
event = document.createEvent("HTMLEvents");
event.initEvent(eventname, true, false);
if(eventname == "keydown" || eventname == "keyup")
{
event.keyCode = 13;
}
element.dispatchEvent(event);
}
else if(document.createEventObject)
{
event = document.createEventObject();
if(eventname == "keydown" || eventname == "keyup")
{
event.keyCode = 13;
}
element.fireEvent("on" + eventname, event);
}
return true;
}
Accepted Solution
Pegasystems Inc.
US
The website for this is written with AngularJS. We were able to trigger the submit of the search by executing the below code by using the ExecuteScript and InvokeScript components.
var target = document.querySelector("[ng-controller='ciFilteredColumns']").getElementByTagName('thead')[0].getElementByTagName('input')[0];
var eventObject1 = document.createEvent("Event");
eventObject1.initEvent('change', true, false);
var eventObject = document.createEvent("Event");
eventObject.initEvent('keypress', true, false);
eventObject.keyCode = 13;
target.dispatchEvent(eventObject1);
target.dispatchEvent(eventObject);
Investigation for this required review of the HTML and the events attached to the element in question from the F12 Developer Tools. This code is only applicable to IE9+.
Pegasystems Inc.
US
The code requires you to have a control with an ID or name. You could set the ID or name of the control by modifying its InnerHTML property so that it has an ID.
Mphasis
IN
The outerHTML of the element is:
<input class="form-control ng-pristine ng-valid" type="text" placeholder="Search" ng-model="filters[column.name]" ng-keypress="commitFilter(column, $event)">
Also, there are clones of this object, which is actually a search text field. The search is triggered only when a text is entered in the field and enter key is pressed.
Pegasystems Inc.
US
Just insert into the OuterHtml the text below. Just be sure you're ID is unique.
id="whatever_you_want_to_make_the_id_to_be_able_to_find_it_via_javascript"
<input id="some_random_id" class="form-control ng-pristine ng-valid" type="text" placeholder="Search" ng-model="filters[column.name]" ng-keypress="commitFilter(column, $event)">
Mphasis
IN
I tried setting the id for the element and am passing the newly set id to the JS function for hitting the enter key. Although I no longer see any error, I do not see any response either. When the enter key is pressed after placing the characters, it should search. But it does not search or bring up any results.
Mphasis
IN
While doing more testing, this is what I found.
- The text field that we are trying to hit the enter key is textClones in the attached image
- At the point indicated by Step 1 in the attached image, just before modifying the Outerhtml of the element, if I try entering a string manually and hitting the enter key, the search works and yields results
- At the pointed indicated by Step 2, which is just after modifying the OuterHTML, I can see that the outerHTML is modified to include the ID. But at this point, even if I try to manually enter a string and hit the enter key, the search does not work. Nothing happens
- Instead of doing a manual search, if I let the automation continue (22-HitEnter is performs the KeyDown, KeyUp and KeyPress events for the field), then also no search results are yielded. Nothing happens
Based on the above it appears, that when the outerHTML is modified, it somehow prevents the application from working as expected
Can you please help, as we are not able to proceed with the automation.
Pegasystems Inc.
US
I suggest that you open an SR with support as this issue appears to require someone who can gain access to your machine. If you do open an SR, please post the SR number here for tracking purposes.
The following article will be help you in creating an SR-
My Support Portal explained for Pega Robotic Automation (formerly OpenSpan)
Pegasystems Inc.
US
Devi, please communicate through the SR. That is the best way to get assistance. The SR has already been updated and is waiting for a response.
Accepted Solution
Pegasystems Inc.
US
The website for this is written with AngularJS. We were able to trigger the submit of the search by executing the below code by using the ExecuteScript and InvokeScript components.
var target = document.querySelector("[ng-controller='ciFilteredColumns']").getElementByTagName('thead')[0].getElementByTagName('input')[0];
var eventObject1 = document.createEvent("Event");
eventObject1.initEvent('change', true, false);
var eventObject = document.createEvent("Event");
eventObject.initEvent('keypress', true, false);
eventObject.keyCode = 13;
target.dispatchEvent(eventObject1);
target.dispatchEvent(eventObject);
Investigation for this required review of the HTML and the events attached to the element in question from the F12 Developer Tools. This code is only applicable to IE9+.