Needless UI สร้างบนเอลิเมนต์เนทีฟและฟีเจอร์ใหม่ ๆ ของแพลตฟอร์มเว็บ เช่น Popover API จึงรองรับเบราว์เซอร์ในตารางด้านล่างตั้งแต่เวอร์ชันที่ระบุไว้เป็นต้นไป ในเวอร์ชันที่เก่ากว่านั้น เมนูจะเปิดไม่ขึ้น และ Select กับ Popover ก็เช่นกัน
เบราว์เซอร์ที่รองรับ
| เบราว์เซอร์ | ตั้งแต่เวอร์ชัน | จำเป็นสำหรับ |
|---|---|---|
| Chrome และ Edge บนคอมพิวเตอร์และ Android | 120 | ไอคอนที่วาดด้วย CSS mask และ :dir() สำหรับข้อความที่เขียนจากขวาไปซ้าย |
| Firefox บนคอมพิวเตอร์และ Android | 125 | Popover API |
| Safari บน Mac | 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 และ Edge รุ่นเก่าก่อนเปลี่ยนมาใช้ Chromium
เบราว์เซอร์ที่ทดสอบ
ทุกการเปลี่ยนแปลงจะรันการทดสอบของทุกคอมโพเนนต์บนเอนจินของ Chrome Firefox และ Safari ก่อนออกเวอร์ชันใหม่แต่ละครั้ง ทุกหน้าของเอกสารนี้จะถูกตรวจบนทุกเอนจิน ทั้งบนคอมพิวเตอร์และบนโทรศัพท์ที่ใช้งานด้วยการสัมผัส โดยแต่ละหน้าต้องเริ่มทำงานได้ เปิดเมนูและป๊อปอัปได้ทุกอัน แสดงพอดีกับหน้าจอ และผ่านการตรวจสอบการเข้าถึง
| เอนจิน | เวอร์ชัน | ทดสอบบน |
|---|---|---|
| Chromium (ใช้ใน Chrome และ Edge) | 153 | คอมพิวเตอร์ และโทรศัพท์ Android ที่ใช้งานด้วยการสัมผัส |
| Firefox | 155 | คอมพิวเตอร์ และหน้าจอสัมผัสขนาดเท่าโทรศัพท์ |
| WebKit (ใช้ใน Safari) | 26.6 | คอมพิวเตอร์ และ iPhone ที่ใช้งานด้วยการสัมผัส |
| Safari บน iPhone | iOS 17.5 และ 18.6 | เครื่องจำลอง iPhone |
เวอร์ชันที่อยู่ระหว่างเวอร์ชันเก่าที่สุดที่รองรับกับเวอร์ชันที่ทดสอบ ไม่ได้ทดสอบทีละเวอร์ชัน แต่รองรับเพราะมีฟีเจอร์ครบทุกอย่างที่คอมโพเนนต์ต้องใช้
ความสามารถเสริมในเบราว์เซอร์รุ่นใหม่
รายละเอียดบางอย่างใช้ฟีเจอร์ที่มีเฉพาะในเบราว์เซอร์รุ่นใหม่ เบราว์เซอร์อื่นจะข้ามรายละเอียดเหล่านี้ไป โดยไม่มีอะไรเสียหาย:
| รายละเอียด | เบราว์เซอร์ | ในเบราว์เซอร์อื่น |
|---|---|---|
| Popover เมนู และไดอะล็อกเคลื่อนไหวขณะเปิดและปิด | Chrome, Edge, Firefox 129 และ Safari 17.5 | ปรากฏและหายไปทันที |
มุมแบบ squircle (corner-shape) | Chrome และ Edge 139 | มุมโค้ง |
| ดูดสีจากตรงไหนก็ได้บนหน้าจอ | Chrome และ Edge บนคอมพิวเตอร์ | ไม่มีปุ่มที่ดูดสี |
| เลือกทั้งโฟลเดอร์ใน Dropzone | เบราว์เซอร์บนคอมพิวเตอร์ | เลือกได้เฉพาะไฟล์ |
| วงแหวนบนปุ่มควบคุมการเล่นอัตโนมัติของ Carousel ค่อย ๆ เต็มอย่างลื่นไหล | Chrome, Edge, Firefox 128 และ Safari | เต็มทันทีในครั้งเดียว |
โทรศัพท์และหน้าจอสัมผัส
ทุกคอมโพเนนต์ใช้งานด้วยการสัมผัสได้ ที่จับของ Splitter พื้นที่สีของตัวเลือกสี ขอบคอลัมน์ของตารางข้อมูล และ Toast จะเลื่อนตามนิ้วโดยไม่ทำให้หน้าเว็บเลื่อนไปด้วย Carousel ปัดได้ด้วยการเลื่อนของเบราว์เซอร์เอง และการกดค้างจะหยิบกิจกรรมใน Scheduler ขึ้นมาลากได้ บนหน้าจอสัมผัส ข้อความในช่องกรอกมีขนาดอย่างน้อย 16px iPhone จึงไม่ซูมเข้าไปที่ช่องกรอก ส่วนคีย์บอร์ดที่ประกอบคำก่อนส่งเข้ามา อย่างคีย์บอร์ดของ Android ก็ส่งคำเข้ามาได้ครบทั้งคำ
บนหน้าจอสัมผัสไม่มีการชี้เมาส์ค้างไว้ Hovercard จึงเป็นเพียงส่วนเสริมของสิ่งที่อยู่บนหน้าเว็บ อย่าใส่สิ่งที่จำเป็นไว้ใน Hovercard ส่วนในแชทบนโทรศัพท์ ปุ่ม Return จะขึ้นบรรทัดใหม่ และต้องกดปุ่มส่งเพื่อส่งข้อความ
คีย์บอร์ดใน Safari
โดยค่าเริ่มต้น ปุ่ม Tab ใน Safari จะย้ายไปมาได้เฉพาะระหว่างช่องข้อความกับเมนูป๊อปอัป หากต้องการไปให้ถึงทุกปุ่มและทุกลิงก์ ให้เปิด “กดปุ่ม Tab เพื่อไฮไลท์แต่ละรายการบนหน้าเว็บ” (Press Tab to highlight each item on a webpage) ในการตั้งค่าขั้นสูงของ Safari หรือกด Option + Tab นอกจากนี้ Safari ยังไม่ย้ายโฟกัสไปที่ปุ่มที่ถูกคลิก คอมโพเนนต์ชดเชยส่วนนี้ให้แล้ว คีย์บอร์ดจึงใช้ต่อได้หลังการคลิกเหมือนในเบราว์เซอร์อื่น