I think I've found an issue with cy.session(), but before opening one in the GitHub wanted to hear your ideas on my problem itself:
Implemented cy.session(), and it worked! For most of the pages...
The issue is with pages with <select> elements. After session() was implemented, the cy.select() stopped working. It chose the right option, and then it went right back to the previously selected option. The strangest thing is that is not seen even in the DOM snapshots. Removing cy.session() made everything work again.
So, my question is:
Does it feel like a cypress bug? Has anyone encountered this issue and got it somehow resolved? Cannot imagine any way how cy.selecting elements is related to sessions.
EDIT:
After further investigation, I found that selecting a page option changes one specific cookie value. This cookie has the page type code, thus I think that the new value is not saved to the cookie as it was before without cy.session()
Manually selecting in the browser from cypress open doesn't work either! After discovering that, I am pretty sure that it is the cypress bug.
As it was requested, here is my code:
commands.ts
Cypress.Commands.add('login', (user: User) => {
return cy.session(
[user.api_key],
() => {
cy.request({
...
});
},
{
validate() {
cy.visit('/');
cy.contains(user.username, { matchCase: false });
},
cacheAcrossSpecs: true,
}
);
});
e2e.ts
beforeEach(() => {
cy.getCurrentUser().then((user) => {
cy.login(user);
});
});
This issue gets resolved in Cypress 10.10!
Opened issue in cypress' GitHub and got an answer:
https://github.com/cypress-io/cypress/issues/24149
Related
So I'm trying to conditionally check for a popup in a webpage, and close it if it exists. The popup is suppressed if a cookie exists, but the cookie has a guid in the name that I can't get unless it's already been set.
I've tried variations of getting body and struggling with it, using things like the following:
cy.get("body").then($body => {
if ($body.find('[data-id="guide-close-button"]').length) {
cy.get('[data-id="guide-close-button"]').click();
} else {
//you get here if the button DOESN'T EXIST
assert.isOk('everything','everything is OK');
}
})
and similar things like this
cy.get("body").then($body => {
if ($body.has('[data-id="guide-close-button"]')) {
cy.get('[data-id="guide-close-button"]').click();
} else {
//you get here if the button DOESN'T EXIST
assert.isOk('everything','everything is OK');
}
})
But it either does not assert true if the button does exist, or it gets stuck timing out if the popup has been closed already and fails my test. I know I could technically ignore one error and just get past this but I would like to do it the "right" way, but I'm having difficulty figuring out how to get this to work how I'm expecting. Any tips on how I can get this to evaluate and close this button if it exists on the page?
Well, it appears to be surrounding the redirect, this is right after signing in. Looking at each stage, when I was getting the body it looks like it was still on one of the pages that was still showing signing in. I've added a cy.url().should('contain','string') to wait.
i have a link which gets a text-decoration:underline when hovering. But i can´t reproduce it using cypress.
I´ve tried ex. cy.get('a').trigger('mouseover') but nothing happens.
Is there a way to force the element to have :hover state?
Cypress does not support hovering. But in a previous question this workaround has been suggested:
it('hovering over button', () => {
cy.visit("http://www.qaclickacademy.com/practice.php");
cy.get('.mouse-hover-content').should('be.hidden').invoke('show');
})
I have a React web app which uses Blockly that I'm currently trying to write automated tests for using the Cypress framework.
Cypress works pretty well for the basic process of signing on, but starts behaving inconsistently once Blockly is supposed to load.
About half the time, the entire Blockly portion of the app doesn't show up at all in the Cypress viewport. Sometimes this shows up, sometimes it doesn't, and I'm unsure what causes it or how to really reproduce it, it seems to be random.
Here is how it looks when it loads properly
Here is how it looks when it doesn't load properly
At first, I thought that the reason it didn't work is because the resources for Blockly hadn't loaded, and Cypress was trying to access resources that didn't exist.
To work around this, I added a delay, using cy.wait(). I tried anywhere from 1s-10s, but the delay doesn't seem to affect anything, no matter how long the delay is, it doesn't seem to impact if the Blockly portion of the app loads properly or not.
Here is the code for the portion of the Cypress test file used:
it('Sign in with created profile', () => {
cy.visit('localhost:3000/');
cy.get('input[name="email"]')
.type('test123#test.com').should('have.value', 'test123#test.com');
cy.get('input[name="password"]')
.type('testtest').should('have.value', 'testtest');
cy.get('button[type="submit"]').click();
});
it('Open created project', () => {
cy.get('div[class="project-container"]').contains('test project').click();
});
it('Drop 1+1 block into grid', () => { //2s delay
cy.wait(2000).then((prom) => {
cy.get('div[class="blocklyTreeRow"]').contains('Math').click({ force: true });
});
});
It works perfectly, until just after the 'Open created project' part of the test is run, then it's a hit or miss if the Blockly part of the app shows up. Refer to the images above for possible scenarios that happen.
Please check you are not trying to automate iframe because cypress do not support iframe
Iframe opened Question :
https://github.com/cypress-io/cypress/issues/136
Else :
Try to use Aliased.
// Wait for the route aliased as 'getAccount' to respond
// without changing or stubbing its response
cy.server()
cy.route('/accounts/*').as('getAccount')
cy.visit('/accounts/123')
cy.wait('#getAccount').then((xhr) => {
// we can now access the low level xhr
// that contains the request body,
// response body, status, etc
})
More documentation available here :
https://docs.cypress.io/api/commands/wait.html#Alias
I'm using a Kendo Grid's removeRow function. It works, but it always prompts "Are you sure you want to delete this record?" whenever I programmatically remove a row. I've already done the decision-making as to whether or not the row should be removed, so I don't want this message to show up. Googling didn't help and I couldn't find any similar question on StackOverflow or Kendo's forum. I know I could change the code, but I was wondering if there's a way to configure the grid to just not show it? Another solution would maybe be to temporarily block confirm prompts, possibly? Not sure if that's possible.
Setting editable.confirmation to false should do the trick:
kendoGrid( {
editable: {
confirmation: false
}
})
I have a workaround that I just figured out, in the meantime. It works fine, but it's a bit hacky:
var oldConfirm = window.confirm;
window.confirm = function() { return true; };
grid.getKendoGrid().removeRow(selectedRow);
window.confirm = oldConfirm;
I'd still be interested in hearing about any disabling of the confirmation, however, and I'll accept that as the answer if it comes along.
Is anyone using tokeninput plugin and successfully setting focus on a token input field? I'm trying to achieve this.
Solved:
In case anyone else needs, the solution:
$(document).ready(function() {
$("#YourTokenInput").tokenInput("http://shell.loopj.com/tokeninput/tvshows.php",
{ theme: "facebook"
}).focus();
});
OP's solution didn't work for me. Not sure if it is a browser issue, or a issue with the elements being loaded in time, or what, but this is what I had to do (after initializing the token input:
setTimeout(function() { $('#token-input-search-input').focus(); }, 50);
Note: (testing in Chrome)