Cypress Complete Beginners Masterclass 4 | Step by Step | Raghav Pal

All FREE courses - automationstepbystep.com/
File Upload
File Download
Reporting
File upload in cypress
SETUP
Step 1 : Install plugin cypress-file-upload
npm install --save-dev cypress-file-upload
Step 2 : If you are using TypeScript, ensure your tsconfig.json contains
"compilerOptions": {
"types": ["cypress", "cypress-file-upload"] }
Step 3 : Add to cypress/support/commands.js
import 'cypress-file-upload';
Step 4 : Check this commands.js is imported in cypress/support/index.js
(it might be commented)
// Import commands.js using ES2015 syntax:
import './commands';
TEST
Step 1 : Create a new test
Step 2 : Add command to visit the web page
cy.visit(' ... ')
Step 3 : Add command to upload file
cy.get('[name="myfile"]').attachFile(' filePath ');
File download in cypress
SETUP
Step 1 : Install plugin cypress-downloadfile
npm install cypress-downloadfile
Step 2 : Add to cypress/support/commands.js
require('cypress-downloadfile/lib/downloadFileCommand')
Step 3 : Add to cypress/plugins/index.js
const {downloadFile} = require('cypress-downloadfile/lib/addPlugin')
module.exports = (on, config) =＞ {
on('task', {downloadFile}) }
TEST
Step 1 : Create a new test
Step 2 : If autocomplete does not work add at the top
/// ＜reference types="cypress-downloadfile"/＞
Step 3 : Add command to download file
cy.downloadFile('filepath/demo.txt, 'mydownloads' ,'demo.txt')
Cypress HTML REPORTS - • Cypress Beginner Tutor...
#CypressBeginnersTutorial
____________________________________________________________
Stories by Raghav - automationstepbystep.com/stor...
My Udemy Courses - automationstepbystep.com/udem...
Every LIKE & SUBSCRIPTION gives me great motivation to keep working for you
You can support my mission for education by sharing this knowledge and helping as many people as you can
If my work has helped you, consider helping any animal near you, in any way you can.
----------- CI | CD | DEVOPS -----------
Jenkins Beginner - bit.ly/2MIn8EC
Jenkins Tips & Trick - bit.ly/2LRt6xC
Docker - bit.ly/2MInnzx
Kubernetes - bit.ly/2MJIlMK
Ask Raghav - bit.ly/2CoJGWf
Interviews - bit.ly/2NIPPxk
All Playlists - bit.ly/2LSiezA
---------- Connect with Raghav -----------
Udemy Courses - www.udemy.com/user/raghav-pal-3/
Twitter - / learnwithraghav
KZbin - / automationstepbystep
Never Stop Learning
Raghav

[@iliyas868]

Oh man! This wonderful tutorial got over before the API testing part. Craving for more now :) Thank you so much for creating these.

[@RaghavPal]

Thanks a lot

[@nikolinapetrova3452]

Thank you for your Cypress Beginner Tutorials videos. This was very helpful and well organized.

[@RaghavPal]

Most welcome Nikolina

[@TheFactMan24]

Thanks, Raghav for this wonderful session.

[@RaghavPal]

Most welcome Virendra

[@susmithavenkatesh7802]

mostly while learning a new framework or tool i used to refer minimum three channels, but you are the best in explaining things..

[@RaghavPal]

Thanks a lot Susmitha. Humbled

[@rajithkumar3424]

Thank you for your Cypress Beginner Tutorials videos. Indeed it was an informative one

[@RaghavPal]

Most welcome Rajith

[@IIvanMI]

I'm looking forward to see your next video explaining API testing in Cypress. I really like your videos, and keep up with good work. Thanks

[@RaghavPal]

Thanks, will do Ivan

[@hazemmelliti6183]

Thank you for your time and efforts ! as always your way of teaching is fascinating

[@RaghavPal]

You are very welcome Hazem

[@SmashingProdigy]

Hi Raghav, thank you for such an informative course on Cypress! It was just what I needed for my job! I'll soon be looking to implement some accessibility packages and your masterclass has given me the comfort to cover those topics!

[@RaghavPal]

Most welcome

[@VaibhavPatil-ii3jg]

Sir please make videos on latestsversion of cypress with cucumber installation. I am not able to install an use it in my system and also not able to find the related videos on other channels every video on channels are of old version cypress with cucumber.

[@pallavisr9416]

I learnt cypress and playwright from your playlist and master class too….and I landed software tester job in Germany..many thanks to you….may god bless u….keep up the good work…🙂🙂🙂🙂🙂🙂

