'Unable to programmatically click on <tr> or <td>
I'm working on a Firefox extension that streamlines ticket creation. I've run into a problem where I can't programmatically fire a click on a <tr> or <td>. I can navigate to the node successfully with Xpath or querySelectorAll but nothing happens when firing a click with .click(); or MouseEvent.
<div class="MenuOuter" armenuelementserial="0"
style="z-index: 100015; left: 797px; width: 153px; height: 498px; top: 165px; visibility: inherit;">
<div class="MenuScrollUp" style="background-image: url("../../../../resources/images/menu_up.gif"); width: 151px; visibility: hidden;"></div>
<div class="MenuTableContainer">
<table class="MenuTable" style="width: 151px;" cellspacing="0" cellpadding="0">
<tbody class="MenuTableBody">
<tr class="MenuTableRow">
<td class="MenuEntryName" nowrap="">ATM Switched</td>
<td class="MenuEntryNoSub" arvalue="ATM Switched"></td>
</tr>
<tr class="MenuTableRow">
<td class="MenuEntryName" nowrap="">Customer Service</td>
<td class="MenuEntryNoSub" arvalue="Customer Service"></td>
</tr>
<tr class="MenuTableRow">
<td class="MenuEntryName" nowrap="">DNS/Email Order Coordination</td>
<td class="MenuEntryNoSub" arvalue="DNS/Email Order Coordination"></td>
</tr>
</tbody>
</table>
</div>
<div class="MenuScrollDown" style="background-image: url("../../../../resources/image/menu_down.gif"); width: 151px; visibility: hidden;"></div>
</div>
//XPATH
document.evaluate("//td\[text()='ATM Switched'\]", document.body, null, 9, null).singleNodeValue.click();
//querySelector
document.querySelectorAll('.MenuOuter tr')[0].click();
//mouseEvent
var mEvt = new MouseEvent("click", { bubbles: true, cancelable: true, view: window });
var ele = document.querySelectorAll('.MenuOuter tr')[0];
ele.dispatchEvent(mEvt);
//mousedown/mouseup
var mDn = new MouseEvent("mousedown", { bubbles: true, cancelable: true, view: window });
var mUp = new MouseEvent("mouseup", { bubbles: true, cancelable: true, view: window });
var ele = document.querySelectorAll('.MenuOuter tr')[0].querySelectorAll('td')[0];
ele.dispatchEvent(mDn);
ele.dispatchEvent(mUp);
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
