چگونه تست های Cypress را با استفاده از توانایی های جاوا اسکریپت بهینه کنیم؟ (قسمت 1. حلقه ها)

درود بر همه دوستداران سرو!

کسانی که تجربه کار با آنها را داشته اند Cypress.io بدانید که واقعا ابزار فوق العاده ای است که فرصت های عالی برای توسعه و اجرای تست های با کیفیت و قابل اعتماد در پروژه های شما فراهم می کند. بنابراین تنها چیزی که برای ما باقی می ماند این است که بتوانیم از این فرصت ها بهترین استفاده را ببریم.

واقعیت این است که در چند سال گذشته، من با رویکردهای مختلفی برای نوشتن تست‌ها، گاهی اوقات با مدل‌ها و قالب‌های اساساً متفاوت برای ساخت سناریوهای تست و موارد آزمایشی مواجه شده‌ام. و اغلب اتفاق می‌افتد که آزمایش‌های مکتوب از قبل به بهبود جدی یا حتی بازسازی کامل نیاز داشتند، عمدتاً برای اطمینان از قابلیت اطمینان آنها و کاهش زمان لازم برای اجرای آنها. بدیهی است که به عنوان یک مهندس QA، ارزیابی و بهینه سازی مداوم فرآیندهای تست برای اطمینان از بالاترین سطح ممکن از تضمین کیفیت بسیار مهم است.

و طبق مشاهدات من، مشکلات اغلب نه تنها به دلیل عدم درک عمیق از دستورات داخلی چارچوب تست، بلکه اغلب به دلیل ناتوانی در اعمال ایجاد می شود. قابلیت های اولیه زبان برنامه نویسی در تست ها این باعث شد تا مجموعه‌ای از مقالات بنویسم که در آن برخی از تکنیک‌های خود را برای بهینه‌سازی تست‌های Cypress با تکیه بر قابلیت‌های ساده و عمدتا آشنای جاوا اسکریپت به اشتراک می‌گذارم.

در میان رایج ترین خطاها، یک گروه جداگانه را می توان برای مواردی شناسایی کرد که مهندسان QA به طور مکرر اقدامات مشابهی را روی عناصر مختلف انجام می دهند، خواه فیلدها، دکمه ها، پیوندها یا هر عنصر رابط کاربری دیگری باشد. اغلب، بسته به عناصر آزمایش شده یا اقدامات انجام شده، آنها اغلب به آزمایش های جداگانه تقسیم می شوند. این منجر به افزایش شدید تعداد تست‌ها می‌شود، که با وجود پیش نیازهای متعددی که در قبل از هر و بعد از هر قلاب ها، که بارها و بارها با اجرای مجموعه های آزمایشی تکرار می شوند. در برخی موارد، چنین حذف های غیر موجهی در نهایت منجر به افزایش قابل توجهی در زمان کلی اجرای آزمایش ها می شود.

به طور کلی، توجه به این نکته ضروری است که چنین اقدامات اشتباهی با خشک اصل، که می‌تواند نگهداری آزمون‌ها را سخت‌تر، اجرای آهسته‌تر و مستعد خطاها و ناهماهنگی‌ها کند.

بنابراین، در مقاله اول، می‌خواهم درباره زمان و نحوه بهینه‌سازی اقدامات، رویدادها یا ادعاهای تکراری در تست‌های Cypress با استفاده از جاوا اسکریپت صحبت کنم. حلقه ها برای اجتناب از موقعیت های ناسپاسی فوق الذکر.

پس از تجزیه و تحلیل موارد متداول از اقدامات تکراری در طول آزمایش، من شناسایی کردم 9 سناریو رایج جایی که استفاده از حلقه ها موثرتر است. مطمئناً این فهرست جامعی نیست، زیرا ممکن است موارد دیگری بسته به سناریوهای آزمایشی مشخص شده رخ دهد. در مرحله بعد، من قصد دارم هر یک از این سناریوها را با جزئیات بررسی کنم و با مثال های خاص نشان دهم که چگونه حلقه ها می توانند به طور قابل توجهی به بهینه سازی تست های Cypress شما کمک کنند.

1. تکرار از طریق مجموعه ای از آیتم ها یا عناصر

هنگام تکرار از طریق مجموعه ای از آیتم ها یا عناصر، حلقه ها برای انجام کارهای تکراری مفید هستند. به عنوان مثال، اگر چندین چک باکس در یک صفحه وب وجود داشته باشد، می توان از یک حلقه برای انتخاب یا لغو انتخاب هر یک از آنها استفاده کرد. حلقه را می توان با تنظیم مقادیر شروع و پایان کنترل کرد و کد را تمیزتر و کارآمد کرد. با استفاده از حلقه‌ها در این سناریو، می‌توانید اطمینان حاصل کنید که همه آیتم‌ها یا عناصر در صورت نیاز تأیید شده یا با آنها تعامل دارند.

