Having several problems clicking a button with selenium in Google Chrome
Question:
I’m trying to click a button but its being really difficult. More precise, I want to do it for several buttons. I have tried several options but none is working properly. Here is the html code for the button:
<button class="rlg-trade__action rlg-trade__bump --bump " type="button" data-alias="bd520a66-cc88-4af8-ba92-30111bbdbd02" data-preventtext="Bumping…">
<svg viewBox="0 0 24 24" s(By.CLASS_NAME,'rlg-trade') #Search each trade element, all of them include the bump button posted above.
for trades in trades_list:
bump = trades.find_element_by_css_selector('.rlg-trade__action.rlg-trade__bump.--bump').click()
print('Trade bumped successfully!')
time.sleep(1)
self.driver.find_element_by_css_selector('i.fa').click() #This is a click in the page to exit a box that appear after the click.
Have tried by xpath, not working either. Any help would be appreciated.
Output error: selenium.common.exceptions.NoSuchElementException: Message: no such element: Unable to locate element: {"method":"css selector","selector":"button.rlg-trade__action.rlg-trade__bump.–bump"}
<div class="rlg-trade" data-i="0"> its every item in the trade list section rlg-trading__intersect.
<div class="col-3-3 rlg-trading__intersect">
<div class="rlg-trade" data-i="0" style="">
<header class="rlg-trade__header
">
<a href="/player/isaacdl" class="rlg-trade__user">
<div class="rlg-trade__avatar"><img loading="lazy" class="rlg-trade__avatarimage" src="/content/media/users/avatar/128px/b35468f2331659986325.png" alt="isaacdl"></div>
<div class="rlg-trade__meta">
<div class="rlg-trade__username">
isaacdl
</div>
<span class="rlg-trade__info">
<span class="rlg-trade__time">
<span>5 hours ago</span>
<span>5 hours, 20 minutes, 40 seconds ago</span>
</span>
<span class="rlg-trade__delinfo">·
This trade will be deleted in <strong class="rlg-trade__timeleft">14 days</strong> if you don't bump it.</span>
</span>
</div>
</a>
<div class="rlg-trade__platforms">
<a target="_blank" rel="noopener" class="rlg-trade__platform" style="order: 100;" href="https://steamcommunity.com/profiles/76561198120028164" onclick="event.preventDefault();phishingAware('https://steamcommunity.com/profiles/76561198120028164');">
<img class="rlg-trade__platformlogo" src="https://static.rocket-league.com/assets/b81c8860521ff08c3d8194c2eca3491c1b158f13/images/logos/windowspc_black.svg" alt="Windows PC">
<div class="rlg-trade__platformname">
<span>Add on
Steam
</span>
<span>
auchan </span>
</div>
</a>
</div>
</header>
<div class="rlg-trade__content">
<div class="rlg-trade__labels">
<div class="rlg-trade__haslabel">
Has
</div>
<div class="rlg-trade__wantslabel">
Wants
</div>
</div>
<div class="rlg-trade__items">
<div class="rlg-trade__itemshas ">
<div class="rlg-item --very-rare --hover">
<div class="rlg-item__gradient --very-rare"></div>
<img loading="lazy" class="rlg-item__image" src="/content/media/items/avatar/220px/a67e907fb81451699877.png" alt="Cristiano ">
<div class="rlg-item__text">
<h2 class="rlg-item__name">Cristiano</h2>
</div>
<div class="rlg-item-links">
<a class="rlg-btn-primary --small" href="/items/wheels/cristiano">Item details</a>
<a class="rlg-btn-secondary --small" href="/trading/?filterItem=148&filterCertification=0&filterPaint=0&filterPlatform=0&filterItemType=1">Find trades</a>
</div>
</div>
<div class="rlg-item --very-rare --hover">
<div class="rlg-item__gradient --very-rare"></div>
<img loading="lazy" class="rlg-item__image" src="/content/media/items/avatar/220px/a67e907fb81451699877.png" alt="Cristiano ">
<div class="rlg-item__text">
<h2 class="rlg-item__name">Cristiano</h2>
</div>
<div class="rlg-item-links">
<a class="rlg-btn-primary --small" href="/items/wheels/cristiano">Item details</a>
<a class="rlg-btn-secondary --small" href="/trading/?filterItem=148&filterCertification=0&filterPaint=0&filterPlatform=0&filterItemType=1">Find trades</a>
</div>
</div>
</div>
<div class="rlg-trade__wantslabel rlg-trade__wantslabelalt">
Wants
</div>
<div class="rlg-trade__itemswants ">
<div class="rlg-item --premium --hover">
<div class="rlg-item__gradient --premium"></div>
<img loading="lazy" class="rlg-item__image" src="/content/media/items/avatar/220px/da6ecd87091575484054.png" alt="Credits ">
<div class="rlg-item__text">
<h2 class="rlg-item__name">Credits</h2>
</div>
<div class="rlg-item__quantity --quantity-80 --premium">
80 </div>
<div class="rlg-item-links">
<a class="rlg-btn-primary --small" href="/items/misc/credits">Item details</a>
<a class="rlg-btn-secondary --small" href="/trading/?filterItem=2615&filterCertification=0&filterPaint=0&filterPlatform=0&filterItemType=1">Find trades</a>
</div>
</div>
<div class="rlg-item --premium --hover">
<div class="rlg-item__gradient --premium"></div>
<img loading="lazy" class="rlg-item__image" src="/content/media/items/avatar/220px/da6ecd87091575484054.png" alt="Credits ">
<div class="rlg-item__text">
<h2 class="rlg-item__name">Credits</h2>
</div>
<div class="rlg-item__quantity --quantity-80 --premium">
80 </div>
<div class="rlg-item-links">
<a class="rlg-btn-primary --small" href="/items/misc/credits">Item details</a>
<a class="rlg-btn-secondary --small" href="/trading/?filterItem=2615&filterCertification=0&filterPaint=0&filterPlatform=0&filterItemType=1">Find trades</a>
</div>
</div>
</div>
</div>
</div>
<div class="rlg-trade__actions">
<button class="rlg-trade__action rlg-trade__bump --bump " type="button" data-alias="bd520a66-cc88-4af8-ba92-30111bbdbd02" data-preventtext="Bumping…">
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><g style="stroke-linecap:round;stroke-linejoin:round;stroke:#6a717f;fill:none;stroke-miterlimit:10" transform="translate(.5 .5)"><path d="m12 23v-13"></path><path d="m16 14-4-4-4 4"></path><g stroke="#6a717f"><path d="m4 17h-3v-16h22v16h-3"></path><path d="m1 5h22"></path></g></g></svg>
<span>Bump</span>
</button>
<a class="rlg-trade__action rlg-trade__edit --edit" href="/trade/edit?trade=bd520a66-cc88-4af8-ba92-30111bbdbd02">
<svg viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg"><g fill="none" stroke="#6a717f" stroke-linecap="round" stroke-linejoin="round"><path d="m9.5.5 2 2-5 5-3 1 1-3z"></path><path d="m10.5 8.5v2a1 1 0 0 1 -1 1h-8a1 1 0 0 1 -1-1v-8a1 1 0 0 1 1-1h2" stroke="#6a717f"></path></g></svg>
<span>Edit trade</span>
</a>
<a class="rlg-trade__action rlg-trade__disable --disable" href="/functions/disableTrade.php?trade=bd520a66-cc88-4af8-ba92-30111bbdbd02" onclick="return confirm('Are you sure you want to disable this trade? This trade will be permanently removed.')">
<svg height="20" viewBox="0 0 24 24" width="20" xmlns="http://www.w3.org/2000/svg"><g style="stroke-linecap:round;stroke-linejoin:round;stroke-width:1.2;fill:none;stroke:#6a717f;stroke-miterlimit:10"><path d="m20.3 4.7-15.6 15.6"></path><circle cx="12.5" cy="12.5" r="11"></circle></g></svg> <span>Disable trade</span>
</a>
<a href="/trade/bd520a66-cc88-4af8-ba92-30111bbdbd02" class="rlg-trade__action --comments">
<svg viewBox="0 0 18 21" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd" stroke="#545454" stroke-linecap="round" stroke-linejoin="round"><path d="m1.421053 1.421053h15.157895v18.526316h-15.157895z"></path><path d="m4.789474 4.789474h8.421053v5.052632h-8.421053z"></path><path d="m4.789474 13.210526h8.421052"></path><path d="m4.789474 16.578947h8.421052"></path></g></svg>
<span>Comments</span>
</a>
</div>
<div class="rlg-trade__note">
Have 2x of them. Please fast. </div>
<button class="rlg-trade__noteexpand" style="display: none;">Show full trade description</button>
</div>
<div class="rlg-trade rlg-trade-placeholder" data-i="1" style="height: 323px; box-shadow: none;"></div>
<div class="rlg-trade rlg-trade-placeholder" data-i="2" style="height: 323px; box-shadow: none;"></div>
<div class="rlg-trade rlg-trade-placeholder" data-i="3" style="height: 323px; box-shadow: none;"></div>
</div>
Answers:
Try use following xpath to click on the element.
for trades in trades_list:
trades.find_element(By.XPATH,'.//button[.//span[text()="Bump"]]').click()
print('Trade bumped successfully!')
time.sleep(1)
I’m trying to click a button but its being really difficult. More precise, I want to do it for several buttons. I have tried several options but none is working properly. Here is the html code for the button:
<button class="rlg-trade__action rlg-trade__bump --bump " type="button" data-alias="bd520a66-cc88-4af8-ba92-30111bbdbd02" data-preventtext="Bumping…">
<svg viewBox="0 0 24 24" s(By.CLASS_NAME,'rlg-trade') #Search each trade element, all of them include the bump button posted above.
for trades in trades_list:
bump = trades.find_element_by_css_selector('.rlg-trade__action.rlg-trade__bump.--bump').click()
print('Trade bumped successfully!')
time.sleep(1)
self.driver.find_element_by_css_selector('i.fa').click() #This is a click in the page to exit a box that appear after the click.
Have tried by xpath, not working either. Any help would be appreciated.
Output error: selenium.common.exceptions.NoSuchElementException: Message: no such element: Unable to locate element: {"method":"css selector","selector":"button.rlg-trade__action.rlg-trade__bump.–bump"}
<div class="rlg-trade" data-i="0"> its every item in the trade list section rlg-trading__intersect.
<div class="col-3-3 rlg-trading__intersect">
<div class="rlg-trade" data-i="0" style="">
<header class="rlg-trade__header
">
<a href="/player/isaacdl" class="rlg-trade__user">
<div class="rlg-trade__avatar"><img loading="lazy" class="rlg-trade__avatarimage" src="/content/media/users/avatar/128px/b35468f2331659986325.png" alt="isaacdl"></div>
<div class="rlg-trade__meta">
<div class="rlg-trade__username">
isaacdl
</div>
<span class="rlg-trade__info">
<span class="rlg-trade__time">
<span>5 hours ago</span>
<span>5 hours, 20 minutes, 40 seconds ago</span>
</span>
<span class="rlg-trade__delinfo">·
This trade will be deleted in <strong class="rlg-trade__timeleft">14 days</strong> if you don't bump it.</span>
</span>
</div>
</a>
<div class="rlg-trade__platforms">
<a target="_blank" rel="noopener" class="rlg-trade__platform" style="order: 100;" href="https://steamcommunity.com/profiles/76561198120028164" onclick="event.preventDefault();phishingAware('https://steamcommunity.com/profiles/76561198120028164');">
<img class="rlg-trade__platformlogo" src="https://static.rocket-league.com/assets/b81c8860521ff08c3d8194c2eca3491c1b158f13/images/logos/windowspc_black.svg" alt="Windows PC">
<div class="rlg-trade__platformname">
<span>Add on
Steam
</span>
<span>
auchan </span>
</div>
</a>
</div>
</header>
<div class="rlg-trade__content">
<div class="rlg-trade__labels">
<div class="rlg-trade__haslabel">
Has
</div>
<div class="rlg-trade__wantslabel">
Wants
</div>
</div>
<div class="rlg-trade__items">
<div class="rlg-trade__itemshas ">
<div class="rlg-item --very-rare --hover">
<div class="rlg-item__gradient --very-rare"></div>
<img loading="lazy" class="rlg-item__image" src="/content/media/items/avatar/220px/a67e907fb81451699877.png" alt="Cristiano ">
<div class="rlg-item__text">
<h2 class="rlg-item__name">Cristiano</h2>
</div>
<div class="rlg-item-links">
<a class="rlg-btn-primary --small" href="/items/wheels/cristiano">Item details</a>
<a class="rlg-btn-secondary --small" href="/trading/?filterItem=148&filterCertification=0&filterPaint=0&filterPlatform=0&filterItemType=1">Find trades</a>
</div>
</div>
<div class="rlg-item --very-rare --hover">
<div class="rlg-item__gradient --very-rare"></div>
<img loading="lazy" class="rlg-item__image" src="/content/media/items/avatar/220px/a67e907fb81451699877.png" alt="Cristiano ">
<div class="rlg-item__text">
<h2 class="rlg-item__name">Cristiano</h2>
</div>
<div class="rlg-item-links">
<a class="rlg-btn-primary --small" href="/items/wheels/cristiano">Item details</a>
<a class="rlg-btn-secondary --small" href="/trading/?filterItem=148&filterCertification=0&filterPaint=0&filterPlatform=0&filterItemType=1">Find trades</a>
</div>
</div>
</div>
<div class="rlg-trade__wantslabel rlg-trade__wantslabelalt">
Wants
</div>
<div class="rlg-trade__itemswants ">
<div class="rlg-item --premium --hover">
<div class="rlg-item__gradient --premium"></div>
<img loading="lazy" class="rlg-item__image" src="/content/media/items/avatar/220px/da6ecd87091575484054.png" alt="Credits ">
<div class="rlg-item__text">
<h2 class="rlg-item__name">Credits</h2>
</div>
<div class="rlg-item__quantity --quantity-80 --premium">
80 </div>
<div class="rlg-item-links">
<a class="rlg-btn-primary --small" href="/items/misc/credits">Item details</a>
<a class="rlg-btn-secondary --small" href="/trading/?filterItem=2615&filterCertification=0&filterPaint=0&filterPlatform=0&filterItemType=1">Find trades</a>
</div>
</div>
<div class="rlg-item --premium --hover">
<div class="rlg-item__gradient --premium"></div>
<img loading="lazy" class="rlg-item__image" src="/content/media/items/avatar/220px/da6ecd87091575484054.png" alt="Credits ">
<div class="rlg-item__text">
<h2 class="rlg-item__name">Credits</h2>
</div>
<div class="rlg-item__quantity --quantity-80 --premium">
80 </div>
<div class="rlg-item-links">
<a class="rlg-btn-primary --small" href="/items/misc/credits">Item details</a>
<a class="rlg-btn-secondary --small" href="/trading/?filterItem=2615&filterCertification=0&filterPaint=0&filterPlatform=0&filterItemType=1">Find trades</a>
</div>
</div>
</div>
</div>
</div>
<div class="rlg-trade__actions">
<button class="rlg-trade__action rlg-trade__bump --bump " type="button" data-alias="bd520a66-cc88-4af8-ba92-30111bbdbd02" data-preventtext="Bumping…">
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><g style="stroke-linecap:round;stroke-linejoin:round;stroke:#6a717f;fill:none;stroke-miterlimit:10" transform="translate(.5 .5)"><path d="m12 23v-13"></path><path d="m16 14-4-4-4 4"></path><g stroke="#6a717f"><path d="m4 17h-3v-16h22v16h-3"></path><path d="m1 5h22"></path></g></g></svg>
<span>Bump</span>
</button>
<a class="rlg-trade__action rlg-trade__edit --edit" href="/trade/edit?trade=bd520a66-cc88-4af8-ba92-30111bbdbd02">
<svg viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg"><g fill="none" stroke="#6a717f" stroke-linecap="round" stroke-linejoin="round"><path d="m9.5.5 2 2-5 5-3 1 1-3z"></path><path d="m10.5 8.5v2a1 1 0 0 1 -1 1h-8a1 1 0 0 1 -1-1v-8a1 1 0 0 1 1-1h2" stroke="#6a717f"></path></g></svg>
<span>Edit trade</span>
</a>
<a class="rlg-trade__action rlg-trade__disable --disable" href="/functions/disableTrade.php?trade=bd520a66-cc88-4af8-ba92-30111bbdbd02" onclick="return confirm('Are you sure you want to disable this trade? This trade will be permanently removed.')">
<svg height="20" viewBox="0 0 24 24" width="20" xmlns="http://www.w3.org/2000/svg"><g style="stroke-linecap:round;stroke-linejoin:round;stroke-width:1.2;fill:none;stroke:#6a717f;stroke-miterlimit:10"><path d="m20.3 4.7-15.6 15.6"></path><circle cx="12.5" cy="12.5" r="11"></circle></g></svg> <span>Disable trade</span>
</a>
<a href="/trade/bd520a66-cc88-4af8-ba92-30111bbdbd02" class="rlg-trade__action --comments">
<svg viewBox="0 0 18 21" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd" stroke="#545454" stroke-linecap="round" stroke-linejoin="round"><path d="m1.421053 1.421053h15.157895v18.526316h-15.157895z"></path><path d="m4.789474 4.789474h8.421053v5.052632h-8.421053z"></path><path d="m4.789474 13.210526h8.421052"></path><path d="m4.789474 16.578947h8.421052"></path></g></svg>
<span>Comments</span>
</a>
</div>
<div class="rlg-trade__note">
Have 2x of them. Please fast. </div>
<button class="rlg-trade__noteexpand" style="display: none;">Show full trade description</button>
</div>
<div class="rlg-trade rlg-trade-placeholder" data-i="1" style="height: 323px; box-shadow: none;"></div>
<div class="rlg-trade rlg-trade-placeholder" data-i="2" style="height: 323px; box-shadow: none;"></div>
<div class="rlg-trade rlg-trade-placeholder" data-i="3" style="height: 323px; box-shadow: none;"></div>
</div>
Try use following xpath to click on the element.
for trades in trades_list:
trades.find_element(By.XPATH,'.//button[.//span[text()="Bump"]]').click()
print('Trade bumped successfully!')
time.sleep(1)