Cypress truncates the URL after login - cypress

I have a simple login test in cypress (5.6.0, Windows 10). The application I am testing is written in PHP/MySQL. When I run the test in Cypress I get a 404 page not found error following the login.
This does not happen manually or with webdriver, just with Cypress.
Here is the script (which you can try)
describe('Admin Login', () => {
Cypress.config('baseUrl','https://www.edgewordstraining.co.uk/webdriver2')
it.only('Successful Login', () => {
cy.visit ('/')
cy.get('div#right-column > h1').contains('Web Testing Index Page V2 Sprint2')
cy.contains('Login').click()
cy.get('body').contains('User is not Logged in').should('exist')
cy.get('#username').clear()
cy.get('#username').type('edgewords')
cy.get('#password').clear()
cy.get('#password').type('edgewords123')
cy.contains('Submit').click()
//error 404 occurs here
//cy.visit ('/sdocs/add_record.php') //Had to add this as Cypress changes the URL from the form submit for some reason!
cy.get('body').contains('User is Logged in').should('exist')
//Logout
cy.contains('Log Out').click()
//Handle the confirmation Alert
cy.on('window:confirm',(str)=>{
expect(str).to.equal('Do You Really want to Exit the Secure site! Press ok to Continue ')
})
cy.get('body').contains('User was Logged in').should('exist')
});
And when I run with Chrome or Firefox, I get this in the log:
enter image description here
and in the Test Runner, the URL has been truncated:
enter image description here
The URL should be https://www.edgewordstraining.co.uk/webdriver2/sdocs/add_record.php,
but cypress changes it to https://www.edgewordstraining.co.uk/sdocs/add_record.php
webdriver2 is just a physical folder on the web server where this app/site is stored.
I see that someone else had a similar issue, but there are no replies on his question. Could anyone help? Thanks
Since the above post, I have now looked at the login function in the application itself.
else {
// document.write(response);
//location.replace("../sdocs/add_record.php");
//Had to change the line below as in Cypress, it is not moving back to the previous directory
//so have made it an absolute url instead
//window.location.href = "../sdocs/add_record.php";
window.location.href = "https://www.edgewordstraining.co.uk/webdriver2/sdocs/add_record.php";
return false;
}
The relative url path above should just go back to the parent directory (webdriver2) which it does if you use the site manually.
However, I have had to fix this as a fully qualified url to make it work in cypress.
So I have a workaround, but why does cypress handle it differently?

Related

Cypress cy.origin() & Google sign in not working

I'm trying to login to our site which uses Auth0 and Google Sign in but I'm having issues with cy.origin it's behaving different in each browser, none of which is letting me log in. This is my test:
import { loginPage } from '../../page-objects/login-page'
describe('Login Tests', () => {
beforeEach(() => {
loginPage.visit()
})
it('GoogleLogin', () => {
// Click google sign in button - On My Base URL
cy.get("a[data-testid='googleSignInButton']").click()
// I'm now on an Auth0 Page where I click the Google Sign In Button
cy.get("a[class='auth0-lock-social-button auth0-lock-social-big-button']").click()
// Now I am on the accounts.google.com domain
cy.origin('https://accounts.google.com', () => {
// enter email on accounts.google.com
cy.get("input[type='email']").type('myemail#gmail.com')
// click next button seen on accounts.google.com page
cy.get(
"button[class='VfPpkd-LgbsSe VfPpkd-LgbsSe-OWXEXe-k8QpJ VfPpkd-LgbsSe-OWXEXe-dgl2Hf nCP5yc AjY5Oe DuMIQc LQeN7 qIypjc TrZEUc lw1w4b']",
).click()
})
})
})
The issues I'm seeing are:
In Chrome once I get to accounts.google.com the test times out with "Timed out after waiting 60000ms for your remote page to load on origin(s)"
In Firefox the test times out with the same error as on Chrome but on the Auth0 page instead of accounts.goole.com
In Electron when I click the Google Sign in button on Auth0 I'm taken to accounts.google.com but a message is displayed "403. That’s an error. We're sorry, but you do not have access to this page. That’s all we know."
In Edge I can get to accounts.google.com and enter "myemail#gmail.com" and click the next button but then I see a message "This browser or app may not be secure.
Try using a different browser. If you’re already using a supported browser, you can try again to sign in." with a Try again button.
Four browsers are all reacting differently and not one is letting me actually login, can anyone see what I've done wrong?

In Cypress, After an UI operation how to check a particular API call is triggered in Network tab and verify the Status as 200

I have a web application to perform the update operation with the help of a Update button in UI mode.
During that time list of APIs are loaded into the Network tab with XHR type as below. I have to verify one of the API put call is triggered and the status is passed.
url.toString() -- https://abcdef.execute-api.ue-east-2.amazonaws.com/stg2
It contains the RequestedURL value. I manually verified that in Network tab for that particular API put call. Then kept that in cypress.json and reading the url to the current class
Base URL for the UI operation: https://abc-stg2.awsdev.fgh.com/
Note: The both url are modified and dummy one, since it is confidential to share. The understanding is API calls are in AWS and the UI urls are in other environment
Try #1
// After the UI operation
cy.intercept('PUT',url.toString()).as('urupdate')
cy.wait('#urupdate',{requestTimeout:20000})
.its('status')
.should('be.eq',200)
Output:
Try #2
cy.intercept('PUT', url.toString(), (req) => {
if (req.body.status == 200) {
cy.log('pass')
}
})
Output:
The log is not getting printed and till the if statement everything is getting passed
How can we verify the particular API is triggered and the status is 200?
I have gone through the intercept as above and other stuffs in Cypress. But that does not get me the solution. Share your suggestions

Lauching cypress test for the 2nd time, url lands on error page

I am trying to run a test using cypress, 1st time the test runs, it goes to the URL specified i.e. http://demo.nopcommerce.com/,
but 2nd time I run the test, the I am redirected to https://demo.nopcommerce.com/page-not-found#/tests/integration\examples\Locators.spec.js
Here is my Script:
describe('Locating Elements', function() {
it('Verify Types of locators', function() {
cy.visit('http://demo.nopcommerce.com/')
cy.get('#small-searchterms').type('Apple MacBook Pro 13-inch')
cy.get('.button-1.search-box-button[value="Search"]').click()
cy.get('.button-2.product-box-add-to-cart-button[value="Add to cart"]').click()
cy.get('#product_enteredQuantity_4').clear().type('3')
cy.get('input[type="button"][id="add-to-cart-button-4"]').click()
cy.contains('The product has been added to your').should('be.visible')
cy.get('.close').click()
cy.contains('Shopping cart').click()
cy.get('.estimate-shipping-button').click()
cy.get('.estimate-shipping-popup').then(function() {
cy.log('Hello.......')
cy.get('#CountryId').select('India')
})
})
})
Could you please try https://demo.nopcommerce.com/ instead of http:// inside cy.visit(), also please add "chromeWebSecurity" : false in cypress.json. When i tried with https://, it is working fine while rerunning the test.
May be a good idea to check with the dev team whether the nopcommerce.com domain/subdomain is configured properly to accepts http:// requests.

Cypress seems to have stalled

I'm new to cypress and love the way it is architected. However, I seem to have run into a problem early on for a very simple thing that I'm trying to do.
My workflow is:
1) Visit the site
2) Enter username and password
3) On the next screen, type a number and press submit,
4) On the next screen, select a value from a dropdown and press enter.
5) I get to the landing page of my website.
Cypress works totally fine till step 4). It seems to stall at step 5. The test runner suddenly stalls and without warning or error, shows
"Whoops, there is no test to run."
From here, when I click the "View All Tests" button, it takes me to the runner tool. There I see the indication that something is still running in the background. I tried waiting for more than 10 minutes but nothing happens until I click on the "Stop" action.
How do I debug this? Can I see what is happening via any log etc?
There could even be something wrong with my website as well, but without any log information, I'm unable to proceed further. Any help is appreciated.
To provide more context, I don't think this is a timeout based issue as if that were the case, cypress did report to me about this and stopped. I then increased the timeout.
My spec file
describe('My first test', function() {
it('Visits home page', function() {
cy.visit('https://mywebsite.com:5800', {timeout: 400000}, {pageLoadTimeout: 400000}, {defaultCommandTimeout: 400000})
cy.get('#USERNAME').type('myusername')
cy.get('#PASSWORD').type('mypassword')
cy.get('#loginbutton').click()
cy.get('#SOMELEMENT_WHERE_I_TYPE_A_UNIQUE_NUMBER').type('8056')
cy.get('#loginbutton').click()
cy.get('#loginbutton').click()
})
})
Thanks.
If you run DEBUG=cypress:* cypress open from the terminal when initially opening Cypress, there will be more debug log information printed there while you run your tests.
Also, it's always a good idea to search the issues for the project to see if anyone else has had this happen.
For some reason, the Cypress automation gets into a state where it thinks that you have no spec file. All Cypress does to determine this is to see if there is a location.hash defined on the main window -> where it usually says https://localhost:2020/__/#tests/integration/my_spec.js.
Likely this is due to security mechanisms in the app that prevent your application from being run within an iframe (which is how Cypress runs all applications under test). Maybe in your application code it is something like:
if (top !== self) {
top.location.href = self.location.href;
}
You can simply disable these checks while testing or in Cypress you can add to your test file (or a support file to have it work on every test file):
Cypress.on('window:before:load', (win) => {
Object.defineProperty(win, 'self', {
get: () => {
return window.top
}
})
})
I had the same issue. Usually this is related to the page moving out of the parent and can be solved by invoking the attribute and changing it to the current page.
cy.get('.approved-content .no-auto-submit').invoke('attr', 'target', '_self');