در این مثال از Array.from() روش تبدیل یک شی آرایه مانند که توسط Cypress برگردانده شده است cy.get() دستور به یک آرایه استاندارد سپس از a استفاده می کنیم forEach() حلقه برای تکرار روی هر عنصر و انجام برخی اقدامات.

2. تکرار یک آزمون با ورودی های مختلف یا خروجی های مورد انتظار

به عنوان مثال، اگر چندین فرم در یک صفحه وجود داشته باشد که هر کدام به ورودی های متفاوتی نیاز دارند، می توان از یک حلقه برای اجرای همان آزمون با هر فرم استفاده کرد. حلقه را می توان با استفاده از عبارات شرطی کنترل کرد که خروجی های مورد انتظار برای هر ورودی را تأیید می کند. این رویکرد باعث صرفه جویی در زمان و کاهش مقدار کد مورد نیاز برای آزمایش چند سناریو می شود.

در این مثال از a استفاده می کنیم برای … از حلقه با تخریب برای تکرار یک آزمایش با ورودی های مختلف و خروجی های مورد انتظار. ما آرایه ای از اشیاء را تعریف می کنیم که هر کدام دارای ویژگی ورودی و خروجی مورد انتظار هستند و از حلقه برای تکرار روی هر شی و انجام تست استفاده می کنیم.

3. پیمایش در چندین صفحه

Cypress test می تواند با اجرای یک حلقه برای بررسی محتویات هر صفحه در چندین صفحه از یک برنامه وب حرکت کند. مقدار حلقه را می توان با دستورات شرطی تنظیم کرد که وجود صفحه بعدی یا قبلی را تأیید می کند. چنین تکنیکی نه تنها سازماندهی کد را بهبود می بخشد، بلکه خوانایی آن را نیز بهبود می بخشد.

این مثال نحوه استفاده را نشان می دهد forEach() حلقه برای پیمایش در چندین صفحه. کد آرایه ای از URL های صفحه ایجاد می کند و سپس از a استفاده می کند forEach() برای بازدید از URL هر صفحه، حلقه بزنید و ادعا کنید که صفحه به درستی با استفاده از Cypress بارگیری شده است should() روش.

4. آزمایش چندین حساب کاربری یا نقش

اگر چندین نقش یا حساب کاربری در یک برنامه وب وجود داشته باشد، می توان از یک حلقه برای آزمایش هر نقش یا حساب با ورود به سیستم با هر مجموعه ای از اعتبار استفاده کرد. حلقه را می توان از طریق عبارات شرطی مدیریت کرد که نتایج پیش بینی شده را برای هر نقش یا حساب کاربری تأیید می کند.

ارزش استفاده از برای … از حلقه در این تست Cypress این است که یک سناریوی آزمایشی را چندین بار با مجموعه‌های مختلف داده اجرا کند. در این حالت، سناریوی آزمایشی ورود به سیستم با اعتبار یک کاربر خاص، انجام برخی اقدامات خاص به نقش او و سپس خروج از سیستم است. حلقه روی آرایه کاربران تکرار می شود و سناریوی آزمایشی را برای هر کاربر در آرایه انجام می دهد. این باعث صرفه جویی در زمان و تلاش در نوشتن تست های فردی برای هر حساب کاربری یا نقش می شود و امکان آزمایش کارآمدتر و جامع تر سیستم را تحت سناریوهای مختلف کاربر فراهم می کند.

5. اجرای همان تست با تنظیمات مختلف

اگر یک برنامه وب دارای چندین پیکربندی باشد، می توان از یک حلقه برای آزمایش برنامه با هر یک استفاده کرد. حلقه را می توان با اجرای دستورات شرطی تعیین کرد که نتایج پیش بینی شده را برای هر پیکربندی تعریف می کند.

ارزش استفاده از برای … از حلقه در این تست برای بهینه سازی اجرای تست با کاهش تکرار کد است. با تکرار بیش از configs آرایه و با استفاده از داده های پیکربندی برای راه اندازی محیط تست و اجرای تست ها، می توانیم از تکرار همان تنظیمات و کد تست برای هر پیکربندی اجتناب کنیم.

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

6. تولید پویا داده های آزمون

از حلقه ها می توان برای تولید داده های آزمایشی به صورت پویا استفاده کرد. به عنوان مثال، اگر نیاز به ایجاد چندین حساب کاربری وجود داشته باشد، می توان از یک حلقه برای تولید مجموعه ای از داده های کاربر با هر تکرار استفاده کرد. حلقه را می توان با تنظیم مقادیر شروع و پایان و با تعیین تعداد کاربران برای ایجاد کنترل کرد.

این forEach() حلقه در اینجا برای تکرار روی هر کلید در مورد استفاده می شود testDataشیء کنید و برای هر ورودی یک آزمایش انجام دهید. این حلقه کد را قادر می‌سازد تا از تکرار یک مورد آزمایشی برای هر ورودی جلوگیری کند و در عوض، آزمایش یکسانی را برای هر ورودی به صورت پویا انجام می‌دهد و در نتیجه در زمان و تلاش صرفه‌جویی می‌کند.

