Finally a KZreadr that doesn't constantly do html crash course videos... keep it up with medium/advanced topics! Love it!🎉

@ScriptRaccoon

11 ай бұрын

Finally? There are tons of KZreadrs who cover medium or advanced topics in web development.

@johnbeckham606

11 ай бұрын

@@ScriptRaccoonoh, can you name some of them? would love to check them out :) thanks 🙌

@lord-of-the-shinobi-world

11 ай бұрын

That ain't the problem. The problems are: - Do those videos have clear timestamps? - Can you code by yourself after you are done watching the video? - Can you compete with the low/middle/high/ultra high level developers like you? Or will you fail bad? - How long will it take for you to move onto the next level of developing? If the answers for these questions are "no", or "i don't know", then you'd better stop watching videos, and start doing first

@johnbeckham606

11 ай бұрын

@@lord-of-the-shinobi-world I'm not a beginner fyi. I was just complaining about KZreadrs that continue to create HTML5 courses and even sell them. It's all already on the Internet. I want to see new technologies and see how others use them in different scenarios. What you wrote are facts anyway, good point, but it ain't related to what I wrote. I hope that I made it now clear what I meant 😁🙌

@lord-of-the-shinobi-world

11 ай бұрын

@@johnbeckham606 Well then, think of those things as "teaching material". If you just repeat the same thing, over and over again, your students will leave you. I am in middle level, so i understand what you're saying

Just something I needed these days. I have already middle size app written with Next.js 13 but with 0% tests 😁 Thank you Dave

Hey Dave! You've are a saviour/ultimate mentor for those who are diving deep into Next.js. Appreciate your progressive content. Thank you.

Hi Dave, I am doing some of your other videos, and a little something I wanted to thank you for: Thanks for explaining the little things that you do and not just doing them (e.g. Ctrl + B to hide the file tree, etc etc). These tidbits make the learning journey more fun, clearer, and basically make me feel more involved in what's happening, which makes me want to keep at it, so muchas gracias ;-)

thank you for this, got jest into my existing audio player project. It's crazy that getting one of most popular testing libraries to work with one of most popular frameworks takes so many workarounds.

Thank you dave, i hope you will continue this testing video as series, it will help so much❤

This is what we want !!!! Dave you are my hero! You always provide useful and advanced stuff !!! 👍👍

the configuration really did help as its setup is not straight forward thank you Dave🔥

Thank you! I really hope you produce more unit-testing videos with React!

Looking forward to more videos on testing, thanks Dave.

Three hours of head banging the desk trying to get Jest up and running with NextJS and failing, or twenty five minutes following Dave's instructions. Thank you!

Oh, thank you so much! Really saved my day❤ I don't know about others, but for me, working with typescript sometimes can be very head-scratching and I myself fell into quite a few traps😂 And contents like setting configs or some other little tricks can be very very helpful, just like what this video demonstrates. Thank you again and hopefully we could watch more great video in this channel

17:06 Or instead of downgrade the dependency you can: install this: npm i -D @types/jest import '@testing-library/jest-dom'; in the testing files import '@testing-library/jest-dom' in the jest.setup.js file

@DaveGrayTeachesCode

11 ай бұрын

You can, but you shouldn't have to. As mentioned, hopefully the issue will be fixed in the near future. The update is just a few days old.

@rubendacostaesilva8442

9 ай бұрын

Instead of -> import '@testing-library/jest-dom' in the jest.setup.js file You can add -> "files": ["jest.setup.js"] in your tsconfig.json file

@Ecki107

2 ай бұрын

For me a similar approach worked: 1. npm i -D @types/jest 2. in jest.setup.ts change import "@testing-library/jest-dom/extend-expect"; to import "@testing-library/jest-dom/extend-expect"; And everything works fine. No additional imports needed and way cleaner than relying on an old version

@michaeljakobsen1959

20 күн бұрын

If using the latest versions of NextJS, Jest and Testing Library running npm i -D @types/jest and adding import '@testing-library/jest-dom'; to the test file worked

Thanks for this awesome video i was struggling to understand testing with nextjs ❤

I would love to see more videos on Next 13 testing, client, and server components. Also, I am assuming that after this testing series, you are going to create a project on Next 13 with testing included?

I've been fighting jest, typescript, webpack, nextjs, and vite the whole day trying to set up a test runner for a nextjs project created with create-t3-app. The pain in the js ecosystem is real. I hope I can just use bun for everything soon. Anyways, this video got me the closest to a perfect setup just a tiny bit of googling aside from the instructions in this video got jest+RTL working! Thank you!

Yes please, I need to dive into more testing now 😊

Thank you so much for this helpful video ! 😊❤

Great tutorial Dave! highly appreciated

Thank you so much Dave, I tried to follow the next official document to install jest exactly, but I don't know why, there was a red underline at the 'expect' and 'describe'. I was so annoyed. But finally you gave me the solution. It was really helpful. Thanks.

