I'm really impressed with their accessibility testing

@murat, thanks for video. Can i suggest one thing..please zoom in coding video a bit, its hard to make out what is there on the screen

Very good.

Awsome solution!

This is great, thank you! I also struggled getting the xk6 binary working with the extension and then came across your suggestion. Thank you!

Thank you! Awesome solution!

Thanks, saved me a lot of time today.

Hi Murat, thanks for the video. I love Cypress component testing. After Dan Abramov's talk, I have started to look at Next.js server components, and my first thoughts were that it would be a pain in the neck to component test this kind of stuff with Cypress. It looks like you found a workaround, but I really miss the intercept syntax. What would you do if the component has more than one fetch request? I would like to learn how you plan this. Subscribed!

Sir but I think it wouldn't be working if we use k6 web dashboard, so I've already tried the command like this: ``dotenv -e .env k6 run --out 'web-dashboard' main.js`` it's to run the test and the output of the test is from web dashboard k6.

So cool, thanks!

Thank you for your obsession :)

Videoları Türkçe çekmeyi düşünürseniz fazla fazla ilgi çekeceğini düşünüyorum

Thank you for using our tool!

Hi! I have trouble running it as you showed. If i try to run it as you did I get an error saying .env is not a valid boolean. If i try to use -f flag to specify .env file dotenv is giving me an error that "k6" is not a valid command even though it's installed globally and added to path. I tried doing it on windows 10 and on ubuntu subsystem through WSL with same results.

Graciiiass!!!!

Have you integrated e2e coverage report with Next

For fixing the CSS issue you need to add <div id="__next_css__DO_NOT_USE__"></div> this line to the component-index.html file. After that you will be able to import your global CSS file in component.ts.

Sir Murat, could you make a tutorial for testing web performance by using the K6 tool? And also make the generated report after completed the test. Thank you so much for all of your tutorial sir ❤

Lots of respect 🫡 . Please keep sharing your experience. It has helped me learn alot of new things. Keep shining brother ✨✨

Thank you for sharing. Have you tested this with a session callback that, for example, adds a property to the user object? The intercept seems to prevent the callback from running...

I was actually trying to make this all day,as i was getting into cypress, thank you for the video.

Love the 2k resolution screen record.

Nicely done. I was having trouble with it, you saved my skin.

Very very useful trick 👏

Love your style and feel the same. I have adopted a pattern of having an 'env' object in each test file to encapsulate the config and keep it nice and simple for the tests that I thought you might like: const env = { endpoint: __ENV.SOMEOLDSYSTEM_ENDPOINT || fail('Missing SOMEOLDSYSTEM_ENDPOINT environment variable'), pathA: 'home' get endPointWithPath() { `${this.endpoint}/${this.pathA}` } }; Gives nice fast feedback to testers when they miss out environment variables and allows me to compose complex config whilst keeping it DRY. Environment config does get very complex!

For react-router v5 and react v17, I made the below modifications and they worked for me: const wrapped = ( <MemoryRouter initialEntries={[route]}> <Switch> <Route path={path} render={() => { return WrappedComponent; }} /> </Switch> </MemoryRouter> ) 1. Replaced Routes with Switch 2. Instead of giving the WrappedComponent to element prop, I returned it from the render method. In my case, the react component was accessing URLSearchParams. For example: something like '/abcd?q=param1&v=param2' In this case, I passed my route as : '/abcd?q=param1&v=param2' and path as: '/abcd' The above worked for me and I verified it by making an assertion on pathname and search using the cy.location, and I hope this is the way it should be done for URLSearchParams. I am open to any suggestions.

thanks for this video. have you had any luck using getServerSession from next auth to work with cypress?

Thanks!! This config helped me a lot!

merhaba, mailosaur'u atılan bir mailin içindeki veriyi kontrol edip içinde yer alan linke tıklamam gerekiyor,nasıl yapabilirim ? bununla ilgili bir videonun çok faydalı olacağını düşünüyorum.

Worked for me on 13.5.0 :) thank you!

Thanks! 🫂

Thank you for sharing, I'm on the process of choosing a testing library to learn and cypress seems to be the way to go

Thank you for showing and explaining all of this! Helped me understand much better

sooo, it's just an aws call, I think doing this in a bash script would play nicer with the CI, so that everyone could play around with it. I may not have node running in my actions runner

thanks for share!

This is a great tip - much easier to maintain with this approach!😀

Cypress 12.17.4. Not works

Thank you for sharing, Murat. It helped us 👍

did not work for me i still keep getting "CypressError: `cy.request()` must be provided a fully qualified `url` - one that begins with `http`. By default `cy.request()` will use either the current window's origin or the `baseUrl` in `cypress.config.js`. Neither of those values were present." this error

Thank you for the video. Question regarding your "getBy*" custom command, don't you need something similar for "find"?

Bruh, put a pipe in your map. Then you don't need to mapmapmap. Just map(pipe(prop, constructN, invoke))! Or maybe `really' instead of pipe?

Thank you!!

Hi Murat, is this video still good for Cypress version 10 and higher? What kind of modifications I should do to make it work on Cypress version 12? Thank you very much.

Nice, this should be included into the official documents

Thanks for the approach

Can you share git repo for more understanding.

Thanks for much for this! Can't believe something this simple was so hard to find resources on, online :)

It definitely do helped me, thanks for this awesome demonstration. 👍🏼

Thank you. You saved my day!

Amazing as always