Button element not interactable - python-3.x

I've been building an automated checkout script in Python 3.8 for the following website https://fasttimes.com.au/ (site built using Magento) and all buttons, drop downs, inputs etc have functioned up until this point. At the shipping selection stage however the button responsible for saving shipping details and allowing proceeding to billing stage, according to the python console reads; "Message: element not interactable".
I have tried using execute_script to directly interact with the site, this does not yield an error and says it's completed, but within the WebDriver the button hasn't actually been clicked and so proceedings to the next step of checkout do not take place. As for 'Action Chains'. they simply yield the error above, same as finding by XPATH or CSS_Selector. I've tried using the import 'Keys' and attempting to action the button with the ENTER key, as well as using the WebDriver substitute .send_keys(u'\ue007') to no avail. Before it's mentioned below I've also tried using waits, however maybe I'm doing them wrong?
E.g
element = WebDriverWait(driver, 15).until(
ec.presence_of_element_located((By.ID, "login:guest")))
Correct me if above line is incorrect formatting
Site's HTML is as follows:
<div class="buttons-set" id="shipping-method-buttons-container">
<p class="back-link"><small>« </small>Back</p>
<button type="button" class="button" onclick="shippingMethod.save()"><span><span>Continue</span></span></button>
<span id="shipping-method-please-wait" class="please-wait" style="display:none;">
<img src="https://static.fasttimes.com.au/skin/frontend/ultimo/default/images/opc-ajax-loader.gif" alt="Loading next step..." title="Loading next step..." class="v-middle"> Loading next step... </span>
</div>
My current code is:
driver.find_element_by_xpath("//*[#id='shipping-method-buttons-container']/button").send_keys(u'\ue007')
Any suggestions would be greatly appreciated. I believe the button that I'm trying to interact with is
<button type="button" class="button" onclick="shippingMethod.save()"><span><span>Continue</span></span></button>
...but I'm not too sure. I feel like I've at this point exhausted all possible avenues, but I refuse to believe this damned button isn't intractable! Thank you:)

As you've mentioned you want to proceed to Billing stage, I understand you are at step 1 of the checkout process. Am saying this because what you have identified with xpath //*[#id='shipping-method-buttons-container']/button is the button at step 4 Shipping Method, which is indeed not intractable yet.
You need to select the Checkout Method first, and carry on from there. Give this a try:
driver.find_element_by_id('login:guest').click() # select the "Checkout as Guest" radio button
WebDriverWait(driver,20).until(EC.element_to_be_clickable((By.XPATH,"//*[#id='onepage-guest-register-button']")))
driver.find_element_by_xpath("//*[#id='onepage-guest-register-button']").click() # click Continue
Alternatively, if it's step 4 you're really stuck at:
WebDriverWait(driver,20).until(EC.element_to_be_clickable((By.XPATH,"//*[#id='shipping-method-buttons-container']/button")))
driver.find_element_by_xpath("//*[#id='shipping-method-buttons-container']/button").click()

Related

How to click toggle switch in webdriverIO

the HTML Element looks like
<div class="toggleButton" ng-class="{checked: settings.$storage.enabledApps[app.name]}" ng-click="settings.apps.toggleApp(app.name)"><input class="workplayEnabled switch" type="checkbox" ng-checked="settings.$storage.enabledApps[app.name]"></div>
i tried browser.click('.toggleButton .switch'),browser.click('.toggleButton'), browser.click(' .switch')
but it's not working
it throws the error as element not visible
whereas if i try browser.isSelected('.toggleButton .switch'),browser.isSelected('.toggleButton'), browser.isSelected(' .switch') it returns false
As it stands, it's really hard to pin-point your EXACT problem as you're doing multiple things wrong.
HTML breakdown:
that is HTML generated via AngularJS;
if you analyze the Angular attributes (ng-attributes/directives) you'll notice only your <div> has click-triggered functionality added (via ng-click="settings.apps.toggleApp(app.name)"), thus you only have to target the <div> element;
the <input> only has reactive behavior (if the toggle-button is checked, then it gets populated on ng-checked trigger);
Your problem: Now that we narrowed down the solution to clicking your <div>, we need to make sure your selector is returning the correct element.
open your Angular app, open the browser console & try seeing if your selector is working (e.g.: $(div.toggleButton)). If the CSS-selector returns more than an element($(div.toggleButton).length > 1), that means you have multiple <div>s with that class so you will have to find a more specific locator;
after you have found the correct locator for your <div>, I would add a .debug()(more info here) prior to your click in your WebdriverIO script so I could easily debug the scenario;
once in debug-mode, I would try with the same selector that found my element in the browser console.
!!! Note: .isSelected() will always return false in your scenario as you mentioned you failed to click the toggle switch, which is satisfying the ng-checked condition. You can verify this by manually selecting your toggle switch in debug-mode and then performing the .isSelected() command on your <input>. Then it should return true.

Trouble handling hidden element with selenium