Hey Dave! I'd love some react testing videos. Finding resources to effectively explain testing react hooks and redux usages are few and far between!

It would be nice to see some unit testing in react native using react native library and jest.Also love your explanations.

Great! Waiting for next video.

damn next.js with this versions and all that libraries struggled a lot thank you mate

Nice tutorial,Thanks

AA Dave I am going to watch you while next series if I can

Hey Dave ! any thoughts about a testing course ? Like, what is mock, spy, stub, e2e and unit testing...Maybe a little teoric and practice introduction to these subjects, as a beginner I feel that will be a great adittion to my studies, recently I came across many videos about that. Thank you for your teachings ! Helped me a lot to learn Nextjs

Hi Dave .. Thank you so much about everything .. I learned from you alot of things not just programming .. I learned from you english language also Your accent very clear .. I have one request please .. Can you start with SQL I need this for my work and I need to understand it using your explanation Thanks Hamza

You are the best!!! Thank you! 😍😍😍

There are hundreds testing videos for Reactjs in youtube but i think this is literally first Nextjs testing video ? Please add more

Super Love it thankyou! I used Chai with Hardhat. Yeeew lol...

Yet another great video.

Awesome stuff man

Wise words at the last minute: strive for progress over perfection!

Weldone Sir. I would like the videos for react. Thank you Sir.

Finally, we need more of this Dave, keep it up, I want to question you about two things: The vscode extension you're using for the icons When selecting the pages and not the app features in next project inititializing, will it work with same new SSR and SSG functionalities or we will use the getStaticProps, getServerSideProps keywords, thanks!

@desafiosdev

7 ай бұрын

The icon theme is vscode-icons

A video for react will be very helpful.

Ozm Dave 🔥👍🏼

HI Dave, thanks a lot for the jest video as you asked Could you Please do react vite vitest video on a big react project?? like the blog project you had in your redux video?? want to see how it works compared to jest and learn more on how it does crud on frontend?

Thanks for this Dave. The Using App Router docs at Vercel still do not have specific Testing documentation in the Optimizing section as of Next version 14.0.3 and I was struggling getting Jest and React Testing Library configured properly.

Dave 200k subs today!

thank you!

Hello Dave, Thanks for this teaching. I have one question, What is that .swc folder that made in root directory when you used npm test?

That rolling back for @testing-library/jest-dom@5.16.5 saved me hours of searching. Thanks a lot

Ever thought of adding React native (mobile) tuts to your channel Dave?

yes sir we need react testing video

Hey, can you please make a video on socket io setting up in NextJS 13 App Directory it would be great

Works fine with Next 14.0.1. just nuke yarn-error, yarn.lock and node-modules/ and install everything again before run 'yarn jest'.

How comes you are using extend-expect when it was removed in @testing-library/jest-dom v6.0?

thanks

I was really glad to find this video but when I went through it, I realized things are just too problematic to even set up Jest with the Next 13 right now ... conflict after conflict ... will get back when the issues are resolved ...

dear dave, why in nextjs 13.4 app directory we have several errors for testing aplication?

Mr Dave Can You Give The Effect Filter Of Your OBS

Hello! This is a very nice video for beginners learning about the basics of testing. I came here with a bit more experience and I can't even get one test passing since next 13. The useRouter hook just keeps throwing the same error: " invariant expected app router to be mounted". If you don't have an idea yet about your next video, showing how to setup the tests when using "next/navigation" package should be a good one, not "next/router" (this is important) 👌Thanks for the content

@DaveGrayTeachesCode

11 ай бұрын

Yes, that's a more advanced issue that I was looking into as well. Currently, it seems the solution is to mock next/navigation. A current discussion on this: github.com/vercel/next.js/discussions/48937

@focusme-tv3650

11 ай бұрын

@@DaveGrayTeachesCode Thanks for your response! They seem to have found a pretty cute workaround! I also managed to fix it temporarily by mocking "next/navigation" and then useRouter.mockReturnValue({ push: jest.fn(), replace: jest.fn() });. This way i can see when push/replace are called and with what argument. But I'm defo going to try the stuff in the link you shared 😄

@rubendacostaesilva8442

9 ай бұрын

The useRouter from next/router is meant to be used with the Pages Router. For the App Router, you'll have to import from next/navigation.

Please, please... make a video about How to test React) you are a great teacher... do you work offline as a teacher?)

@DaveGrayTeachesCode

11 ай бұрын

Yes, I do teach university courses.

I am curious, why is your test extension `tsx` as opposed to just `ts`? Is it because you did not create it as a spec file?

@DaveGrayTeachesCode

9 ай бұрын

Keep going in this series and I change it. Really doesn't matter as both work but was unnecessary and created multiple questions :)

Please make a video on react testing using the same.

Great content, please make examples but using JavaScript

thx

Lool, I'm applying this tutorial for a nextjs project I started this week, and a dependency has already changed. eslint-config-next, from my 13.4.16 to Dave's 13.4.17. Not much, but you know, better watch this tutorial in August, or it will become outdated

