I'm new to Cypress and have set up a bunch of helper functions on their own file. I want one of these functions to return a value, however I am getting stuck with how to do this within Cypress' synchronous structure.
I keep getting the error
CypressError:
cy.then()failed because you are mixing up async and sync code.
I have tried to implement a similar fix as mentioned here Cypress returning Synchronous value within Async command? but to no avail.
My code is as such:
Helper function:
//helperFunction.js
module.exports.schemaChecker = () => {
cy.get('script:contains("@context")').its('length').then((len) => {
cy.task('log', 'Schemas: ' + len);
if (len > 1) {
return "fail";
}
})
}
Test file:
import { schemaChecker, } from '../../support/helperFunctions.js';
// other stuff...
Given('I am on X page', () => {
cy.viewport(1480, 1000);
cy.visit(pageUrl);
schemaChecker().then((response) => {
if (response == "fail") {
// Do something
};
})
});
I've tried a few variations of this (eg: if (schemaChecker() == "fail") {}) but am just unsure how to make it work together and have not been able to find anything useful on Google.
Would anyone be able to point me in the right direction?
I'm new to Cypress and have set up a bunch of helper functions on their own file. I want one of these functions to return a value, however I am getting stuck with how to do this within Cypress' synchronous structure.
I keep getting the error
CypressError:
cy.then()failed because you are mixing up async and sync code.
I have tried to implement a similar fix as mentioned here Cypress returning Synchronous value within Async command? but to no avail.
My code is as such:
Helper function:
//helperFunction.js
module.exports.schemaChecker = () => {
cy.get('script:contains("@context")').its('length').then((len) => {
cy.task('log', 'Schemas: ' + len);
if (len > 1) {
return "fail";
}
})
}
Test file:
import { schemaChecker, } from '../../support/helperFunctions.js';
// other stuff...
Given('I am on X page', () => {
cy.viewport(1480, 1000);
cy.visit(pageUrl);
schemaChecker().then((response) => {
if (response == "fail") {
// Do something
};
})
});
I've tried a few variations of this (eg: if (schemaChecker() == "fail") {}) but am just unsure how to make it work together and have not been able to find anything useful on Google.
Would anyone be able to point me in the right direction?
Share Improve this question asked Jan 19 at 23:38 MeltingDogMeltingDog 15.4k52 gold badges178 silver badges320 bronze badges1 Answer
Reset to default 3The error you are mixing up async and sync code is referring to the cy.task() call (which is async) and the return 'fail'; (which is sync).
module.exports.schemaChecker = () => {
return cy.get('script:contains("@context")').its('length').then((len) => {
cy.task('log', 'Schemas: ' + len); // <-- async
if (len > 1) {
return 'fail' // <-- sync
}
})
}
One way to fix is to make both steps async
module.exports.schemaChecker = () => {
return cy.get('script:contains("@context")').its('length').then((len) => {
cy.task('log', 'Schemas: ' + len); // <-- async
if (len > 1) {
return cy.wrap('fail') // <-- also async
}
})
}
Here's my test
it('check the schema', () => {
schemaChecker().then((response) => {
if (response === 'fail') {
Cypress.log({name: 'schema error', message: 'Woops it failed'})
};
})
})
and my app page with deliberate error condition
<body>
<script>
const var1 = '@context'
</script>
<script>
const var2 = '@context'
</script>
</body>