Needless UI, yerel öğeler ile Popover API gibi yeni web platformu özellikleri üzerine kuruludur. Aşağıdaki tarayıcıları, belirtilen sürümden itibaren destekler. Daha eski sürümlerde menüler, select’ler ve popover’lar açılmaz.
Desteklenen tarayıcılar
| Tarayıcı | En düşük sürüm | Gerektiren özellik |
|---|---|---|
| Chrome ve Edge, bilgisayarlarda ve Android’de | 120 | CSS maskeleriyle çizilen simgeler ve sağdan sola metin için :dir() |
| Firefox, bilgisayarlarda ve Android’de | 125 | Popover API |
| Mac’te Safari | 17 | Popover API |
| iPhone ve iPad’deki tüm tarayıcılar | iOS 17 | Popover API |
| Samsung Internet tarayıcısı | 25 | Chrome ile aynı |
Opera ve Brave gibi Chromium tabanlı diğer tarayıcılar Chrome’un sürümlerini izler. Angular 22’nin kendisi de Chrome, Edge ve Firefox 119 ile Safari 17 gerektirir. Internet Explorer ve Chromium öncesindeki eski Edge desteklenmez.
Test edilen tarayıcılar
Her değişiklikte tüm bileşenlerin testleri Chrome, Firefox ve Safari motorlarında çalıştırılır. Bir sürüm yayımlanmadan önce de bu dokümantasyonun her sayfası her motorda, hem bilgisayarda hem de dokunmatik bir telefonda denetlenir: sayfa yüklenmeli, tüm menüleri ve açılır pencereleri açılmalı, ekrana sığmalı ve erişilebilirlik denetimlerinden geçmelidir.
| Motor | Sürüm | Test ortamı |
|---|---|---|
| Chromium (Chrome ve Edge’in motoru) | 153 | Bir bilgisayar ve dokunmayla kullanılan bir Android telefon |
| Firefox | 155 | Bir bilgisayar ve telefon boyutunda bir dokunmatik ekran |
| WebKit (Safari’nin motoru) | 26.6 | Bir bilgisayar ve dokunmayla kullanılan bir iPhone |
| iPhone’da Safari | iOS 17.5 ve 18.6 | iPhone simülatörü |
Desteklenen en eski sürüm ile test edilen sürüm arasında kalanlar tek tek test edilmez: bileşenlerin ihtiyaç duyduğu tüm özelliklere sahip oldukları için desteklenirler.
Yeni tarayıcılardaki ekstralar
Bazı ayrıntılar yalnızca yeni tarayıcılarda bulunan özellikleri kullanır. Diğer tarayıcılar bunları atlar ve hiçbir şey bozulmaz:
| Ayrıntı | Tarayıcılar | Diğerlerinde |
|---|---|---|
| Popover’lar, menüler ve diyaloglar animasyonla belirip kaybolur | Chrome ve Edge, Firefox 129, Safari 17.5 | Bir anda belirip kaybolurlar |
Squircle köşeler (corner-shape) | Chrome ve Edge 139 | Yuvarlak köşeler |
| Ekranın herhangi bir yerinden renk seçme | Bilgisayarlarda Chrome ve Edge | Damlalık düğmesi yok |
| Dosya bırakma alanında bütün bir klasörü seçme | Bilgisayarlardaki tarayıcılar | Yalnızca dosyalar |
| Carousel’in otomatik geçiş düğmesindeki halka akıcı biçimde dolar | Chrome ve Edge, Firefox 128, Safari | Halka bir anda dolar |
Telefonlar ve dokunmatik ekranlar
Her bileşen dokunmayla çalışır. Ayırıcı tutamaçları, renk alanı, sütun kenarları ve toast bildirimleri sayfayı kaydırmadan parmağı izler; carousel, tarayıcının kendi kaydırmasıyla parmakla kaydırılır ve planlayıcıdaki bir etkinlik uzun basılarak tutulup taşınabilir. Dokunmatik ekranlarda alanlardaki metin en az 16px boyutunda olur; böylece iPhone’lar bu alanlarda sayfayı yakınlaştırmaz. Android klavyeleri gibi kelimeleri yazılırken birleştiren klavyelerden gelen kelimeler de bütün hâlinde ulaşır.
Dokunmatik ekranlarda üzerine gelme olmadığından hovercard yalnızca sayfada zaten bulunanı tamamlar: içine vazgeçilmez hiçbir şey koymayın. Telefonda sohbetin Return tuşu yeni satır başlatır, gönderme işini ise düğmesi yapar.
Safari’de klavye
Safari’de Tab tuşu varsayılan olarak yalnızca metin alanları ve açılır menüler arasında gezinir. Tüm düğmelere ve bağlantılara ulaşmak için Safari’nin İleri Düzey ayarlarında “Web sayfasındaki her bir öğeyi vurgulamak için Tab’a basın” seçeneğini açın ya da Option-Tab tuşlarına basın. Safari ayrıca tıklanan düğmeye odaklanmaz; bileşenler bunu telafi eder, böylece tıklamadan sonra klavye, diğer tarayıcılarda olduğu gibi kaldığı yerden devam eder.