[@RaghavPal]

That's great Pallavi.. all the best

[@jallaludeen2740]

thanks a-lot for these, we are waiting for next video

[@RaghavPal]

You are most welcome, will try to add more

[@hulagabal]

Thank you

[@RaghavPal]

You're welcome

[@xXMrThomasXx]

Thx Master for next session :) I go for your another Cypress list;)

[@RaghavPal]

Most welcome..

[@myworldlovesme]

Thank you kindly for your content Raghav🙏and you look very handsome with mustache and beard 😍

[@RaghavPal]

So nice of you

[@MrH0bb0]

Hi Raghav, Thanks much for this awesome tutorial and all the others that you have been providing. May I kindly request you to also add a tutorial on Cypress Debugging?

[@RaghavPal]

Sure, I will do

[@manikantan2457]

Hi Raghav , Nice video and loved it , when can we expect next set of videos on Cypress master class.

[@RaghavPal]

as of now I have created 4 parts, will upload if I create more videos, Will get notified if you have subscribed

[@nicolasma7424]

Hi Raghav, would be nice to have BrowserStack and Jenkins implemented in our testing framework. Any chance you create a video on these 2 topics? Thanks again for your great videos :) Much appreciated :)

[@RaghavPal]

Sure Nicolas

[@ooozzzoo6885]

thank you Raghav! maybe are you going to make lesson about screenshot testing in cypress? :)

[@RaghavPal]

I will plan

[@geethamaddirala]

Awsome tutorial great work sir really appreciated.and you mentioned each steps in description it will be very helpfull. cannot say only thanks. and where did you covered cucumber with cypress pls let me know

[@RaghavPal]

You are most welcome, yet to create a lecture on that

[@nursenatekoglu231]

Thank you so much Raghav, this 4 video playlist was very helpful :) I learned cypress from 0 thanks to you ! Let me ask, I think you did not cover topics below right? These were in the content of this playlist as far as I understand, so sad you did not have chance to cover them all . "API Testing Custom Commands Cypress Studio Cypress Dashboard Cypress BDD Framework Database Integration Git Jenkins" If you will find chance to cover them it will be much appreciated ! Will be looking forward ! Thank you so much for this content againn! 💕

[@RaghavPal]

I will plan Nursena Can also check all Cypress lectures here - automationstepbystep.com/

[@user-vj7nz5cx2i]

