I tried to make that when click on buy it goes to stripe checkout page but,i need that if i change option to "exlusive" it change price only title and other stays same
enter image description here
enter image description here
enter image description here
<section id="prodetails" class="section-p1">
<div class="single-pro-image">
<img src="img/Cover Arts/Autumn.png" width="100%" id="MainImage" alt="">
</div>
<div class="single-pro-details"> <!--Fix in css-->
<h6>Home / Beats</h6>
<h4>Melodic Pop Beat = "Autumn"</h4>
<h2 id="price">$5</h2>
<select id="select">
<option>Select Licence</option>
<option>MP3</option>
<option>Tagged Wav</option>
<option>Un-Tagged Wav</option>
<option>Stems</option>
<option>Exlusive</option>
</select>
<script>
let select = document.getElementById('select');
let price = document.getElementById('price');
// Prices
let prices = {
"Select Licence": '$5',
"MP3": '$5',
"Tagged Wav": '$7',
"Un-Tagged Wav": '$10',
"Stems": '$15',
"Exlusive": '$50'
}
// When the value of select changes, this event listener fires and changes the text content of price to the coresponding value from the prices object
select.addEventListener('change', () => {
price.textContent = prices[select.value];
});
</script>
<!--<h2 id="sproduct-price">$25</h2>-->
<button class="normal">Add to Card</button>
<h4>Product Details</h4>
<span>Melodic Pop Beat - Autumn,Pop Beat in G Minor and BPM of 130,Beat is simple and melodic,It has the vibe of Dua Lipa and Weeknd Beat,The prices is great;just $5 for an tagged and mastered MP3,$7 tagged and unmastered Wav,$10 for un-tagged unmasterd and $15 for Stems,Exlusive are $50</span>
</div>
<div id="audio">
<audio controls style="width:100%;">
<source src="Audio/Dua lipa 130 x Gmin.mp3" type="audio/mpeg">
</audio>
</div>
</section>
Your button is set to go to a Stripe Payment Link, which is a reusable link that will always charge someone for the same thing.
If you want people to be able to purchase different things you need to create different Payment Links for the different options, then adjust your page so it sends them to the right Payment Link based on what they want to buy.
Related
I am using selenium to target 3 buttons as in the image below
Here is the code for each thumbnail
<div class="product">
<div class="product-image">
<img src="./images/raspberry.jpg" alt="Raspberry - 1/4 Kg">
</div>
<h4 class="product-name">Raspberry - 1/4 Kg</h4>
<p class="product-price">160</p>
<div class="stepper-input">
–
<input type="number" class="quantity" value="1">
+
</div>
<div class="product-action">
<button class="" type="button">ADD TO CART</button>
</div>
</div>
When I try the following code below it fulfills the goal of clicking the 3 buttons
add_cart_btn_locator = (By.CSS_SELECTOR, "div[class='product'] button")
add_cart_btn_link = driver.find_elements(*add_cart_btn_locator)
for i in add_cart_btn_link:
i.click()
But when I try to change my selector to div[class='product-action'] button, only the first button is clicked then the below error appears
Message: stale element reference: element is not attached to the page document
May I kindly ask what is the difference of the two locators and why they do not work identically?
change your loop :
add_cart_btn_locator = (By.CSS_SELECTOR, "div[class='product-action'] button")
add_cart_btn_link = driver.find_elements(*add_cart_btn_locator)
nbrlinks = len(add_cart_btn_link)
for i in range(nbrlinks):
add_cart_btn_locator = (By.CSS_SELECTOR, "div[class='product-action'] button")
add_cart_btn_link = driver.find_elements(*add_cart_btn_locator)
add_cart_btn_link[i].click()
you have to reload the search of items each time
I am trying to scrape data from an e-commerce site for a certain product. On the result page, there are 50 products listed. Some products have original prices under them while some have discounted prices with original prices striked-out. The HTML code for that is
for non-discounted products
<div class="class-1">
<span>
Rs. 7999
</span>
</div>
For discounted product
<div class="class-1">
<span>
<span class="class-2">
Rs. 11621
</span>
<span class="class-3">
Rs. 15495
</span>
</span>
<span class="class-4">
(25% OFF)
</span>
</div>
What the result should be?
I want a code that could scroll through the list of products and extract data from Div[class='class-1]/span tag for the non-discounted product and where there is a child span[class='class-2'] present, it should extract data from only that tag and not from the Span[Class-3] tag.
Please help!!
If I understand you clearly, first you need to get a list of products with:
products = driver.find_element_by_xpath('//div[#class="class-1"]')
Now, you can iterate thru the list of products and grab the prices as following
prices = []
for product in products:
discount_price = product.find_elements_by_xpath('.//span[#class="class-2"]')
if(discount_price):
prices.append(discount_price[0].text)
else:
prices.append(product.find_element_by_xpath('./span').text)
Explanation:
Per each product I'm checking existence of //span[#class="class-2"] child element as you defined.
In case there is such an element, product.find_elements_by_xpath('.//span[#class="class-2"]') will return non-empty list of web elements. Not empty list is Boolean True in Python so if will go.
Otherwise the list is empty and else will go.
I have the following portion of html code in a web page
<div class="action">
<div class="double-button">
<button class="widget-button" title="2 people liked this post">2</button>
<button class="widget-button like" title="like this post">
<svg class="fa d-icon d-icon-d-unliked svg-icon svg-node" aria-hidden="true">
<use xlink:href="#far-heart"></use>
</svg>
</button>
</div>
</div>
After hovering over the first button the class name change and the code transform to
<div class="action">
<div class="double-button">
<button class="widget-button d-hover" title="2 people liked this post">2</button>
<button class="widget-button like" title="like this post">
<svg class="fa d-icon d-icon-d-unliked svg-icon svg-node" aria-hidden="true">
<use xlink:href="#far-heart"></use>
</svg>
</button>
</div>
</div>
After clicking over the first button a new div appear that contains people who like the post
<div class="action">
<div class="double-button">
<button class="widget-button d-hover" title="2 people liked this post">2</button>
<button class="widget-button like" title="like this post">
<svg class="fa d-icon d-icon-d-unliked svg-icon svg-node" aria-hidden="true">
<use xlink:href="#far-heart"></use>
</svg>
</button>
</div>
<div class="likes">
<a class="trigger-user" href="/USER1" name="USER1">USER1</a>
<a class="trigger-user" href="/USER2" name="USER2">USER2</a>
</div>
</div>
My objective is to select all those users using selenium and python3 so I tried the following code inspired from other stack overflow questions like link1 and link2
driver = webdriver.Chrome(executable_path='./chromedriver_83') #this works fine
driver.get("link_to_the_page") #also I get the link and all contents without problems
likes_button=driver.find_elements_by_xpath("//button[#class='widget-button']") # works fine too
print(likes_button[0].text) # This gives '2', it the right value
hover = ActionChains(driver).move_to_element(likes_button[0]) #select only the first element in the page for testing
hover.perform() # I think the hover does not work even if this is the right way
likes_button_hover=driver.find_elements_by_xpath("//button[#class='widget-button d-hover']") # now select the hovered button to be clicked, since I hovered only one button in the whole page the result shoud be one
print(len(likes_button_hover)) # this gives 0 while it should give 1
likes_button_hover[0].click() # this throw an error
I get the following error which means the button did not change the class ( the hover did not work)
raise exception_class(message, screen, stacktrace)
selenium.common.exceptions.ElementClickInterceptedException: Message: element click intercepted: Element <button class="widget-button" title="2 people liked this post">2</button> is not clickable at point (537, 17). Other element would receive the click: <span>...</span>
(Session info: chrome=83.0.4103.116)
I tried to get into the first button in many means using for example
driver.find_elements_by_css_selector("[title*='people liked this post']")
but in vain, I think the problem occurs in the hover but I can not see why, and of course I can not get the button and click it without hovering it first.
What Am I doing wrong?
I can see two solution here.
1: As button (One you need to click to see all users) is always there but only class is changing. So you can do a direct click without hovering on it.
likes_button=driver.find_elements_by_xpath("//button[contains(#title,'people liked this post')]") # Used contains as number of people liked might change
print(likes_button[0].text) # This gives '2', it the right value
likes_button[0].click() # If not working try javaScript : driver.execute_script("arguments[0].click();", likes_button[0])
2: If you really want to click only after hovering, i guess you might need to to pause method of Actionchain class. As java script might take some time to load. In your case it is trying to find button with class widget-button d-hover immediately after hovering the mouse.
likes_button=driver.find_elements_by_xpath("//button[#class='widget-button']")
print(likes_button[0].text)
ActionChains(driver).move_to_element(likes_button[0]).pause(1).perform()
likes_button_hover=driver.find_elements_by_xpath("//button[#class='widget-button d-hover']")
print(len(likes_button_hover))
likes_button_hover[0].click()
I try to automate some manual processes by using VBA automation. One of them is to click on a element that has an empty content and at the moment I am not able to figure out how to deal with it
The HTML code that I am trying to click on:
<div id="searchcombobox-1077-triggerWrap" data-ref="triggerWrap" class="x-form-trigger-wrap x-form-trigger-wrap-toolbar">
<div id="searchcombobox-1077-inputWrap" data-ref="inputWrap" class="x-form-text-wrap x-form-text-wrap-toolbar">
<input id="searchcombobox-1077-inputEl" data-ref="inputEl" type="text" role="combobox" size="1" name="searchcombobox-1077-inputEl" placeholder="Account Number" tabindex="-1" class="x-form-field x-form-text x-form-text-toolbar " autocomplete="off" componentid="searchcombobox-1077">
</div>
<div id="searchcombobox-1077-trigger-picker" class="x-form-trigger x-form-trigger-toolbar x-form-search-trigger x-form-search-trigger-toolbar "></div>
</div>
The VBA code used is:
HTMLDoc.getElementById("searchcombobox-1077-inputEl").Value = '11xx111'
Set click_el = HTMLDoc.querySelector("#searchcombobox-1077-trigger-picker")
With click_el
.Focus
.FireEvent "onclick"
End With
What should be the approach that I need to take into consideration since the div element that I need to click on is empty?
Thanks,
I'm using Soda (node.js) w/ Selenium RC to automate browser testing.
If I have an AngularJS directive -> say a button that has a spinner -> and it appears multiple times on a page, how can I make sure to click on that particular button...when it has no DOM ID or unique class? In my case, "Login" and "Some Other Button" are dynamic and would be unique for all buttons in the ng-view.
<my-requesting-button text="Login" class="ng-isolate-scope ng-scope">
<button type="submit" class="btn btn-large">
<img src="/img/progress.gif" style="display: none;">
<span>Login</span>
</button>
</requesting-button>
<my-requesting-button text="Some Other Button" class="ng-isolate-scope ng-scope">
<button type="submit" class="btn btn-large">
<img src="/img/progress.gif" style="display: none;">
<span>Some Other Button</span>
</button>
</requesting-button>
Soda (basically directly from the example):
browser
.chain
.session()
.open('/')
.clickAndWait('...LOGIN BUTTON REF?')
.waitForPageToLoad(2 * 1000)
.clickAndWait('...SOMEOTHER BUTTON REF?')
.waitForPageToLoad(2 * 1000)
You can give it a unique ID/class name. If you know this element will only ever be on the page once, you can give it a unique ID. If not, you can give it a class name so that Selenium can find just the first one, or the one near your login form.
To do this, you can either pass the text value (e.g. "Login") to your button so that it has it:
<button class="{{text}}Button">
or you can tell Selenium to find the button that comes right after the element whose text attribute is "Login".