FBJS AJAX.post is not working after permissions dialog

I have problems with facebook application based on flash which communicate with PHP using FBJS-bridge. When someone use the application for the first time, he/she is asked for various permissions. After that, flash contact PHP with ajax but request is never sent. When you refresh page, everything is working without any problems.
If you remove the application on privacy settings, refresh the page and try again - same bug happens. If you allow application, refresh page, in other tab remove application and start application in previous tab - user is asked for permissions but everything is working after allowing application.
This is FBJS code
function openPermissions(){
Facebook.showPermissionDialog(/*permissions string*/, permissionOnDone);
}
function permissionOnDone(perms){
if (!perms) {
document.getElementById("indexswf").callSWF('noallow');
} else {
document.getElementById("indexswf").callSWF('allow');
}
}
function ajaxCall(url,parameters){
var params = {};
for(var i=0;i<parameters.length;i+=2){
params[parameters[i]]=parameters[i+1];
}
ajax = new Ajax();
ajax.requireLogin = true;
ajax.responseType = Ajax.RAW;
ajax.ondone = function(data){
document.getElementById("indexswf").callSWF('parseAjax', data);
}
ajax.post('http://the.url.to/the_real_server/not_to_the_fb_url/'+url,params);
}
openPermissions is called to display permission dialog, and on allow flash function allow() is called. In flash, allow() calls JS function ajaxCall(), which should make ajax request. But, ajax.post never sends request. I know that for sure, because flash function parseAjax was never called and also debugging tools in browsers are not showing any ajax requests. URL and parameters are same as when it is working. No flash or JS errors are detected...
Anyone have idea what is wrong here? Maybe facebook bug again since this was all working few days ago...
ajax.requireLogin = true should be set to false for some reason

Resources