Thank you so very much for all the knowledge!!! It has helped tremendously. I am interested in learning about more advanced topics, such as intercept waits, mocking and how to avoid making a lot of mistakes often due to asynchronicity:( often I am blocked and can not write simple tests because I do not know how to solve many asynchronicity issues:( (working with promises and async behavior) Does your Udemy course cover that and if not could you please suggest how to learn about that:( thank you so very much!!!

[@RaghavPal]

Ana I will plan to cover these

[@user-vj7nz5cx2i]

Thank you so very much!! I appreciate that...

[@mehmetlalek3500]

Hi Raghav, When are you going to make the next tutorial video. I'm impatiently waiting for the next Cypress API tutorial 😀.

[@RaghavPal]

As soon as possible

[@PraveenKumar-fq5ld]

Hi Raghav , I had watch all video on cypress . Thanks a lot for your effort and time . Can you please take a class for cypress cucumber BDD with version above 10 as this seems impossible to understand . To many error's coming , I have followed many videos but no idea where I am going wrong , I checked line by line and file by file . Please make one video for cypress with cucumber BDD . Thanks again for your efforts and time .

[@RaghavPal]

I will try on it Praveen

[@rahulprasad1129]

Hi Raghav , will you be making a video to implement Cucumber in cypress in Cypress masterclass series?

[@RaghavPal]

I will plan Rahul

[@samanthasajeevgomez8735]

Hi Reghav, would be nice get tutorial video of Reading Data from Excel in Cypress. Please post if you can. Thanks for your great videos :) Much appreciated :)

[@RaghavPal]

Will do Samantha

[@jansiranivethakkan4939]

Thank you @RaghavPal for your detailed explanation. It was very useful for me. I didn't see the CI/CD pipeline implementation with jenkins in this course. Do we have that details anywhere added?

[@RaghavPal]

Glad it was helpful Jansi. Okay, you can check the process in detail in my Jenkins playlists. can find all here - automationstepbystep.com/

[@truptisagarikasahoo3528]

Hi Raghav, wonderful explanation of cypress. Learned so many things. Normally, i m able to handle the table. How to handle a table after applying filter?

[@RaghavPal]

Hi Trupti, Handling a table after applying a filter in Cypress can be done by using the .filter() method in conjunction with the .eq() method. Here's an example of how you can select a specific row in a table after applying a filter: /* cy.get("table tr").filter(":contains('Filter Text')").eq(0).click() */ This code will select the first row of the table that contains the text "Filter Text" in any of its cells You can also use the filter method with attribute and value, for example: /* cy.get("table tr").filter("[data-name='Filter Text']").eq(0).click() */ This code will select the first row of the table that contains the text "Filter Text" in its "data-name" attribute. It's also possible to chain multiple filters and eq method to select the specific row, you can also use the .each() method to iterate over the filtered rows and perform additional actions on them. It is important to note that the code above assumes that the table structure and the filter mechanism of the website is already known, and the selectors used to select the table rows are correct.

[@truptisagarikasahoo3528]

@@RaghavPal Thanks a lot Raghav. It was really helpful. Thanks for your precious time. 😊

[@datlaabhilash5166]

Hi Raghav, Could you please create a video or reply here on how to go to website and click on Reviews and verify/validate few good and bad reviews using assertions

[@RaghavPal]

Hi I will work on this

[@Shubham-cy2wd]

Hi Raghav, can you please upload a series for Cypress Framework with latest cypress version ? And including how to explain cypress framework in Interviews

[@RaghavPal]

Hi Shubham Sure, I will plan on this

[@DanielaMitrovic-pt3sj]

Hi Raghav, this course is awesome! In one of the videos you said you will cover Cypress with Cucumber BDD, but I did not see it. Am I missing it somewhere or that is the video that is coming .. ? Thanks for doing this !

[@RaghavPal]

Hi Daniela, can check the Beginners Playlist here automationstepbystep.com/

[@DanielaMitrovic-pt3sj]

Hello Raghav, I really like your videos. Do you have some other course on Cypress that includes more concepts( even if it has to be paid). I really like the way you are explaining. Please let me know if exist, I would like to take it. Thanks

[@RaghavPal]

Hi, can find all Cypress tutorials that I have created here - automationstepbystep.com/

[@whitenoisefocus7962]

Hi Raghav, I finished this tutorial. It was great! I only have 1 question, when we created our Login_page.js, this is the only test that doesn't end in cy.js. was this an oversite? Thanks again.

[@RaghavPal]

Yes, correct. Also you can check the naming conventions if any or add in the configuration file

[@junlin9139]

Any cypress examples videos?

[@RaghavPal]

Hi, Can check all cypress videos here - automationstepbystep.com/

[@thewiseindian]

Dear Raghav, I was wondering where is link for masterclass 3 for Cypress? Did you miss it? or this masterclass is number 3 insted of 4?

[@RaghavPal]

yes, it was missed, will publish it today

[@user-ce1ss2li8o]

I am looking for a good lesson on using custom commands and cy.session for login any recommendations?

[@RaghavPal]

Sure, here are some resources for learning how to use custom commands and cy.session in Cypress: Cypress Custom Commands: This is the official documentation for creating and using custom commands in Cypress. It includes examples and explanations of how to create custom commands, as well as best practices for using them effectively. You can find it here: docs.cypress.io/api/cypress-api/custom-commands Cypress Session: This is the official documentation for using cy.session in Cypress. It explains how to use cy.session for logging in and maintaining state across tests. You can find it here: docs.cypress.io/api/commands/session Cypress Recipes: This is a collection of useful code snippets and tips for working with Cypress, including custom commands and cy.session. You can find it here: github.com/cypress-io/cypress-example-recipes I hope these resources help you learn more about using custom commands and cy.session in Cypress!

[@rakeshradhakrishnan2855]

I think you have missed to add masterclass 3 for cypress. Can you please add that video or if it is already added can you please provide the link. Thanks in advance 👍

[@RaghavPal]

Hi Rakesh, yes, it was missed, will publish it today

[@rakeshkanojiya6169]

Hi Raghav, Can we have one videos for running Cypress file from Jenkins CICD Pipeline using Github

[@RaghavPal]

I will plan Rakesh

[@noorulainqadir9245]

Hi Raghav, I need your guidance. I wrote a script in Cypress to find duplicate entries in PDFs. It works when I have one file in fixtures. Now, I want to take it a step further. I want to create a folder, put all my PDF files there, and dynamically read them using their file extensions or other annotations. Then, I want to log the findings in a report with the corresponding file names so that the user can easily see which file has duplicate entries. Can you help me with this?

[@RaghavPal]

Noor Here are the steps on how to create a Cypress script to find duplicate entries in PDFs and log the findings in a report with the corresponding file names: 1. Create a folder to store your PDF files. 2. Put all your PDF files in the folder. 3. Create a new Cypress script file. 4. Import the following modules: ```javascript import fs from 'fs'; import pdfjsLib from 'pdfjs-dist'; ``` 5. Define a function to read a PDF file: ```javascript function readPDF(filePath) { return new Promise((resolve, reject) => { fs.readFile(filePath, (err, buffer) => { if (err) { reject(err); return; } const pdfDoc = pdfjsLib.getDocument(buffer); pdfDoc.promise.then(resolve); }); }); } ``` 6. Define a function to find duplicate entries in a PDF file: ```javascript function findDuplicateEntries(pdfDoc) { const pages = pdfDoc._pdfInfo.numPages; const entries = []; for (let i = 1; i textContent.items.map(item => item.str).join(' ')); entries.push(text); } const uniqueEntries = new Set(entries); const duplicateEntries = entries.filter(entry => !uniqueEntries.has(entry)); return duplicateEntries; } ``` 7. Define a function to log the findings in a report: ```javascript function logFindings(duplicateEntries, fileName) { const reportFile = fs.createWriteStream('report.txt'); reportFile.write(`File name: ${fileName} `); duplicateEntries.forEach(entry => { reportFile.write(`Duplicate entry: ${entry} `); }); reportFile.end(); } ``` 8. Write the main test case: ```javascript it('should find duplicate entries in PDFs', async () => { const pdfFiles = fs.readdirSync('./pdfs'); for (const pdfFile of pdfFiles) { const filePath = `./pdfs/${pdfFile}`; const pdfDoc = await readPDF(filePath); const duplicateEntries = await findDuplicateEntries(pdfDoc); if (duplicateEntries.length > 0) { logFindings(duplicateEntries, pdfFile); } } }); ``` 9. Run the Cypress script: ``` npx cypress run ``` This will generate a report.txt file with the list of duplicate entries for each PDF file. I hope this helps

[@noorulainqadir9245]

@@RaghavPal Thankyou raghav , it was too detailed and understandable.

[@azimadayani2379]

Hi Raghav I followed your instructions for downloading file, but I am getting this error: Object prototype may only be an object or null

[@RaghavPal]

Hi Azima, not too sure on this, This can be app side issue, this can help - stackoverflow.com/questions/57421582/typeerror-object-prototype-may-only-be-an-object-or-null-undefined-angular-8

[@ahtishamkayani1]

Hi sir please add masterclas 3 for cypress, please upload that

[@RaghavPal]

Hi Ahtisham, yes, it was missed, will publish it today

[@mybook2837]

what to do, if input type =button, not file, how to browse for that

[@RaghavPal]

Hi, you can use the cy.get() command to select the file input element, and then use the cy.attachFile() command to upload a file. Here is an example: /* cy.get('input[type=button]').attachFile('path/to/file.txt') */ Make sure the element is visible and active (not hidden)

[@SineQuaNon1]

Hello, I have a question. In Cypress, when the test comes to an end, the chrome window (and other bowsers if used) closes and returns to the main page, where we have Specs, Runs, Settings etc. How to keep it in the chrome window?

[@RaghavPal]

Hi SineQuaNon, In Cypress, you can use the cy.end() command to end a test and keep the browser window open. This command ends the currently running test but keeps the browser window open, allowing you to interact with the application manually or run further tests. For example: describe('My test', () => { it('does something', () => { // ... test code here cy.end() // end the test but keep the browser window open }) }) Alternatively, you can use the cy.debug() command to pause the test and open the browser's developer tools. This allows you to interact with the application and debug any issues. describe('My test', () => { it('does something', () => { // ... test code here cy.debug() // pause the test and open the browser's developer tools }) }) cy.end() and cy.debug() can only be used within a test and not in before or after hooks.

[@SineQuaNon1]

@@RaghavPal Many thanks Raghav. I really appreciate you taking the time and providing such a detailed answer. Regards,

[@AyanloyeSegun-cn8kk]

Hi RaghavPal, i love yout videos, i can't find BDD for cypress. please can you help with that

[@RaghavPal]

Ayanloye Have not created specific to BDD. can check all lectures here - automationstepbystep.com/

[@reshmaresh4117]

Why bdd is removed from this section ?

[@RaghavPal]

I will check and add lecture on that Reshma

[@-VaajithRahamanR]

sir when will you post the 5th video? , I want cucumber with cypress !!

[@RaghavPal]

I will plan on it

[@anniestephesaras8911]

Sir can you put a video for...how to read data from Excel file using Cypress

[@RaghavPal]

I will add Annie

[@anniestephesaras8911]

@@RaghavPal Sir I have one doubt...in Cypress using mochawesome report...if I am running a test case...each time when I run..it will generate the report ah?....or only if I gave the comment for generate report in the command prompt terminal it will generate report ah? And also if I'm generation a report for a test case at time 11 ....and once again at 12...it will give separate report or it will overwrite it?

[@gurinderjeetsingh6709]

Can u make a video on cy.session as i am new not able to follow it ,like i have test 1,2,3,4 under test scenario when i execute test case 1,2 executes but user automatically loges out on test 3,4 i am stuck here ,it would be great if you could help me with some example

[@RaghavPal]

I will do Gurinder

[@gurinderjeetsingh6709]

@@RaghavPal thank you ..

[@HabibUllah-jo7vm]

kindly share a link..in version 10 i am also faced same situation.

[@dunyan1586]

What is the difference between the masterclass courses, is it down to versions?

[@RaghavPal]

Hi, Masterclass sessions are complete projects/frameworks in single session or at most 3-4 parts

[@dunyan1586]

@@RaghavPal So to learn about the basics, which course/list of videos should we use?

[@RaghavPal]

Both can work, in case of Cypress, masterclass will be good as it was created with the newer version

[@dunyan1586]

@@RaghavPal so i ll watch one of the latest masterclass videos and apply them straight? Will it be enough for the basics?

[@RaghavPal]

Yes, more than basics, you can do any Cypress project after this

[@rihaskh]

cypress reporting is not explained in this video ???

[@RaghavPal]

Can check cypress playlist here - automationstepbystep.com/

[@AngryBird-Rvti]

where can I get master class 5

[@AngryBird-Rvti]

I'm done with these four and Learnt a lot Thanks for such a useful videos ...But unable to get further master sessions

[@RaghavPal]

Hi Revti, as of now there are 4 sessions. Can check the playlists here - automationstepbystep.com/

[@wayezahmed1540]

Hi Raghav! Thank you for your tutorials. I followed Masterclass 1-4 here. Then I went to the following video for HTML reports, where you used cypress.json file to add configuration. kzbin.info/www/bejne/gGqkeYmBg6meercfeature=shared But in my project I do not have cypress.json file. Could you tell me how I can get this file to add configuration please?

[@RaghavPal]

Wayez The cypress.json file is no longer needed in the latest version of Cypress. This will help: Using a cypress.json configuration file is no longer supported. Replace this configuration file with a cypress.config.js, cypress.config.ts, cypress.config.cjs or cypress.config.mjs file. docs.cypress.io/guides/references/changelog docs.cypress.io/guides/references/configuration

[@mehmetlalek3500]

Hi Raghav , I followed your all 4 tuturial sessions. Thank you for all your great videos 😃. I have done them with TypeScript. Only last one with File download I get 2 error messages. One " Try `npm i --save-dev @types/cypress-downloadfile` if it exists or add a new declaration (.d.ts) file containing `declare module 'cypress-downloadfile/lib/addPlugin';`ts(7016). P.S. I would like also to mention that my addPlugin in js extend type. Should I change/download addPlugin in ts extend type? How can I do that? I could not achieve that. The other error message. I have "require" red underlined "require('cypress-downloadfile/lib/downloadFileCommand')" when I write this in commond.ts file. Cannot find name 'require'. Do you need to install type definitions for node? Try `npm i --save-dev @types/node` and then add 'node' to the types field in your tsconfig. I downloaded this npm i --save-dev @types/node. But it doesn't help me. I could not solve this issue all day. Could you pls. help me?

[@RaghavPal]

Hi, I will need to check this with hands-on, for now can try some online help

[@oluwolebadmus6374]

hey Raghav. it seems .attachFile ( ) function has been deprecated. I keep getting the "cy.get(...).attachFile is not a function error. ANy alternative?

[@oluwolebadmus6374]

EDIT: I used .selectFile and it seems to work.

[@RaghavPal]

Great

[@HabibUllah-jo7vm]

cy.preserveOnce is not working for me.. If there is an alternative to cypress.cookies.preserveOnce in version 10 please share a link. If there is no video, please make one. Thank you very much.

[@RaghavPal]

Hi Habib, I will need to check, see if this helps - stackoverflow.com/questions/69605268/cypress-cookies-preserveoncesession-id-isnt-working-when-called-in-aftereac