Every time I run this code, I get an issue reaching to the targeted page. The site requires post request parameter to be filled in to reach the page where I am after. However, using get request it was good to go until it hits "Var4" parameter within my code. Inspecting element I could see that it indicates as hidden. If i left the hidden parameter blank then it redirects to another location. So, satisfying this thing to get to the targeted page is beyond my capability. Any suggestion will be appreciated.
from selenium import webdriver
driver = webdriver.Chrome(r"C:\Users\ar\Desktop\Chromedriver\chromedriver.exe")
driver.get('https://www.infocomm.org/cps/rde/xchg/infocomm/hs.xsl/memberdirectory.htm')
Var1='Professional Services Providers'
Var2='AUSTRALIA'
Var3='0'
Var4='1'
driver.find_element_by_xpath('//select[#name="mas_type"]').send_keys(Var1)
driver.find_element_by_xpath('//select[#name="mas_cntr"]').send_keys(Var2)
driver.find_element_by_xpath('//input[#name="OtherCriteria"]').send_keys(Var3)
driver.find_element_by_xpath('//input[#name="DoMemberSearch"]').send_keys(Var4)
driver.find_element_by_xpath('//input[#type="submit"]').click()
Element for the hidden stuffs which should be applicable for "Var4":
<form name="searchform" id="searchform" action="memberdirectory.htm" method="post" onsubmit="return Checkform();">
<input type="hidden" id="DoMemberSearch" name="DoMemberSearch" value="1">
<div class="login block-type-a block">
As workaround, you can try execute javascript with selenium.
For example, to unhide element
driver.execute_script("document.getElementById('DoMemberSearch').type = 'text';")
or set value directly
driver.execute_script("document.getElementById('DoMemberSearch').value = '%s';" % Var4)
you could not sendkeys to a hidden element, what you can do is to use javascript to send the value
probably something like this
driver.execute_script("document.getElementById('DoMemberSearch').value='1')

Cucumber/Capybara Selecting Button from Specific Class?

So i've ran into an issue, im trying to click a button...which unfortunately has the same text (IE there are 2 buttons on the page which the same text, basically a save button)
Lets pretend the button text is just "Save".
I did notice that they had different classes.
<button data-action="submit" class="btn btn-primary btn-save">Save</button>
whereas the other button is:
<button name="button" type="submit" class="btn btn-primary set-right">
<i class="glyphicon glyphicon-floppy-disk"></i> Save
</button>
I know glypicon is just an icon set....but they both seem to belong to the same class? but have different class names? (Sorry im not familiar with Rails)
It doesn't honestly matter which one I select as they both have the same function. I've seen where you can use xpath? but aren't we supposed to use css selectors or something now? (As in thats the newest way?) I may be wrong....
Could I use something like:
find(:xpath, '//button[#class="btn-save"]').click
Im trying to avoid "rails" only solutions, as not all the websites I test on are rails based.
You have various possibilities:
1) Find the button by its class
find(button.btn.btn-primary.btn-save).click
2) Find the button by its css selector or xpath (you can copy them using Google Chrome: right click -> Inspect -> right click on your element -> copy css or xpath)
find(:css, "your button css selector").click
find(:xpath, "your button xpath").click
If both buttons really do the same thing then you could always just do
first(:button, 'Save', minimum: 1).click
which will be less prone to breakage as your page structure changes than using an xpath selector. The minimum:1 option will just make #first wait a bit until at least one button is on the page (like find would) - it may not be necessary depending on your test structure

How to click on link element with specific text using watir?

I'm not able to click on text link 'Add' using watir:
PAGE:
<div id="divAdd" style="float: right">
<a onclick="SwitchView('2')" style="color: #1B56A7; cursor: pointer;">Add</a>
</div>
Watir CODE:
browser.link(:text =>"Add").click
EXCEPTION:
Unable to locate element, using {:tag_name=>["a"], :text=>"Add"}
Please help me how to handle this?
If the page has a lot of ajax and javascript going on, you may just have to wait a little bit for the client side code to finish rendering the page after it has been loaded from the browser.
Try this
browser.link(:text =>"Add").when_present.click
If that does not work, then make sure the item is not in a frame or something..
btw, if there is more than one link on the page with the text 'Add' then you may have to specify a container outside the link that lets you identify which link you want. eg.
browser.div(id: => "divAdd").link.when_present.click
If
This would be my way of doing it.
while browser.div(:class, 'containerDIV').a(:text, 'Add').exists? do
browser.div(:class, 'containerDIV').a(:text, 'Add').click
end

Can not click <button> element using javascript onmousedown with Watir

Using Watir I have been able to isolate this button element:
<BUTTON id=authButton class=commandButton onmousedown="$('newOrder:hiddenAuth').click();">Authorize Payment</BUTTON>
Here is my watir code:
$browser.div(:id, "rSide:j_id750_body").table(:index, 0) [1] [0] .button(:index, 0).click
I was able to see I'm on the <button> by using watir's "flash" method to highlight the button. For some reason I am unable to actually click the button. I think it might have something to do with the onmousedown code but I really don't know. Any help would be greatly appreciated.
The button is wired up to do some specific action when it see's the onmousedown event, so if .click is not working, the next thing to try is firing that specific event, instead of using the .click method.
If that doesn't work try forcing the javascript to execute the newOrderLhiddenAuth script.
oh and FYI for your developer, they may want to get into the habit of using lower case for their HTML tags
"the World Wide Web Consortium (W3C) recommends lowercase in HTML 4,
and demands lowercase tags in XHTML."

Resources