@DaveGrayTeachesCode

11 ай бұрын

I show an issue Next.js & Jest have right now and actually rollback to 13.4.10 to avoid it. All details in the vid.

Hello, before I use this, anyone knows if the issue was fized in Nextjs 14?

I need some help I have a big app made with expo react native and typescript and for testing typescript, it says it needs ts-jest but I've tried everything and I can't configure it for testing typescript can someone help

codium tutorials please. thats a great tool n ure a great teacher. win || win

I encountered the error " ReferenceError: Can't find variable: document at render ....". I already set testEnvironment: "jest-environment-jsdom". Anybody can help me ? Thanks

is that the issue in next js that you are talking about is fidex in next 14?

Im using yarn, are those commands same for it, like adding dev dependency ?

@DaveGrayTeachesCode

11 ай бұрын

I should do a tutorial on yarn. You can learn more about it here: yarnpkg.com/getting-started/usage

please Dave a video tuto for testing react with typescript

@DaveGrayTeachesCode

6 ай бұрын

I do cover React testing library in this playlist. 😃

Though jest is good and has been around for a time, what is your opinion on something like vitest

@DaveGrayTeachesCode

11 ай бұрын

Vitest is also good. Getting several requests for a React + Vite + Vitest tutorial, too.

Error [ERR_REQUIRE_ESM]: require() of ES Module C:\ ode_modules\string-width\index.js from C:\ ode_modules\cliui\build\index.cjs not supported. Instead change the require of index.js in C:\ ode_modules\cliui\build\index.cjs to a dynamic import() which is available in all CommonJS modules. at Object. (C:\ ode_modules\cliui\build\index.cjs:291:21) when execute test command

I wonder why Nextjs does not come with testing like create react app comes… it would help a lot

@DaveGrayTeachesCode

11 ай бұрын

Maybe someday!

Hey Dave can you teach us auth0 for next js 13 ?

@DaveGrayTeachesCode

11 ай бұрын

I could, but I prefer Kinde Auth. I think it is easier to implement, and my video for it is here: kzread.info/dash/bejne/iah8s6mle6q7org.html

Bruh half the video was just setup and configurations. This is why no one likes to do testing 😂

For 17:00, it helped to install another dev dependency instead of downgrading: npm i --save-dev @types/jest. I'm on -> "@testing-library/jest-dom": "^6.4.2" then adding the line import '@testing-library/jest-dom' at the top as well.

@artsycoder533

5 ай бұрын

This worked for me! Thank you!

Sir please make videos django course from beginniner to advance.

Omg ❤

Why do we have jest.setup.js?

Can you do it more testing with react❤❤❤

for me Screen not available. I have tried everything. such as uninstall node software and reinstall the latest one but no luck. After I tried to create with Next@14 package as per your video suggest. however, no luck. Now I am stuck. your video does not helpful. Import {screen} from "@testing-library/react"

❤

Yikes a lot of work around configuration to get this to work with nextjs!!!

Way tooo much set up lol

david THANK YOU!! I had problem in fil 'jest.setup.js' import '@testing-library/jest-dom/extend-exptect'. we find two soluction: delete only '/extend-expect' or changed to version 5.16.5 in "@testing-library/jest-dom": "^6.4.2",

Replace jest.setup.js with the line "import '@testing-library/jest-dom'" because extend-expect is not there anymore

not gonna lie, all the switching from versions makes everything so uncertain

@DaveGrayTeachesCode

10 ай бұрын

I suggest trying to use the latest version of everything. If it doesn't work, then roll back one of the versions that I did. By the following video in the series, I think I was using the latest Next.js with no issues.

@JayFFresh

10 ай бұрын

@@DaveGrayTeachesCode 🙏 thank you for considering this bump in the road

__tests__/productImages.test.tsx ● Test suite failed to run Cannot find module '@testing-library/jest-dom/extend-except' from 'jest.setup.js' please help

@DaveGrayTeachesCode

11 ай бұрын

Did you install the dependency? All of the dependencies are listed in the package.json file.

@user-eb3cg3lo1t

11 ай бұрын

thank you for reply yes. but i am facing cannot find module for nested components. the components which are individual they are passing tests.

@user-eb3cg3lo1t

11 ай бұрын

SyntaxError: Cannot use import statement outside a module showing this error please help

@wandercruz3502

10 ай бұрын

It is extend-expect not extend-except

npm i -D @testing-library/jest-dom@5.16.5 @testing-library/react @testing-library/user-event jest jest-environment-jsdom ts-jest

@ricardorien

8 ай бұрын

Works fine with Next 14.0.1. Thanks. Just nuke node-modules, and yarn lock before run test and install wverything again.

npm i -D @testing-library/jest-dom @testing-library/react @testing-library/user-event jest jest-environment-jsdom ts-jest you are welcome

thanks