Trying to execute a event with javascript on an <a> element - javascript

The reason i need to execute the event behind a a element is because i'm working on some kind of autologin, however one of the sites it has to work with is https://create.kahoot.it/#login?a=1&next= the problem is, their login uses an a element for the sign in button, however when i select that element and execute a .click on it it simply doesn't do the same thing as to what happens when a user clicks on it.
I hope someone could answer this question since i couldn't find anything close to this issue anywhere.
Also for the convenience of whoever helps, to select the element from the console you could use:
document.getElementById('sign-in').getElementsByTagName('a')[1];
The way to solve this issue has to be either javascript or JQuery, preferably just plain javascript.

Try this:
document.getElementsByClassName('btn register')[0].click();
This basically is selecting the anchor by its class name and fire click event manually.
UPDATE:
Alright I did some more research and it seems there is another way of triggering that click handler and it is to set href on the window:
var a = document.getElementsByClassName('btn register')[1];
window.location.href = a.href;
I've tried it and seems it is doing the job.

Related

Is there a way to detect whether there is an element blocking a clickable element using Selenium?

I'm trying to create a script that would click on every link on a given URL, but occasionally there are pop-ups/overlays that appear that block the link.
Would be be possible to detect these pop-ups/overlays using Selenium or Javascript?
I've tried using is_displayed, is_enabled, and EC.element_is_clickable but nothing seems to work.
EDIT: I'm hoping to find a way to detect the blocking element without having to click.
this using this:
try:
element.Click()
except ElementNotClickableException as x:
//handle not being able to click element here, you can try to select the element by taking the attributes that are returned in the exception message, or check the exception message to see if it really is an ad, something like x.Message.Contains("class=pop-up")
Hope it helps

Selenium click event does not trigger angularjs event

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.

JavaScript onClick does not work in Firefox

I have a confirmation popup that opens when a user clicks on this link:
<a onClick="openPopup('#popup1')">foo</a>
here is the relevant JavaScript:
function openPopup(id) {
$(id).show();
event.preventDefault();
$(id).addClass('is-visible');
$(id).css("z-index", "999999999999999999999999");
}
In Safari and Chrome it works fine. In Firefox, however, the trigger does not seem to work. Any ideas why?
I already tried to change the link like so:
foo
no changes though. thanks for your help!
In Firefox, however, the trigger does not seem to work. Any ideas why?
Firefox does not make the event object global. You have to pass it along to the event handler, e.g.
onClick="openPopup('#popup1', event)"
Since you are using jQuery, you should bind the handler with jQuery so that you can also use jQuery's augmented event object.
I think what you might be experiencing is a problem with the uppercase C in onClick. Try changing it to onclick (all lowercase).
See this question:
onclick or onClick?
Also you may have trouble accessing the event object:
Access global event object in Firefox
But it the case of your example I don't think you will need it.
event.preventDefault prevents the browser trying to follow a href of a link when it is clicked (you don't have an href in your example). If the link gets followed, and your browser navigates to another page you will not get a chance to see any error that may have happened and it can be very frustrating to work out what is going on, so if you do need to use event.preventDefault make sure it is on the first line of the function it is in

Fix Hijacked Event Handling of Click-Events

For a few years now I use user-JavaScript to put additional input buttons and clickable span-elements on pages. Usually I manage to make this work, e.g.
span = document.createElement("span");
span.onclick = __oujs.onClickAddPage;
span.appendChild(document.createTextNode("Add page"));
containingDiv.appendChild(span);
Usually __oujs.onClickAddPage() is called when I click on that span-element.
However, yesterday a site made some changes (apparently I have no clue what they were) that causes clicking on my elements to not cause any events. In the example above __oujs.onClickAddPage() is not called any more. The same is true for input-elements of type "button".
As I'm using Opera, DragonFly shows that my span still is the top-most element in that particular area and, therefore, it should handle the click-event. However, I understand that they include jQuery, which might be part of the misery.
Is there a special technique (maybe with a name that Google knows of) they use to able to do such thing? How do I get the control back and have my code called again? Can I remove some object?
I'm sorry for asking in a rather broad style, but I have no clue what I can look for to fix this myself. Please ask if you need to know something.
I would suggest you this steps:
Create the next function:
function stubFn(event){
console.log('event caught', event); // this will log the click event
__oujs.onClickAddPage.call(event.currentTarget, event); // emulate the onclick behavior
}
Use span.addEventListener('click', stubFn) to add the listener to the element in your code.
If it does not work, then you have to reverse-engineer the script and markup.
I'd suggest to check if there is any element with absolute or fixed position overlapping your span. It can prevent the event propagation.
In general, there are no ways to forbid the elements from userscripts to handle events using inlined handlers.
To get this off my open questions I answer this myself rather than waiting for it to be closed:
I'm sorry, it was my fault. I had a stupid mistake in another user-JavaScript file that affected all sites...
I reinstalled my browser and was thinking about reinstalling my OS, but luckily this isn't necessary.

What is meant by javascript:// in the href of a link

Yesterday, I visited a forum. There was like and Dislike button under the each post. When I click the Like button, the Like was counted without any page reload. Meaning Ajax was working, but when I check the href of that like link that was like this:
<img src="dbtech/thanks/images/likes.png" alt="Likes" title="Likes"> Like
I have also checked (using Visual Event) that there is no event listener attached to that link. So, I cant understand that how it works. Can some one explain?
javascript: return 0;
Does the same thing.
This would just uselessly create a random regular expression literal and then discard it. It is probably some programmer's ignorance.
This is included because an a tag has to have an href.
On its own, a link with href="javascript://" does nothing at all when clicked. This is as opposed to a link with href="#", which will set the anchor of the current location to #, or a blank or unset href, which will cause navigation to the current page.
In this case, since there's no explicit onclick handler and no event handler attached to this link, there must be some a event handler at a higher level that's catching click events as they bubble up to the page. Without being able to see the site, it's impossible to say for sure how it's working, but my guess would be that the data-button="likes" attribute is involved here.

Categories