Needless UI নেটিভ এলিমেন্ট আর Popover API-এর মতো ওয়েব প্ল্যাটফর্মের সাম্প্রতিক ফিচারের ওপর তৈরি। নিচের ব্রাউজারগুলোকে এটি উল্লেখ করা ভার্সন থেকে সাপোর্ট করে। আরও পুরোনো ভার্সনে মেনু, সিলেক্ট ও পপওভার খোলে না।
সাপোর্ট করা ব্রাউজার
| ব্রাউজার | কোন ভার্সন থেকে | কীসের জন্য দরকার |
|---|---|---|
| কম্পিউটার ও Android-এ Chrome ও Edge | 120 | CSS মাস্ক দিয়ে আঁকা আইকন, আর ডান থেকে বাঁয়ে লেখা টেক্সটের জন্য :dir() |
| কম্পিউটার ও Android-এ Firefox | 125 | Popover API |
| Mac-এ Safari | 17 | Popover API |
| iPhone ও iPad-এ সব ব্রাউজার | iOS 17 | Popover API |
| Samsung Internet ব্রাউজার | 25 | Chrome-এর মতোই |
Chromium-এর ওপর তৈরি অন্য ব্রাউজার, যেমন Opera ও Brave, Chrome-এর ভার্সনই অনুসরণ করে। Angular 22-এর নিজেরই দরকার Chrome, Edge ও Firefox 119 এবং Safari 17। Internet Explorer আর Chromium-এর আগের পুরোনো Edge সাপোর্ট করা হয় না।
টেস্ট করা ব্রাউজার
প্রতিটি পরিবর্তনে প্রতিটি কম্পোনেন্টের টেস্ট চলে Chrome, Firefox ও Safari-র ইঞ্জিনে। প্রতিটি রিলিজের আগে এই ডকুমেন্টেশনের সব পেজ প্রতিটি ইঞ্জিনে, কম্পিউটারে ও টাচসহ ফোনে যাচাই করা হয়: প্রতিটি পেজকে ঠিকমতো লোড হতে হবে, তার সব মেনু ও পপআপ খুলতে হবে, স্ক্রিনে এঁটে যেতে হবে এবং অ্যাক্সেসিবিলিটির যাচাইয়ে উতরে যেতে হবে।
| ইঞ্জিন | ভার্সন | কীসে টেস্ট করা হয় |
|---|---|---|
| Chromium (Chrome ও Edge-এ) | 153 | কম্পিউটার, আর টাচসহ Android ফোন |
| Firefox | 155 | কম্পিউটার, আর ফোনের মাপের টাচ স্ক্রিন |
| WebKit (Safari-তে) | 26.6 | কম্পিউটার, আর টাচসহ iPhone |
| iPhone-এ Safari | iOS 17.5 ও 18.6 | iPhone সিমুলেটর |
সাপোর্ট করা সবচেয়ে পুরোনো ভার্সন আর টেস্ট করা ভার্সনের মাঝের ভার্সনগুলো আলাদা আলাদা করে টেস্ট করা হয় না: কম্পোনেন্টগুলোর দরকারি সব ফিচার সেগুলোতে আছে বলেই সেগুলো সাপোর্ট করা হয়।
নতুন ব্রাউজারে বাড়তি সুবিধা
কয়েকটি খুঁটিনাটি এমন ফিচার ব্যবহার করে, যা শুধু নতুন ব্রাউজারে আছে। অন্য ব্রাউজার সেগুলো বাদ দেয়, আর কিছুই ভাঙে না:
| খুঁটিনাটি | ব্রাউজার | অন্য ব্রাউজারে |
|---|---|---|
| পপওভার, মেনু ও ডায়ালগ অ্যানিমেশনসহ খোলে ও বন্ধ হয় | Chrome ও Edge, Firefox 129, Safari 17.5 | সেগুলো সঙ্গে সঙ্গে দেখা দেয় ও মিলিয়ে যায় |
স্কোয়ার্কল কোণ (corner-shape) | Chrome ও Edge 139 | গোল কোণ |
| স্ক্রিনের যেকোনো জায়গা থেকে রঙ তোলা | কম্পিউটারে Chrome ও Edge | আইড্রপার বাটন থাকে না |
| ড্রপজোনে পুরো একটি ফোল্ডার বেছে নেওয়া | কম্পিউটারের ব্রাউজার | শুধু ফাইল |
| ক্যারোসেলের রোটেশন কন্ট্রোলের বৃত্ত মসৃণভাবে ভরে ওঠে | Chrome ও Edge, Firefox 128, Safari | বৃত্তটি এক লাফে ভরে যায় |
ফোন ও টাচ স্ক্রিন
প্রতিটি কম্পোনেন্ট টাচে কাজ করে। স্প্লিটারের হ্যান্ডেল, কালার এরিয়া, কলামের কিনারা আর টোস্ট পেজ স্ক্রল না করেই আঙুলের সঙ্গে সঙ্গে চলে, ক্যারোসেল ব্রাউজারের নিজস্ব স্ক্রলিং দিয়ে সোয়াইপ হয়, আর কিছুক্ষণ চেপে ধরলে শিডিউলারের ইভেন্ট সরানোর জন্য তুলে নেওয়া যায়। টাচ স্ক্রিনে ফিল্ডের টেক্সট অন্তত 16px হয়, যাতে iPhone সেগুলোতে জুম না করে, আর যেসব কীবোর্ড শব্দ কম্পোজ করে লেখে, যেমন Android কীবোর্ড, সেগুলো থেকে শব্দ পুরোটা একসঙ্গে পৌঁছায়।
টাচ স্ক্রিনে হোভার করা যায় না, তাই হোভারকার্ড পেজে যা আছে তার সঙ্গে শুধু কিছু যোগ করে: জরুরি কিছু এতে রাখবেন না। ফোনে চ্যাটের Return কী নতুন লাইন তৈরি করে, আর পাঠানোর কাজ করে তার বাটন।
Safari-তে কীবোর্ড
ডিফল্টভাবে Safari-তে Tab কী শুধু টেক্সট ফিল্ড আর পপ-আপ মেনুর মধ্যেই চলাচল করে। প্রতিটি বাটন ও লিংকে পৌঁছাতে Safari-র “উন্নত” (Advanced) সেটিংসে “ওয়েবপেজের প্রতিটি আইটেম হাইলাইট করতে Tab চাপুন” (Press Tab to highlight each item on a webpage) চালু করুন, অথবা Option + Tab চাপুন। তা ছাড়া Safari ক্লিক করা বাটনে ফোকাস দেয় না; কম্পোনেন্টগুলো সেই ঘাটতি পূরণ করে, তাই ক্লিকের পরেও কীবোর্ড অন্য ব্রাউজারের মতোই সেখান থেকে এগিয়ে চলে।