I'm building a JavaScript Tizen app for Gear S2
In an earlier stage of development I considered using Angular, but I just ignored the possibility entirely because ng-click events made the screen flicker.
I kept building the app without any issues, my click event worked fine!
Until
I incorporated jQuery mobile
and suddenly my app now flickers when I "tap" the emulator.
I tried binding the event in 3 different manners, with the same result:
window.addEventListener("click", callback); // way 1
$(document).bind("click", changeMode); // way 2
$(document).bind("tap", changeMode); // way 3
does anyone have a clue of why this might be happening?
When do you bind the click event? Maybe you add the listener multiple times, so your Callback is also triggered multiple times.
Also why add the click listener to the window/document instead of a proper element?
I would also prefer to use ".on()" and ".off()" instead of bind.
Maybe you can share some of your code so we can "see" the problem?
Related
I have this page where an angularjs modal-content popup, in there i fill up some fields and click save. After save is initiated, popup should dissapear an event should happen and so on.
My selenium test does all that perfectly except that when it clicks on the save button, popup dissapears but no event is triggered or saved so when i open up the window again everything is empty. I've tried stuff that i know with selenium and it still doesn't work. Can anyone help me out here?
This is the save button:
<button class="save-button" data-ng-click="onSettingsSave()" ng-hide="readOnlyMode || !canSave()">Save</button>
Stuff i've tried:
var saveButton = driver.FindElement(By.CssSelector("button.save-button"));
saveButton.Click();
var saveButton = driver.FindElement(By.XPath(saveXpath));
saveButton.SendKeys(Keys.Enter);
((IJavaScriptExecutor)driver).ExecuteScript("arguments[0].focus();",saveButton);
((IJavaScriptExecutor)driver).ExecuteScript("arguments[0].click();",saveButton );
Try force clicking the element using pure JS:
driver.execute_script("arguments[0].click();", yourElement)
You can't use $ as a shortcut for document.querySelector in a script like that.
driver.ExecuteScript("document.querySelector('#base_element_id div input').click()");
Also this probably won't trigger an onClick in react / angular
Like the OP I have tried everything I can think of to get Selenium to trigger client side javascript events. I've seen some posts across the web of people having partial success where it randomly works; in my case it never works.
Selenium does successfully trigger the browsers primary click action, be it checking a checkbox or pressing a button, but it does not trigger any attached client side javascript events.
Both the native element.Click() method in selenium, and the abstracted ExecuteScript with arguments method of clicking as suggested by #csaladenes have the same result.
The only solution I have found so far is to use pure JS through that same ExecuteScript method; basically avoid the overload with params selenium can embed.
driver.ExecuteScript("$('#base_element_id div input').click()");
In my case I am using the JQuery that is already on my page to make locating the element easier, but any form of truly pure JS should do the same thing.
EDIT:
After some additional testing, it turns out that my "fix" really did nothing. However, performing the same click more than once did cause the client side events to fire.
In my case I am checking a checkbox, so I needed to perform the click 3 times to leave it in the correct state and still have the client side events run.
This is very odd, and definitely needs some more work to figure out where the issue is at that makes this necessary.
Edit 2:
I think I have finally found a solution, and at least partial answer, that does not make me cringe.
It seems as though Selenium has an issue where sometimes it "loses" the focus of the browser. Considering how consistent and repeatable my issue is I don't think focus is the only problem in my case, however the solution works pretty well.
I was able to get the immediate parent of my checkbox, which was a div element, click that first to return focus to the page, then click the checkbox. After that sequence of events the client side events worked correctly.
I have an app that was developed using Phonegap and JqueryMobile.
This app has been downloaded around 15.000 times total in iOS, Android and iPhone.
The code is exactly the same on all platforms.
Once in a while the backend server overloads and when I look at the logs I see that one user is sending hundreds of times the same call. (the users are real persons and I have talk to them about the issue, so its not bot or anything like that)
For me it seems that the either the click event is looping or the server call is looping but could not detect the reason why.
This has happen to 3 users out of 15.000 (as far as I know), and the users have used the app many times before the issue happened. The issue happened on Android and iOS so it seems to me that there is an issue on the jquerymobile/javascript side.
Any idea what could have cause this issue?
I'd say first watch out for design issues in your js/DOM generation.
When you bind an event that has already been bound, jquery will bind it again without checking if that event has already been bound. That is fine if you want to attach multiple
event functions to the same event.
Any way, there are several ways to solve this. One is to unbind the event before binding it, with $.off(), eg.
$("#myDiv").off("click").on("click", function(e) {
// ...
})
another is to check inside the event function if the event has already been fired, eg:
$("#myDiv").on("click",function(e) {
if(e.handled !== true) {
alert('Clicked');
e.handled = true;
}
})
You can find more solutions with their pros and cons here
I ended up disabling the button after the first touch and that fixed the issue.
It seems that the main problem was tapping the button twice, but for some reason I could not detect after that, it entered an infinite loop.
do you do event.preventDefault() and event.stopPropagation() in the onclick function? (without that, browsers behaviour may vary a lot)
Other thought, it may be usefull to hide or disable the buttons at the start of the onclick functions to avoid users from doing multiple clicks.
I'm sure you're already doing all this, but just in case...
Since I'm searching for an answer for a while now and I'm still without any clue, I'll just describe my actual problem:
I need to build up automated touch/mouse gestures (tap,drag,pinch...) which I can fire on a webpage in order to test touch frameworks and their performance. Thus I want to trigger "global" touch/mouse events on a webpage with JavaScript without dispatching them from a specific element.
Does anyone know how I could achieve this or how these events are delegated in general?
If you need this just for the sake of emulating mobile touch actions on your browser, Chrome already has a tool for that. Check out Mobile Emulation.
Using Chrome's developer tools I am trying to determine what jQuery function is hooking an input button on the page for debugging purposes. I usually just keep searching until I find it, but I figured I'd ask this time.
Is there a way to find a jQuery button hook for a specific button in Chrome? I've tried looking through the Event Listener Breakpoints, but can never seem to find the right thing to pause it.
Basically, I need to know what jQuery / Javascript is being executed after the button is clicked.
The hooks are implemented in the application like so:
$('.button_class').click(function (){
$('#button_id').click(function(){
etc...
try this :
$(yourbutton).data('events');
Depending on the number of events/timers on the page this doesn't always work. But you can try "pausing" before clicking the button you want to debug in the JavaScript debug window. That way the debugger will pause on the next line that executes. The thing that occasionally prevents you from using that is if there is a "hover" or mouse move/in/out event tied on an element you have to pass over to get to the button (including the button itself). In that case I just remove those events (if I can) until I get the one I want. The event listener breakpoints would be more ideal but they're sometimes difficult when using jQuery or another library, I've actually put in a feature request to the Chrome Dev Tools team to address this very issue. (allowing you to specify what files are "yours" and only "breaking" in those specific files)
good luck -ck
I have a select list where a change event has been bound to the element using jQuery. Something like this:
$("#someId").change(function() {..});
When someone chooses a new option in the select list, another part of the UI will change accordingly. Now this works fine when I use the mouse and click things, however, when using Watij to write my tests I need the jQuery change event to fire which it isn't doing.
The Watij test will correctly choose the select option required but the actual event does not get triggered. I have tried calling fireevent("change"); and fireevent("onchange"); to no avail. I have also tried ie.sendKeys("{ENTER}"); and ie.sendKeys("{TAB}"); which also does not seem to do the trick.
Any ideas?
The only solution I've found so far is to roll back the version of jQuery in use. I'm currently using version 1.4.1 (the offending version in regards to the testability of the change event on select boxes) and after going back to version 1.2.6 the problem goes away.
Use $('#someId').trigger('change'); to fire the event manually.
See the documentation for trigger().
When the combo/list value is changed with script the onchange is not supposed to fire. I don't know how Watij is doing that, but this is one case.
Second thing is that Watij is working with IE (as long as wikipedia is rght) and IE is putting a system control in place of Your list or combo and it might break something too. Try upgrading to IE8 which has a tiny bit better realisation of form components (eg. select finally supports "disabled" attribute in options after 10 years)
You might also be interested in a normal application GUI testing apps and use them on a browser with the webapp. Record a macro and check screenshots.