Cypress Automation - Cannot find button based on text - javascript

I am learning Cypress and have been automating various websites for the last few weeks. However, I am having issues clicking a button based on it's class or text value. (Supposed to be easy, I know)
The button does not have an id and has a long class name:
message-component message-button no-children focusable sp_choice_type_11 last-focusable-el
The following image shows the full element:
I have tried the following code:
cy.contains('Accept All').click()
cy.get('#message-component message-button no-children focusable sp_choice_type_11 last-focusable-el').contains('Accept All').click();
cy.get('button').contains('Accept All').click()
However, it just gives the same error and cannot find the button.
I have already checked the documentation for cypress and followed some advice off this post:
Find by text content
I also thought it may be that it loads the button after 4 seconds, so i upped the "defaultCommandTimeout" to 7000. However, still no luck.
Does anyone have any ideas?
Much appreciated!
*** EDIT ****
Image of the error
Screenshot showing popup in cypress:

The 'Accept All' button is inside an iframe. So you have to first go inside the iframe and then perform the click.
Install the cypress-iframe plugin using the command npm install -D cypress-iframe
Go to cypress/support/commands.js and write import 'cypress-iframe';
In your test write:
cy.iframe('[title="SP Consent Message"]').find('button[title="Accept All"]').click()

Related

React -- remove dom elements created by an external CDN

I am building a portfolio to show work I have created. It includes some small projects from FreeCodeCamp that are built according to test specs. I would like to include the tests so that someone looking at the code can see the tests.
When you embed the cdn script in your index.html file in a react app hosted anywhere, they work fine (even though React doesn't want outside forces manipulating the DOM). This will install a hamburger menu that can be exploded and you can choose which tests you would like to run. Note that this hamburger is always displayed.
However, I don't want to always have this hamburger menu because some of what I want to display is how the page is styled. I am trying to wait and insert the script tag until a button is pressed.
I can successfully display and remove the hamburger menu if I hit the add then remove buttons in order, but I know that I am doing this wrong when it comes to React design. This is obvious by the fact that if you hit add to dom button 2 times in a row, then it won't be removed. Also, I can run the test suite the first time. But if remove the hamburger and add it back and try to run the tests, there are errors in the console.
My question is: how can you properly add/remove a cdn script element (which will automatically add a dom element (hamburger), in a proper "React" design? I am thinking that solution lies with useEffect, useRef, or useState, but I am to "green" in React and when I research I still can't design a solution that works.
I put the code in a sandbox. To recreate the problem, just click the show the hamburger button, then hide the hamburger button, then show again and try to run the tests. Or click show several times in a row.
Any tips on how to fix this would be appreciated. This problem way exceeds my little experience.
Link to Code Sandbox
So I figured this out myself. In React, To safely make an element loaded into the DOM via external CDN appear and disappear was as simple as CSS.
I just added the item to the DOM with the CDN script tag. Then I could change either display:none or visibility: hidden.
The trick was loading the CDN script in first, then hiding it.
I was encountering a problem because I was trying the faulty approach of adding the CDN script tag, and removing, and adding again.

Download PDF files Selenium Python

I need some help. I need to download financial statements that are located in PDF files to my MAC using Python. I've tried this using Selenium but unfortunately haven't been able to make progress.
Following is the URL: financials.psx.com.pk
When I load this URL, the page looks like so:
you see the dropdown on the left above "Company Name...", I need to select a company name there. Once I do that, then I see a window like this:
Every link under reports, when clicked downloads a PDF. I require those PDFs. Appreciate any help. Thanks.
I have tried the following code; it selects the company name and shows me the next page for a second but somehow another refresh happens, which leads me back to the original page:
driver = webdriver.Chrome(executable_path="driver-path")
driver.get("https://financials.psx.com.pk/")
elem = driver.find_element_by_id("country")
drp = Select(elem)
drp.select_by_value("SHEL")
Actually, when I select using select_by_value, I can see the second window. I think the code is not stable. But, I am able to select a symbol from the dropdown and see the second page. Now, I need href's from the second page behind links such as 'Quarterly', 'Annual' etc.

Unable to locate elements (protractor Jasva Script) though CSS seems to be correct in dev tool

[![This image shows html code ][1]][1]
my java script code to locate element in protractor is below :
element(by.css("insight-top-bar insight-predefined-charts-container button div")).click();
you might want to add some dots to your locator, for the ones that might belong to a class
element(by.css('.insight-top-bar.insight-predefined-charts-container button div'))

Use Selenium in Python 3.6 to click on 'Next page of results' button

I am trying to click the next button on this website (https://www.ncbi.nlm.nih.gov/nuccore/?term=corn) but cannot find the right terminology to use the Selenium toolset appropriately.
Currently, my code is very bulky but this is the line I'm having issues with
browser.find_elements_by_xpath('//div[#class="pagination"] <THIS IS WHERE I NEED HELP!> )
Your xpath presently will select all divs with the class "pagination".
To find the next page link, you can use the xpath //a[#title="Next page of results"]
Your final code may end up looking like this:
browser.find_element_by_xpath('//a[#title="Next page of results"]').click()

Javascript problems on my site. Can't find the error

Something just happened to my site, and I can't really get my error logs to show any error. It's working perfectly in Firefox so I can't really find the error with firebug. When I analyze the site in Chrome I can't see any errors either, but the javascripts isn't running correctly at all.
When I try to add products to the shopping nothing really happens in Chrome, but when I press "Check Cart" all the products are there. When I press delete nothing happens either, but if I update the site the products are deleted just as they're supposed to.
BUT when I add some products, and then press "Check Card" I get this error message (can't mark the text so unfortunately it's in image mode):
Image
How can I find the error on this one?
My site is at www nosmoke se and I'm using Open Cart 1.5.4.1 if anyone's wondering.
And the end of the JSON being sent, there is an HTML comment that begins with <!--
Find out where that is coming from and get rid of it.
It looks like there is also a script tag there at the bottom that shouldnt' be there.
Attracta added features can cause issues with AJAX requests on certain sites (such as OpenCart). In the end, you need to request for Attracta to have it disabled but that can take from a few hours to a few days.
To remove the Attracta code immediately you will need to delete the .fastinclude file from the 'web root' (document root) of your website.
To delete this file:
1. Log into your account 'File Manager'
2. Choose the 'Web Root (public_html/www)' option and ensure 'Show Hidden Files (dotfiles)' is ticked if using a GUI.
3. Select the file named '.fastinclude' and Delete
After deleting this file, the app will be removed instantly.

Categories