কি টেস্টিং-এ প্রবর্তন করা হয়েছে , জাভাস্ক্রিপ্টের পরীক্ষাগুলি মূলত শুধুমাত্র কোড যা আমরা নিশ্চিত করি যে সফলভাবে চলছে, অর্থাৎ কোনো Error ছাড়াই। যাইহোক, এই সংজ্ঞাটি একটি অতি সরলীকরণের উপায়গুলির মধ্যে একটি হল যে আমরা কোডটি কোথায় চালাই, এর পরীক্ষার পরিবেশ বিবেচনা করে না।
পরীক্ষার পরিবেশকে বিস্তৃতভাবে দুটি উপাদান হিসাবে বিবেচনা করা যেতে পারে: আপনার পরীক্ষা চালানোর জন্য আপনি যে রানটাইম পরিবেশ ব্যবহার করেন (যেমন নোড বা ব্রাউজার) সেইসাথে আপনার জন্য উপলব্ধ APIগুলি।
রানটাইম পরিবেশ
নোডের মতো রানটাইম, বা ডেনো বা বুনের মতো অনুরূপ সরঞ্জামগুলি সার্ভার-সাইড বা সাধারণ-উদ্দেশ্য JS কোড সমর্থন করার লক্ষ্যে। তাদের পরিবেশে এমন API গুলি অন্তর্ভুক্ত করে না যা আপনি একটি ব্রাউজারে আশা করতে পারেন, যেমন DOM এবং HTML উপাদানগুলি তৈরি করা এবং কাজ করা, বা কোনও ভিজ্যুয়াল উপাদান বা রেন্ডার টার্গেটের কোনও ধারণা (অর্থাৎ, কেবল উপাদান নয়, তবে সেই উপাদানগুলিকে দৃশ্যমানভাবে রেন্ডার করা একটি ভিউপোর্টে CSS)।
যেমন, এই সাধারণ-উদ্দেশ্য রানটাইমগুলি ব্যর্থ হবে যদি আপনি চেষ্টা করেন, উদাহরণস্বরূপ, প্রতিক্রিয়া উপাদানগুলিকে রেন্ডার করার যাতে সেগুলি পরীক্ষা করা যায়, কারণ সেখানে কোনও document বা window অবজেক্ট উপলব্ধ নেই।
অন্যদিকে, আপনি যদি একটি ব্রাউজারের ভিতরে আপনার পরীক্ষা চালান, বিল্ট-ইন API যা আপনি এই রানটাইমগুলি থেকে আশা করতে পারেন তা পলিফিলিং বা কিছু অতিরিক্ত কাজ ছাড়া উপলব্ধ নাও হতে পারে। একটি সাধারণ গোটচা হল ফাইল পড়া এবং লেখার মতো কিছু: import { fs } from 'node:'fs'; একটি ব্রাউজারের ভিতরে এবং একটি পরীক্ষার অংশ হিসাবে এইভাবে একটি ফাইল পড়ুন।
এই "ওয়েব" বনাম "ব্যাকএন্ড" এপিআই সমস্যাটি শুধুমাত্র পরীক্ষার সুযোগের বাইরে, কারণ সার্ভার এবং ক্লায়েন্ট উভয় অংশের সাথে একটি কোডবেস থাকা বিশ্রী হতে পারে, তবে এটি পরীক্ষাযোগ্য কোড লেখার ধারণার সাথে যুক্ত, যা আমরা' এই কোর্স জুড়ে পুনরায় দেখা হবে.
অ্যালগরিদমিক বা ব্যবসায়িক যুক্তি পরীক্ষা করুন
আপনার কিছু কোড অপারেট করার জন্য নোড বা ব্রাউজার আমদানির প্রয়োজন হবে না, এবং সেইজন্য পরীক্ষা করার জন্য। এটি এমন একটি বিষয় যা আমরা এই কোর্সে পরে স্পর্শ করব, তবে আপনার কোডবেসকে এমনভাবে গঠন করা যাতে এটির বিশুদ্ধ " ব্যবসায়িক যুক্তি " রেন্ডারিং বা নোড-নির্দিষ্ট কোড থেকে আলাদা হয় এটি পরীক্ষা করা সহজ করে তুলতে পারে।
একটি দ্রুত উদাহরণের জন্য, আপনার একটি নোড ফাংশন থাকতে পারে যা ডিস্ক থেকে একটি ফাইল পড়ে এবং লেখে, প্রক্রিয়ায় এটি পরিবর্তন করে। ডিস্ক থেকে রিড এবং রাইট করার ফাংশনগুলিকে গ্রহণ করার জন্য আপনার ফাংশনকে রিফ্যাক্টর করে, আপনি এটিকে যেকোনো জায়গায় পরীক্ষাযোগ্য করে তুলেছেন।
এই ক্ষেত্রে, আপনি সার্ভার-সাইড রানটাইম বা ব্রাউজারে এই কোডটি পরীক্ষা করার জন্য যেকোনো পরিবেশ ব্যবহার করতে পারেন। আপনার পরীক্ষায়, আপনি সাহায্যকারী প্রদান করতে পারেন যা মেমরিতে একটি ভার্চুয়াল ফাইল সংরক্ষণ করে বা স্থানধারক ডেটা ফেরত দেয়। এই ধরনের সাহায্যকারী একটি পরীক্ষায় প্রবর্তন করা ভাল, কারণ এটি পরীক্ষা করা গুরুত্বপূর্ণ নয় , উদাহরণস্বরূপ, যে fs.writeFileSync কাজ করে। আপনার কোডের উপর ফোকাস করুন এবং এটিকে কী অনন্য বা ঝুঁকিপূর্ণ করে তোলে।
ব্রাউজার APIs অনুকরণ করুন
অনেক টেস্টিং ফ্রেমওয়ার্ক, যেমন Vitest, আপনাকে ব্রাউজার না চালিয়ে ব্রাউজারের API এনভায়রনমেন্ট অনুকরণ করার একটি বিকল্পের সাথে উপস্থাপন করে। Vitest অভ্যন্তরীণভাবে JSDOM নামে একটি লাইব্রেরি ব্যবহার করে। সাধারণ কম্পোনেন্ট পরীক্ষার জন্য এটি একটি ভাল পছন্দ হতে পারে যেখানে ব্রাউজার ব্যবহার করার ওভারহেড বেশি।
যেকোন ইমুলেশন লাইব্রেরির একটি সাধারণ বৈশিষ্ট্য হল, যদিও তারা একটি ব্রাউজারকে অনুকরণ করতে পারে-উদাহরণস্বরূপ, DOM, উপাদান এবং কুকিজ-এগুলির একটি ভিজ্যুয়াল উপাদান নেই। এর মানে হল তারা HTML উপাদান এবং অন্যান্য আদিম জিনিসগুলির সাথে কাজ করার একটি অপরিহার্য উপায় প্রদান করবে, কিন্তু আপনি একটি চিত্র বা একটি স্ক্রিনে আউটপুট রেন্ডার করতে পারবেন না বা পৃষ্ঠায় পিক্সেলে একটি উপাদানের অবস্থান পরীক্ষা করতে পারবেন না।
আবার, এই পছন্দটি উপাদান পরীক্ষার জন্য উপযুক্ত হতে পারে, যেখানে একটি উপাদান একটি প্রতিক্রিয়া উপাদান, বা একটি ওয়েব উপাদান, বা আরও অনেক কিছুকে উপস্থাপন করে। এই ধরনের উপাদানগুলি সাধারণত তুলনামূলকভাবে ছোট উপায়ে DOM তৈরি করে এবং তার সাথে ইন্টারঅ্যাক্ট করে এবং একটি অনুকরণ করা ব্রাউজার আপনার ইচ্ছামত উপাদানটি কাজ করে তা নিশ্চিত করার জন্য যথেষ্ট কার্যকারিতা প্রদান করতে পারে। একটি আসন্ন বিভাগে Vitest এবং JSDOM-এর সাথে প্রতিক্রিয়া উপাদান পরীক্ষার একটি উদাহরণ রয়েছে।
একটি ব্রাউজার অনুকরণ করা একটি সু-প্রতিষ্ঠিত অনুশীলন—JSDOM 2014 সালে প্রকাশিত হয়েছিল—কিন্তু এটি একটি বাস্তব ব্রাউজার ব্যবহার করার থেকে সর্বদা আলাদা হবে৷ এই পার্থক্যগুলি স্পষ্ট হতে পারে: উদাহরণস্বরূপ, JSDOM একটি লেআউট ইঞ্জিন অন্তর্ভুক্ত করে না, তাই একটি উপাদানের আকার পরীক্ষা করার বা সোয়াইপের মতো জটিল অঙ্গভঙ্গি পরীক্ষা করার কোন উপায় নেই। পার্থক্যগুলিও সূক্ষ্ম এবং অজানা হতে পারে, এই কারণেই আপনার JSDOM-ভিত্তিক পরীক্ষাগুলিকে সংক্ষিপ্ত রাখা ভাল, যাতে আপনি কোনও আচরণ আসল জিনিস থেকে বিচ্যুত হওয়ার ঝুঁকিকে 'টাইমবক্স' করতে পারেন।
একটি বাস্তব ব্রাউজার নিয়ন্ত্রণ
আপনার কোডটি পরীক্ষা করার জন্য যেমন আপনার ব্যবহারকারীরা এটি অনুভব করবেন, একটি বাস্তব ব্রাউজার ব্যবহার করা হল সেরা পছন্দ৷ অনুশীলনে, ব্রাউজার সমর্থন করে এমন রানটাইম টেস্টিং একটি বাস্তব ব্রাউজারের দৃষ্টান্ত শুরু এবং নিয়ন্ত্রণ করবে, এমনকি যদি তারা Node.js-এর ভিতরে 'স্টার্ট' চালায়।
একটি পরীক্ষার অংশ হিসাবে একটি ব্রাউজার নিয়ন্ত্রণ করার অর্থ হল এটি ব্যবহারকারীর জন্য যেমন খুলবে ঠিক তেমনই খুলবে, আপনার পরীক্ষাকে URL, কাস্টম HTML এবং JS, বা আপনার পরীক্ষা সম্পাদনের জন্য যা যা প্রয়োজন তা লোড করার মাধ্যমে এটি নিয়ন্ত্রণ করার অনুমতি দেবে৷ তারপরে আপনি ব্যবহারকারী হিসাবে কাজ করার জন্য কোড লিখতে পারেন, যেমন মাউস নিয়ন্ত্রণ করে, বা ইনপুট বাক্সে ইনপুট টাইপ করে।
WebdriverIO বা Web Test Runner- এর মতো আধুনিক সরঞ্জামগুলি সমস্ত প্রধান ব্রাউজার নিয়ন্ত্রণ করতে পারে, এবং এমনকি একই সময়ে একাধিক দৃষ্টান্ত চালাতে পারে। এই ব্রাউজারগুলি পরীক্ষার রানার (উদাহরণস্বরূপ, আপনার নিজের কম্পিউটারে, বা একটি CI অ্যাকশনের অংশ হিসাবে) সংলগ্ন চলতে পারে, বা বাইরের বাণিজ্যিক পরিষেবাগুলিতে আউটসোর্স করা যেতে পারে যা আপনার জন্য সেগুলি চালাবে৷
আরও প্রতিষ্ঠিত টেস্টিং লাইব্রেরি (ভিটেস্ট এবং জেস্ট সহ) প্রায়শই একটি ব্রাউজার মোড থাকে, কিন্তু যেহেতু তাদের উত্স Node.js থেকে, তাদের ব্রাউজার মোডগুলি প্রায়শই "বোল্ট অন" থাকে এবং দরকারী বৈশিষ্ট্যগুলি অনুপস্থিত থাকে। উদাহরণস্বরূপ, Vitest ব্রাউজারে মডিউল আমদানিকে উপহাস করতে পারে না, যা একটি শক্তিশালী আদিম যা আমরা পরবর্তী পৃষ্ঠায় উদাহরণে ব্যবহার করি।
প্রস্তুতিতে
আপনার পরীক্ষার জটিলতা বাড়ার সাথে সাথে একটি বাস্তব ব্রাউজার ব্যবহার করা আরও বেশি গুরুত্বপূর্ণ হয়ে ওঠে।
- DOM থেকে কোন বা ন্যূনতম বৈশিষ্ট্য ব্যবহার করে এমন পরীক্ষাগুলির জন্য, এমনকি Node.js এবং অনুরূপ রানটাইমে উপলব্ধ বৈশিষ্ট্য যেমন
fetchবাEventTarget, পরিবেশ কোন ব্যাপার নয়৷ - ছোট উপাদান পরীক্ষার জন্য, JSDOM উপযুক্ত হতে পারে।
- বৃহত্তর পরীক্ষা-উদাহরণস্বরূপ, এন্ড-টু-এন্ড পরীক্ষা , যা একজন ব্যবহারকারীর লগ ইন করা এবং একটি মূল ক্রিয়া সম্পাদনের অনুকরণ করতে পারে—একটি বাস্তব ব্রাউজারে সম্পূর্ণরূপে চালানোর জন্য বোঝা যায়।
এই বিভাগটি তত্ত্বের উপর ভারী এবং আপনার পরীক্ষাগুলি কোথায় চালাতে হবে সে সম্পর্কে বিভিন্ন দৃষ্টিভঙ্গি উপস্থাপন করে। অনুশীলনে, আপনার কোডবেস প্রায়শই আপনার প্রয়োজনের উপর ভিত্তি করে এবং পরীক্ষার সরঞ্জামগুলি কী প্রদান করে তার উপর ভিত্তি করে বিভিন্ন ধরণের পরীক্ষার জন্য বিভিন্ন পদ্ধতি ব্যবহার করবে।
আপনার উপলব্ধি পরীক্ষা করুন
এমুলেশন লেয়ার jsdom *not* সমর্থন করে ব্রাউজারের কোন বৈশিষ্ট্য?
requestAnimationFrame