Thank you so much for this. Nice way to explain it. I think that the assertion "be.visible" is still necessary because the image could have an opacity: 0 bug.
Imagine we have a pdf file and we want to verify the logos, checkboxes, text inside this pdf. What should we do. I know how to verify text but dont know how compare or verify img and checkbox inside the pdg.
Thanks for you video, I am getting error "cy.then() timed out after waiting 10000ms. Your callback function returned a promise that never resolved." I am trying to fix this but still can't get solution, can you help on this please
Hi. You're passing img as an array? .should([img]). In all other examples arguments in .should() or .then() are objects, not arrays. Example .should((img) = >{}) What is the difference? If I don't pass an array your example won't work. Why is that?
The syntax `.should(([img]) => ...)` is called argument destructing, it lets you take an array argument and assign its first element to a variable named "img". When you do ([first]) => console.log(first), it the same as doing: (array) => { let first = array[0]; console.log(first); } Destructing is an awesome feature of JavaScript, you can learn more about it here: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
You are lucky to live in the fantasy world where all your HTML has been re-written to use "data-*' tags. Back here in the real world of existing 10 year old code, I have spent 2 hours just trying to emulate your first cy.get("data-test=image") statement and am more than a bit frustrated.
Sorry about that! Check out this page from Cypress about using test selectors that begin with data-*: docs.cypress.io/guides/references/best-practices#Selecting-Elements
thanks for this greate work , what's your cypress version ? cause the methode that you're using [img] get me an error : Invalid attempt to destructure non-iterable instance
Hey there! I believe this video was made with Cypress 9.3.1. What's the value of the argument passed to the function? I'd double check that and make sure it's not null or anything that would prevent destructuring.
Well done. Nice clear progression from defining the problem to presenting and refining the solution. Thank you!
Thank you so much for this. Nice way to explain it. I think that the assertion "be.visible" is still necessary because the image could have an opacity: 0 bug.
Imagine we have a pdf file and we want to verify the logos, checkboxes, text inside this pdf.
What should we do.
I know how to verify text but dont know how compare or verify img and checkbox inside the pdg.
Nice & clear path to writing this test!
Hi sir, Can you please suggest to me any snapshotting tool for both cypress e2e and component testing? Thanks🙏
If my expected screenshot is dynamic in actual manner (e.g):date and time how I could compare
Great video, Ryan!
Thanks for you video, I am getting error "cy.then() timed out after waiting 10000ms. Your callback function returned a promise that never resolved." I am trying to fix this but still can't get solution, can you help on this please
Nice tutorial for testing images in ecommerce
Thanks!
super cypress knowedge i appreciate it
Hi.
You're passing img as an array? .should([img]). In all other examples arguments in .should() or .then() are objects, not arrays. Example .should((img) = >{}) What is the difference? If I don't pass an array your example won't work. Why is that?
The syntax `.should(([img]) => ...)` is called argument destructing, it lets you take an array argument and assign its first element to a variable named "img".
When you do ([first]) => console.log(first), it the same as doing:
(array) => {
let first = array[0];
console.log(first);
}
Destructing is an awesome feature of JavaScript, you can learn more about it here: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
You are lucky to live in the fantasy world where all your HTML has been re-written to use "data-*' tags. Back here in the real world of existing 10 year old code, I have spent 2 hours just trying to emulate your first cy.get("data-test=image") statement and am more than a bit frustrated.
Sorry about that! Check out this page from Cypress about using test selectors that begin with data-*: docs.cypress.io/guides/references/best-practices#Selecting-Elements
Decent more! ❤
😘
thanks for this greate work ,
what's your cypress version ? cause the methode that you're using [img] get me an error : Invalid attempt to destructure non-iterable instance
Hey there! I believe this video was made with Cypress 9.3.1. What's the value of the argument passed to the function? I'd double check that and make sure it's not null or anything that would prevent destructuring.
@@RyanToronto I think this is due to cypress version, I'm still in the 6.7.0.
Thanks man for your reply