QTP Click method not working | highlight working - automation

In web page,there are few tabs like CustomerAccountContact.
These tabs are inside SPAN html tag.
I have added the web element for Account in OR. When I try to highlight it works fine but when I try to click using Click method its not going to the Account tab.
If I take the abs_x and abs_y of the web element and try to click using mercury.devicereply object it works fine.
PFB, the html source code for accounts tab:
<a class="x-tab-right" onclick="return false;" href="#">
<em class="x-tab-left">
<span class="x-tab-strip-inner">
<span class="x-tab-strip-text ">
Account
</span>
</span>
</em>
</a>

Since the link has an onclick="return false;" this means that click events don't do anything and the application reacts to different events. Apparently these events aren't those that UFT fires when it simulates a Click event.
You have two options as I see it.
Find out what event the application is reacting to and fire that event in the test (instead of performing a click)
Use device replay, this can be done more simply than using the Mercury.DeviceReplay object as you're doing by changing the replay-type to device (as explained in this answer).

It is occurring because application is firing different event. Even fire event may not work in this case. Since it is already working with Mercury device replay it would be better for you to create and register it (RegisterUserFunc).
RegisterUserFunc "WebLink", "fLnkClick", "fLnkClick"

Use:
Before click method
Setting.WebPackage("ReplayType") = 2
After click method
Setting.WebPackage("ReplayType") = 1
If you set Replay Type = 2 then you are giving control to Mouse, which do the actions similar the way you do manually. So clicks, mouseover and other mouse related actions will work if normal QTP click fails.
Also we can use "Mercury.DeviceReplay" object for the implementing similar logic.

Related

How to use `ElButton` as a link using Element Plus and Vue.js

I'm using Element Plus 2.2.28 and Vue.js 3.2.45.
I want to have a button like this:
<el-button>Contact</el-button>
When I click the button, I want it to behave like a link tag using mailto:someone#example.com.
I tried this:
<el-button href="mailto:someone#example.com">Contact</el-button>
However, this doesn't work.
I could use pure JS in the #click event of the button, but I understand this is not recommended.
Since you want to click on the button to redirect you, then you do not need any other functionality that the el-button offers. As such, you only want the appearance of an el-button. Therefore, you can use the el-button class instead on an anchor tag as follows;
<a class="el-button" href="mailto:someone#example.com">Contact</a>

How to put one button inside another one in Vue?

I’m stuck with putting one button inside of another one: it’s prohibited, but I use bootstrap, that’s why I appoint class “btn …” to span and it looks like the button.
My button should look like this:
Filename.jpg <small delete button<
When you press on filename, file opens, when on small delete button - it sends request to API and deletes file
But now link is not working, but delete button does work. Putting and so one did not solve my problem
Code:
<span v-for=“link in links”
class= “btn btn-success”
v-bind:href=“<domain> + link.file”>
<button type=“button” class=“btn btn-danger” #click=“deleteFile(`$(link.file_id) `)”>-</button>
</span>
href only works on certain elements. Use <a> anchor instead of <span>.
Generally speaking it is not a good idea to wrap clickable elements inside other clickable elements. It's bad for accessibility and tab navigation and it can lead to easy missclicks from your users.
The right thing to do would be to put your two buttons next to each others to indicate that there is in fact two separate actions your users can take related to the file.

Apex buttons in Interactive Reports break when built-in search filter used

In Apex 5.0.2. I have created a copy-to-clipboard function in my interactive report. The user can copy the value of a hidden column by clicking on this button that is set in a column and is repeating in every row (see image below).
The copy column is edited with an HTML Expression which does the following:
<button class="copytoclipboard
t-Button
t-Button--noLabel
t-Button--icon
t-Button--stretch" customid="#COPY#" type="button">
<span class="t-Icon fa fa-copy" aria-hidden="true">
</span>
</button>
My Dynamic Action with the event 'click', jQuery selector .copytoclipboard has 2 true actions. 1 sets the value of a page item (text_field) by getting the customid from that row with:
this.triggeringElement.getAttribute("customid")
The second one then copies this value to the clipboard.
This works fine and when I inspect the button element, I see the correct HTML output, with the correct value. However, as soon as I use the built-in search filter in the Interactive Report, my button breaks and clicking this button does not trigger my dynamic actions anymore, however, inspecting the element still returns the expected HTML output.
Can somebody please clarify why this is happening, and how this could be avoided?
Thank you in advance.
I found the solution. I had to put the Event Scope of the Dynamic Action to Dynamic, which is set to Static by default. Using the built-in page filter does a PPR of the report, thus when static, the event handler is longer bound to the triggering element.
Static (default) - Binds the event handler to the triggering elements
for the lifetime of the current page, but will no longer be bound if
the triggering elements are updated via Partial Page Refresh (PPR).
Dynamic - Binds the event handler to the triggering elements for the
lifetime of the current page, including any triggering elements that
are recreated via Partial Page Refresh (PPR).
Once - Binds the event
handler to the triggering elements for a once only event.

How to automate to click a button which has no ID

<div class="add" data-icon="'" ng-show="!editMode" ng-click="btnAdd()"> Add an Honor or Award </div>
Above is the html code for the button i am trying to click (Add an Honor or Award), but this button doesn't have an unique ID, and keeps on changing the xpath as the user adds multiple data.
Use css
[class='add'][ng-click='btnAdd()']
xpath is also another option
//div[contains(.,'Add an Honor or Award')]
Or,
//div[#class='add']

Failed click using Selenium and XPath

For test automation on a web app I am currently using Robot framework and the Selenium library. There comes the moment I want to click on a button and then I wait for an element to appear. Alas, the click, although recorded successful in the log, does not lead to the apparition of the element I wish. In fact it is as if the click never happened.
To click on the button, I retrieve it using xpath. Using Firepath I successfully verified that the element is unique and does exist but what it shows leads me to think I have found why the button is not clicked correctly
You can see in light blue the button I want to click on and wrapped with dotted line the zone detected by firepath.
Is it possible that the click is done next to the button instead on it ?
Here is the incriminated line :
Click Element xpath=(.//button[contains(#id,'editContract')])[1
Edit :
HTML of the page :
<button id="listContractTableForm:listContractTable:0:editContract" name="listContractTableForm:listContractTable:0:editContract" type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only" onclick="window.location.href='destinationPage?faces-redirect=true&contractEntityContractId=678'">
<span class="ui-button-icon-left ui-icon ui-c ui-icon-search"></span>
<span class="ui-button-text ui-c">ui-button</span>
</button>
Assuming you want the span with class containing ui-button-icon-left ui-icon ui-c ui-icon-search
//button[contains(#id,'listContractTableForm')]/span[contains(#class,'ui-icon-search')]
if you want the span with class="ui-button-text ui-c" simply change the class in the xpath