ریاکت برای غارنشینان 6 (تست نویسی با jest )

اصلا به قیافه ی من میخوره تست نویس باشم آخه؟

من تا حالا نتونستم با نوشتن تست ارتباط درستی برقرار کنم و هنوز نمیدونم snapshot یا mock چی هستن ..در کل من تابع نیازم .. میپرسی کی تست لازمم شد؟

خب من نیاز به یه تقویم برای پروژه م داشتم که هم شمسی ساپورت کنه و هم میلادی.که با تقویم کیارش آشنا شدم

https://github.com/Kiarash-Z/react-persian-calendar-date-picker

GitHub - Kiarash-Z/react-modern-calendar-datepicker: A modern, beautiful, customizable date picker for React
GitHub – Kiarash-Z/react-modern-calendar-datepicker: A modern, beautiful, customizable date picker for React
A modern, beautiful, customizable date picker for React – GitHub – Kiarash-Z/react-modern-calendar-datepicker: A modern, beautiful, customizable date picker for React

یه تقویم خیلی خوب و سر راست بود. منتها من پروژه م تایپ اسکریپتی بود و باید میلادی رو هم ساپورت میکردم و خیلی هم تجربه ی زیادی نداستم …البته هنوزم ندارم … دیدم کیارش یه فایل تست داره و چون برای فانکشن هایی که استفاده کرده بود تست نوشته بود و تست ها مقایسه ی اعداد با هم بود به سادگی از کد ها میشد فهمید که داره چطور کار میکنه …دیدن اون تست ها بهم کمک کرد تا ساختار کد رو بهتر بفهمم و خیلی ساده بتونم بهش میلادی رو هم اضافه کنم …البته چون میخواستم دو تا ماه رو کنار هم نشون بدم کلی گند زدم توو کد تمیز کیارش و روم نمیشه اصلا پابلیکش کنم ..یه ریفکتور اساسی لازم داره .. بگذریم … خلاصه من با تست اونجا آشنا شدم و تست هایی که تا الان ازشون استفاده کردم همه شون توابع pure بوده و تا حالا برای کامپوننت تست ننوشتم. فعلا برای همون نیاز jest رو نصب میکنم تا ببینیم در آینده چی بر سرمون میاد

نصب jest کاری نداره .اینو میزنی

npm install –save-dev jest

برای نصب افزونه ی vscode هم بعد از ctrl+shift+p اینو میزنی

ext install orta.vscode-jest

خب حالا یه فایل تست میسازیم ..فایل تست با اسم .test.tsx تموم میشه

اولین تستمون میگه اگه 1+2 مساویه 3 بود تست رو پاس کن که خب همیشه 1+2 میشه 3 و تست پاس میشه …بعد از نصب افزونه میبینین که اون پایین jest با یه تیک ظاهر شده یعنی همه ی تست ها روال هستن … یه تنظیم داره که داخل فایل setting.json میتونین مشخص کنین هروقت vscode رو باز میکنین خودکار تست هارو اجرا کنه …بگذریم ..میبینین که چند تا ارور داریم …داستان اینه که ما چیزی ایمپورت نکردیم و تست رو نمیشناسه..اما چرا کار کرد؟ نمیدونم …

باید پلاگین مربوط به eslint رو برای jest نصب کنیم

npm install –save-dev eslint-plugin-jest

و بعد “plugin:jest/recommended” رو به لیست extends های کانفیگ eslint اضافه کنیم و توی قسمت env هم ‘jest/global’ رو تعریف میکنیم

برای شما

خب ارور هامون هم رفت..البته اون ارور وسطی که واسه تایپ اسکریپته نرفته…میگه که فایلت باید یه ورودی یا خروجی داشته باشه … ماست نباشه در واقع که خب تفایل ما ماسته و مهم نیست

جلو تر وقتی خواستیم resolve ایمپورت رو هم راه بندازیم باز لازمه که بیایم سروقت تنظیمات jest ..الان فعلا jest اگه تستی ببسنه اجرا میکنه و در صورت لزوم ارور میده

توی فایل package.json هم یه اسکریپت تست براش ست میکنیم .کافیه توی قسمت scrips اسن رو اضافه کنیم “test”: “jest”

بزار یه بار هم اجراش کنم خیالم راحت شه

یه کم جلوتر که بریم حتما snapshot یا mock رو هم یاد میگیرم و این پروژه رو پر تست جلو میبرم…

یکی از خوبی های نوشتن اینه که قسنگ معلوم میشه چیو بلد نیستی…خوشم اومد

ایشالا تست هاتون همیشه پاس شه …فعلا

نویسنده مطلب: مهران مطیعی

منبع مطلب

به فکر سرمایه‌گذاری هستی؟

با هر سطحی از دانش در سریع‌ترین زمان با آموزش گام به گام، سرمایه گذاری را تجربه کن. همین الان میتونی با لینک زیر ثبت نام کنی و ۱۰ درصد تخفیف در کارمزد معاملاتی داشته باشی

ثبت نام و دریافت جایزه
ممکن است شما بپسندید
نظر شما درباره این مطلب

آدرس ایمیل شما منتشر نخواهد شد.