I want to change the css element style using Python Selenium while doing automation to increase the height of the page. The html of the element is as follows:
<div style="overflow-y:scroll;overflow-x:hidden;height:150px;">
I know that I can use something like the code below to do this:
driver.execute_script("document.getElementById('id name').style.height = '2000px';")
or
driver.execute_script("document.getElementByClassName('class name').style.height = '2000px';")
But there is no id or class in the HTML (there's only style).
If no ID or class is present then please use CSS
driver.execute_script("document.getElementByCss('div[style='overflow-y:scroll']').style.height = '2000px';")
But you should check in HTML DOM for the mentioned CSS :
Please check in the dev tools (Google chrome) if we have unique entry in HTML DOM or not.
Steps to check:
Press F12 in Chrome -> go to element section -> do a CTRL + F -> then paste the CSS and see, if your desired element is getting highlighted with 1/1 matching node.
CSS you should check :
div[style='overflow-y:scroll']
or
div[style='overflow-y:scroll'][sytle$='height:150px;']
or
div[style='overflow-y:scroll;overflow-x:hidden;height:150px;']
Whichever has the unique entry put that in execute_script and you should be good to go after that.
Alternate way to do
element = driver.find_element_by_css_selector("div[style='overflow-y:scroll;overflow-x:hidden;height:150px;']")
driver.execute_script("arguments[0].setAttribute('style','overflow-y:scroll;overflow-x:hidden;height:2000px;')", element)
Related
This question already has answers here:
selenium.common.exceptions.InvalidSelectorException with "span:contains('string')"
(2 answers)
Closed 1 year ago.
When I try to use :contains in Selenium's By.CSS_SELECTOR, such as
presence = EC.presence_of_element_located((By.CSS_SELECTOR, ".btn:contains('Continue Shopping')"))
or
presence = EC.presence_of_element_located((By.CSS_SELECTOR, ".btn\:contains('Continue Shopping')"))
or
presence = EC.presence_of_element_located((By.CSS_SELECTOR, ".btn\\:contains('Continue Shopping')"))
the Python program crashes with the error
Exception: Message: invalid selector: An invalid or illegal selector was specified
(Session info: chrome=95.0.4638.54)
Is it possible to use :contains in Selenium? The CSS selector
$('.btn:contains("Continue Shopping")')
works fine in Chrome's JS console.
Using Chrome 95.0.4638.54, ChromeDriver 95.0.4638.54, Python 3.10 on Ubuntu 20.04.
The selector :contains('text') is a jQuery selector, not a valid CSS selector like Selenium is expecting. I'm assuming the reason it works on the page via Chrome's DevTools console is because the page has jQuery defined on it.
Unfortunately, I do not believe you can directly select an element via its text using a CSS selector (link).
You have two options as far as I can see:
Alter your selector to be class or ID based (easiest)
Create a Selenium utility to run a JS script that uses this jQuery selector; e.g. execute_script("jQuery(" + id + ":contains('" + text + "')", id, text)
As mentioned by Aspok your CSS locators are not a valid CSS locators.
To locate element based on it text you can use XPath locator, something like:
//*[contains(#class,'btn') and(contains(text(),'Continue Shopping'))]
In case btn is the only class name attribute of that element your XPath can be
//*[#class='btn' and(contains(text(),'Continue Shopping'))]
As explained by #aspok, it is not a valid css selector.
In case you would like to have XPath for the same, and .btn is class and have text/partial text
Continue Shopping
You can try the below XPath :
//*[contains(text(),'Continue Shopping')]
or
//*[contains(text(), 'Continue Shopping') and contains(#class, 'btn')]
Please check in the dev tools (Google chrome) if we have unique entry in HTML DOM or not.
xpath that you should check :
//*[contains(text(), 'Continue Shopping') and contains(#class, 'btn')]
Steps to check:
Press F12 in Chrome -> go to element section -> do a CTRL + F -> then paste the xpath and see, if your desired element is getting highlighted with 1/1 matching node.
Also, Just letting you know that, //* can be replaced by tag name, if you found multiple matching nodes.
Im trying to get videos length using xPath but the aria-label changes on every video it looks like this //*[#aria-label="10 seconds"]
How can i specify this element path
here's the html source
<span id="text" class="style-scope ytd-thumbnail-overlay-time-status-renderer" aria-label="20 seconds"> 0:20 </span>
If this id is unique text
directly try to extract the .text or do a .get_attribute
Using .text :
video_len = driver.find_element_by_id('text').text
print(video_len)
Using .get_attribute() :
video_len = driver.find_element_by_id('text').get_attribute('aria-label')
print(video_len)
PS : Please check in the dev tools (Google chrome) if we have unique entry in HTML DOM or not.
Steps to check:
Press F12 in Chrome -> go to element section -> do a CTRL + F -> then paste the xpath and see, if your desired element is getting highlighted with 1/1 matching node.
You can try the same two methods with the below css
span.style-scope.ytd-thumbnail-overlay-time-status-renderer
always check in HTMLDOM, if we have unique entry or not for any locator.
I was wondering if there is any way to find element by class name if the class name have a static param and dynamic param, I'll explain:
I got
< class="**dataset-selection-dialog-actions** *ng-tns-c139-19*" >
the 'dataset-selection-dialog-actions' is static but 'ng-tns-c139-19' can be change of any reload page.
can I locate this element without the dynamic param ?
thanks.
yes why not.
Please use find_element_by_class_name('dataset-selection-dialog-actions')
but make sure that it is unique element in HTMLDOM.
to check if it is unique or not, use this css selector, .dataset-selection-dialog-actions
PS : Please check in the dev tools (Google chrome) if we have unique entry in HTML DOM or not.
Steps to check:
Press F12 in Chrome -> go to element section -> do a CTRL + F -> then paste the css selector .dataset-selection-dialog-actions and see, if your desired element is getting highlighted with 1/1 matching node.
Quick info: I'm using Mac OS, Python 3.
I have like 800 links that need to be clicked on a page (and many more pages to go so need automation).
They were hidden because you only see those links when you hover over.
I fixed that by injecting CSS rule (just saying in case its the reason it's not working).
When I try to find elements by xpath it does not want to click the links afterwards and it also doesn't find all of them always just 4 (even when more are displayed in view).
HTML:
Display
When i click ok copy xpath in inspect it gives me:
//*[#id="tiles"]/li[3]/div[2]/ul/li[2]/a
But it doesn't work when I use it like this:
driver.find_elements_by_xpath('//*[#id="tiles"]/li[3]/div[2]/ul/li[2]/a')
So two questions:
How do I get them all?
How do I get it to click on each of them?
The pattern in the XPath is the same, with the /li[3] being the only number that changes, for this I created a for loop to create them all based on the count on page which I did successfully.
So if it can be done with the XPaths generated by myself that are corresponding to when I copy XPath in inspector then I only need question 2 answered.
PS.: this is HTML of parent of that first HTML:
<li onclick="openPopup(event, 'collect', {item_id: 165214})" class="collect" data-item-id="165214">Display</li>
This XPath,
//a[.="Display"]
will select all a links with anchor text equal to "Display".
As per your question, the HTML you have shared and your code attempts there is no necessity to get the <li> tags. Instead we will get the <a> tags in a list. So to answer your first question How do I get them all you can use the following line of code :
all_Display = driver.find_elements_by_xpath("//*[#id='tiles']//li/div[2]/ul/li[#class='collect']/a[#title='Display']")
Next to click on each of them you have to create a loop to iterate through all the <a> tag as follows :
all_Display = driver.find_elements_by_xpath("//*[#id='tiles']//li/div[2]/ul/li[#class='collect']/a[#title='Display']")
for each_Display in all_Display :
each_Display.click()
Using an XPath with elements by position is not ideal. Instead use a CSS selector to match the attributes for the targeted elements.
Something like:
all_Display = driver.find_elements_by_css_selector("#tiles li[onclick][data-item-id] a[title]")
You can then click them in a loop if none of them is loading a new page:
for element in all_Display:
element.click()
I am trying to click a small button, which has no "ID" or "Name", on a website. The only unique identifier is onclick, which is as follows:
onclick="submitForm('DefaultFormName',1,{'param1':'HXCTIMECARDACTIVITIESPAGEXgm7J5oT','serverValidate':'1uCdqvhJe','param2':'',event:'details|1'});return false;"
However, another button on the page has the following onclick:
onclick="submitForm('DefaultFormName',1,{'param1':'HXCTIMECARDACTIVITIESPAGEXgm7J5oT','serverValidate':'1uCdqvhJe','param2':'',event:'details|2'});return false;"
The only difference is a 1 vs. a 2 in the middle of the code. I tried to use a "find_element_by_css_selector" with the following code but it didn't work:
driver.find_element_by_css_selector(".x1p[onclick*='details|1']").click()
Another option would be selecting the preceding element, with the following code:
precedingbutton = driver.find_element_by_name('B22_1_6')
And then sending tab and then enter. However, after I send Tab, I don't know of a way to send Enter without assigning the Send_Keys command back to the preceding box, which deselects the button I want.
Let me know if you can help!
If you can locate the parent, you can locate the child, either with xpath or the nth-child css selector, relative to it.
Edit in response to comments:
Assuming by "2 elements away" you mean it is a sibling preceding the target, try something like td[name="B22_1_6"] + td + td. This is the sibling selector.
You can do it easily by
driver.find_element(By.XPATH, 'your xpath').click()
For finding the xpath , just inspect the button with firebug, and in html tab right click on selected element and click on Copy XPath.
Hope it will help you.