4

I'd like to use the scrollbar on the popups from the below page. If you click any product on the page it will open a popup where you can add extra items. I'm trying to use Keys.send_keys(Keys.ARROW_DOWN) to scroll down the popup but I can't find the scrollbar element in Chrome. I've tried moving to elements using other methods without success so would like to try with the arrow keys.

https://www.just-eat.co.uk/restaurants-mcdonalds-victorialondon/menu

I managed to use the arrow keys on the popups in FireFox but can't replicate in Chrome.

2
  • 1
    please share the code you already tried Commented Dec 19, 2021 at 11:12
  • I've tried quite a bit, here stackoverflow.com/questions/69856165/… but have hit a dead end and therefore would like to try accessing the arrow keys Commented Dec 19, 2021 at 14:44

4 Answers 4

4
+50

You can try to find an element inside the popup then use that element to scroll. The trick here is to make sure the element is focusable so that you can use that for scrolling using arrow keys. focusable elements are the ones that can receive keyboard events, the elements that has a focus function declared inside it. Since the w3c documentation http://www.w3.org/TR/DOM-Level-2-HTML/html.html is not updated for a long time, we don't have a list of focusable elements, but some of the focusable elements according to it are HTMLInputElement, HTMLSelectElement, HTMLTextAreaElement, HTMLIFrameElement, HTMLButtonElement, HTMLAnchorElement and any element with a tabindex.

Following is a sample code snippet for your reference.

from selenium.webdriver.common.keys import Keys

focusable_element_in_popup = driver.find_element_by_id('id_of_the_element')
focusable_element_in_popup.send_keys(Keys.ARROW_DOWN)

#or you can use //a magic using xpath to return you the any first link on popup, like below

#driver.find_element_by_xpath('//div[@class="some-class"]//a') 

or you can also use move_to_element or scrollIntoView as below. If this doesn't work as expected try adding actions.click() after move_to_element to focus it.

from selenium.webdriver.common.action_chains import ActionChains

element = driver.find_element_by_id("my-id")

actions = ActionChains(driver)
actions.move_to_element(element).perform()

#actions.move_to_element(element)
#actions.click()
#actions.send_keys("SOME DATA")
#actions.perform()

#or 

driver.execute_script("arguments[0].scrollIntoView();", element)

Some trial and error might be required at first to get it right for your use case.

Sign up to request clarification or add additional context in comments.

1 Comment

Thanks, I didn't realise I could use send_keys based on an element in the popup, I thought I had to locate the scrollbar. Action chains doesn't work for me, it always scrolls past the popup but manually scrolling arrow_down works.
2

I like using JavaScript to scroll down when using Selenium. It's a lot more reliable from my experience.

Try the following:

X = 500
DRIVER_NAME.execute_script("window.scrollBy(0, X)")

Another option is to circumvent the need to scroll in the first place by injecting CSS into the webpage. You can write several lines of CSS code that would make the popup's font and line-height very small; this way, you'll be able to fit everything into the screen without scrolling.

Here's how that would look like:

new_css = "body{background-color: white;}"
DRIVER_NAME.executeScript("$('<style type=\"text/css\">new_css</style>').appendTo('html > head');");

One of the two solutions above should solve your problem.

1 Comment

Thanks for the help. The first solution scrolls the window behind the popup, not the actual popup. I tried switching to alert but that raises an error that there's no alert (the popup isn't an alert). The second solution isn't one I've come across before, I am using python so I changed it to DRIVER_NAME.execute_script but got an error selenium.common.exceptions.JavascriptException: Message: javascript error: $ is not defined
0

I am not sure what have you tried already and what is failing, but since you mentioned the presence of a pop up window, you need to make sure that you are operating on the correct window (i.e. popup).

Please check here for more details : focus different window

Once you have verified that you are operating on the correct window, the replies above should do the trick. You may also find this link useful to scroll a webpage

Last but not least, it is always advisable to share a reproducible example of your code to help others help you ;) Best of luck

1 Comment

It looks like the popup isn't another window, I printed the window_handles when the popup is open and there's only one element in the result list, which I'm assuming is the main window? Unfortunately everything I've read talks about scrolling a webpage but not about scrolling a popup
0

You can use driver.switch_to.active_element to focus on the pop up and use Keys.ARROW_DOWN on it

driver.find_element_by_css_selector('[data-test-id="menu-item"]').click()  # open the popup
driver.find_element_by_class_name('c-modal-titleContainer').click()  # make the popup the active element
popup = driver.switch_to.active_element  # and switch to driver focus to it
for _ in range(10):
    popup.send_keys(Keys.ARROW_DOWN)

4 Comments

Thanks, this scrolls down the popup. I am currently using it in a while loop where I try to click the element and if there's an error then I do popup.send_keys(Keys.ARROW_DOWN). However, when the popup scrolls the element into view the element still isn't clicked! I get an error telling me the "add to order" button would recieve the click instead of the element, it seems that this button is 'overlayed' on the screen in some way, even though pyhsically I can see the element is in view it's still not able to be clicked. Any ideas on how to make the element clickable as I scroll it in view?
@Callum I don't know what you are trying to click but you can always use JavaScript click element = driver.find_element... driver.execute_script('arguments[0].click();', element)
This is such a weird popup, this driver.execute_script('arguments[0].click();', element) selects the element but it doesn't click it in the same way element.click() does. It's hard to explain but the popup realised it's not been clicked 'properly', is it easier if I share screenshots of what's happening or you try to recreate?
@Callum What are you trying to click and what is the code you are using?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.