با استفاده از یک حلقه برای تکرار بر روی testDataشی، اضافه کردن موارد تست بیشتر بدون تکرار کد آسان می شود. این کار کد را کارآمدتر می کند و احتمال خطا را در هنگام اضافه کردن تست های جدید کاهش می دهد.

7. تکرار از طریق مجموعه ای از مراحل تست

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

در این تست Cypress، هر مرحله یک شی است که حاوی اطلاعاتی در مورد عملی است که باید در طول آزمایش انجام شود، مانند کلیک کردن روی یک دکمه یا تایپ کردن در یک فیلد ورودی. با استفاده از یک حلقه forEach() برای تکرار از طریق آرایه مراحل، آزمون می تواند هر عمل را به صورت متوالی و با کد تکراری کمتر انجام دهد.

در داخل حلقه، تست ویژگی عمل هر شی step را بررسی می کند تا مشخص کند چه عملی باید انجام شود. بسته به ارزش عمل، تست از دستور Cypress متفاوتی برای انجام عمل استفاده می کند. به عنوان مثال، اگر عمل کلیک باشد، آزمون از آن استفاده می کند cy.get().click() دستور شبیه سازی کلیک دکمه

8. آزمایش عملکرد یا رفتار یکسان در محیط های مختلف

حلقه‌ها را می‌توان برای آزمایش عملکرد یا رفتار یکسان در محیط‌های مختلف، مانند وضوح صفحه‌نمایش چندگانه یا انواع مرورگر، استفاده کرد. به عنوان مثال، اگر یک برنامه وب نیاز به آزمایش بر روی مرورگرهای مختلف یا وضوح صفحه نمایش داشته باشد، می توان از یک حلقه برای آزمایش برنامه در هر پیکربندی استفاده کرد. حلقه را می توان با استفاده از دستورات شرطی که خروجی های مورد انتظار برای هر محیط را تأیید می کند، کنترل کرد.

در داخل حلقه، آزمایش با استفاده از cy.viewport() دستور مطابقت با ویژگی های عرض و ارتفاع محیط فعلی. استفاده از یک حلقه در این روش به آزمون اجازه می دهد تا چندین بار با پیکربندی های مختلف اجرا شود، بدون نیاز به تکرار کد آزمایشی یکسان. این می‌تواند تست را کارآمدتر و نگهداری آن را آسان‌تر کند، به‌ویژه زمانی که محیط‌های مختلفی برای آزمایش وجود دارد.

9. منتظر ظاهر شدن یک عنصر چند بار

در این سناریو، از حلقه‌ها می‌توان برای منتظر ماندن یک عنصر چندین بار در یک صفحه وب استفاده کرد. به عنوان مثال، اگر یک صفحه وب دارای یک چرخنده بارگیری است که چندین بار در طول تعاملات مختلف ظاهر می شود، می توان از یک حلقه برای منتظر ماندن برای ناپدید شدن اسپینر هر بار که ظاهر شد استفاده کرد. حلقه را می توان با تنظیم حداکثر زمان انتظار یا با تعیین شرایطی که سیگنال پایان حلقه را کنترل می کند.

در این مثال، ما از a استفاده می کنیم whileحلقه برای بررسی مکرر اینکه آیا عنصری دارای شناسه است یا خیر element در صفحه وجود دارد حلقه تا زمانی که عنصر پیدا شود یا به حداکثر تعداد تلاش های مجدد برسد، به کار خود ادامه می دهد. استفاده از حلقه ای مانند این مهم است زیرا به ما امکان می دهد شرایطی را مدیریت کنیم که ممکن است یک عنصر بلافاصله در صفحه ظاهر نشود یا در آن تاخیرهای شبکه یا سرور ممکن است باعث شود که عنصر فقط پس از مدت زمان مشخصی ظاهر شود. بدون حلقه، اگر عنصر را در اولین تلاش پیدا نکند، تست ما ممکن است شکست بخورد، حتی اگر عنصر در نهایت در صفحه ظاهر شود.

نتیجه

بنابراین، ما تأیید کرده‌ایم که کاربردهای مفید متعددی از حلقه‌ها در تست‌های Cypress وجود دارد که به طور قابل‌توجهی کارایی آزمایش را بهبود می‌بخشد، زمان صرف شده برای اجرای آزمایشی را کاهش می‌دهد و پوشش تست را افزایش می‌دهد. به طور کلی، حلقه ها ابزار مهمی برای خودکارسازی تست در Cypress، بهبود فرآیند و صرفه جویی در زمان و تلاش هستند. در مقاله‌های بعدی، سایر ویژگی‌های جاوا اسکریپت را بررسی خواهیم کرد که می‌توانند به بهینه‌سازی تست‌های Cypress شما کمک کنند.

کد منبع همه نمونه های ارائه شده را می توان در متن مربوطه یافت مخزن در GitHub.

با تشکر از توجه شما! تست مبارک!