I am writing a tampermonkey script on chrome to simulate a mouse click and find that only document.getElementById('id').click()
trigger the correct behaviour.
The expected behaviour is to show and hide a date-picker. With $('#id').trigger('click')
I can only hide the date-picker. I do not think I should add more details because that may just add more confusion.
The page is Telerik based, so I have not found an easy way to simplify the page and isolate the issue.
Update:
Here is the DOM code
<a title="Open the calendar popup." href="#" id="id" class="rcCalPopup">
Open the calendar popup.
</a>
After reading this and this, it looks like a
or the content of a
is causing this issue.
This is all about what you are clicking and it is not the tag but the thing within it. Unfortunately, bare text does not seem to be recognised by JQuery, but it is by vanilla javascript.
Can anyone help confirm this?
Update 2:
I have created a jsfiddle here. It is not ideal, because I have to add dependency of Telerik to reproduce the issue.
setTimeout(function () {
$('#id')[0].click(); // Show the date-picker
document.getElementById('id').click(); // Hide the date-picker
$('#id').trigger('click'); // Not working, should show the date-picker again. Tried for <button> and it worked fine.
}, 1000);