How do I select items from a custom dropdown for the page to change?-CodePudding

<bc-dropdown  options="Week 1,Week 2,Week 3,Week 4,Week 5,Week 6,Week 7,Week 8,Week 9,Week 10,Week 11,Week 12,Week 13,Week 14,Week 15,Bowls" selected="Week 1" uid="fd5704d7-8531-483b-9f92-96340b80da78">
            <!--r.4-->
            <div >
              <div >
                <div >
                  <div >
                    <p>
                      <strong >
                        Week 2</strong>
                    </p>
                    <span >
                      <i ></i>
                    </span>
                  </div>
                </div>
                <div >
                  <div  data-value="Week 1">
                    <strong >
                      Week 1</strong>
                  </div>
                  <div  data-value="Week 2">
                    <strong >
                      Week 2</strong>
                  </div>
                  <div  data-value="Week 3">
                    <strong >
                      Week 3</strong>
                  </div>
                  <div  data-value="Week 4">
                    <strong >
                      Week 4</strong>
                  </div>
                  <div  data-value="Week 5">
                    <strong >
                      Week 5</strong>
                  </div>
                  <div  data-value="Week 6">
                    <strong >
                      Week 6</strong>
                  </div>
                  <div  data-value="Week 7">
                    <strong >
                      Week 7</strong>
                  </div>
                  <div  data-value="Week 8">
                    <strong >
                      Week 8</strong>
                  </div>
                  <div  data-value="Week 9">
                    <strong >
                      Week 9</strong>
                  </div>
                  <div  data-value="Week 10">
                    <strong >
                      Week 10</strong>
                  </div>
                  <div  data-value="Week 11">
                    <strong >
                      Week 11</strong>
                  </div>
                  <div  data-value="Week 12">
                    <strong >
                      Week 12</strong>
                  </div>
                  <div  data-value="Week 13">
                    <strong >
                      Week 13</strong>
                  </div>
                  <div  data-value="Week 14">
                    <strong >
                      Week 14</strong>
                  </div>
                  <div  data-value="Week 15">
                    <strong >
                      Week 15</strong>
                  </div>
                  <div  data-value="Bowls">
                    <strong >
                      Bowls</strong>
                  </div>
                </div>
              </div>
            </div>
          </bc-dropdown>

I have this code which I need to change the selected dropdown using selenium in python however I cannot get it to work. I have tried many things including changing the selected attribute with this:

dropdown = browser.find_element(By.TAG_NAME, "bc-dropdown")
browser.execute_script("arguments[0].setAttribute('selected',arguments[1])",dropdown, value)

I cannot figure out how to do this. The problem is that if I change the selected attribute manually, the rest of the page does not change at all and since it is not a select element I cannot use the select features already built into selenium. Can anyone help me?

CodePudding user response：

You can try by providing load time using WebDriverwait

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//*[@class='hydrated' and contains(., 'Week 13')]"))).click()

#imports

from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.common.by import By
from selenium.webdriver.support import expected_conditions as EC

CodePudding user response：

You can click that dropdown (with years - from what I can understand from your request) and also dropdown for weeks -- and also reject the cookies, to be able to click those dropdowns -- with:

try:
    WebDriverWait(driver, 10).until(EC.element_to_be_clickable((By.ID, "onetrust-reject-all-handler"))).click()
    print('rejected cookies')
except Exception as e:
    print('no cookie button!')

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, 'bc-dropdown[options="2021,2022"]'))).click()
print('clicked years dropdown')
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, 'div[class^="bc-dropdown bc-wc-select-container"]'))).click()
print('clicked the weekly dropdown')
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, 'div[class^="bc-week-dropdown-width dropdown-menu"]'))).find_element(By.CSS_SELECTOR, 'div[data-value="Week 13"]').click()
print('selected Week 13')

Don't forget the imports mentioned by F.Hoque in his response. Selenium docs can be found at https://www.selenium.dev/documentation/

On another thought: the actual data you're after can be obtained in a more robust fashion, scraping the GraphQL endpoint which hydrates that page. If you will ask F.Hoque nicely, he might be inclined to tell you about it.