Needless UI s’appuie sur des éléments natifs et sur des fonctionnalités récentes de la plateforme web, comme l’API Popover. Les navigateurs ci-dessous sont pris en charge à partir de la version indiquée. Dans les versions plus anciennes, les menus, les selects et les popovers ne s’ouvrent pas.
Navigateurs pris en charge
| Navigateur | Version minimale | Nécessaire pour |
|---|---|---|
| Chrome et Edge, sur ordinateur et Android | 120 | Les icônes dessinées avec des masques CSS et :dir() pour le texte de droite à gauche |
| Firefox, sur ordinateur et Android | 125 | L’API Popover |
| Safari sur Mac | 17 | L’API Popover |
| Tous les navigateurs sur iPhone et iPad | iOS 17 | L’API Popover |
| Samsung Internet sur Android | 25 | Comme pour Chrome |
Les autres navigateurs basés sur Chromium, comme Opera et Brave, suivent les versions de Chrome. Angular 22 exige lui-même Chrome, Edge et Firefox 119, ainsi que Safari 17. Internet Explorer et l’ancien Edge, antérieur à Chromium, ne sont pas pris en charge.
Navigateurs testés
À chaque modification, les tests de tous les composants s’exécutent dans les moteurs de Chrome, Firefox et Safari. Avant chaque publication, toutes les pages de cette documentation sont vérifiées dans chaque moteur, sur un ordinateur et sur un téléphone en mode tactile : chacune doit se charger, ouvrir chaque menu et chaque pop-up, tenir dans l’écran et réussir les contrôles d’accessibilité.
| Moteur | Version | Testé sur |
|---|---|---|
| Chromium (dans Chrome et Edge) | 153 | Un ordinateur et un téléphone Android en mode tactile |
| Firefox | 155 | Un ordinateur et un écran tactile de la taille d’un téléphone |
| WebKit (dans Safari) | 26.6 | Un ordinateur et un iPhone en mode tactile |
| Safari sur iPhone | iOS 17.5 et 18.6 | Le simulateur d’iPhone |
Les versions intermédiaires, entre la plus ancienne prise en charge et celles qui sont testées, ne sont pas vérifiées une à une : elles sont prises en charge parce qu’elles ont toutes les fonctionnalités dont les composants ont besoin.
Les extras des navigateurs récents
Quelques détails utilisent des fonctionnalités que seuls les navigateurs récents proposent. Les autres navigateurs s’en passent, sans que rien ne casse :
| Détail | Navigateurs | Ailleurs |
|---|---|---|
| Les popovers, menus et boîtes de dialogue s’animent à l’ouverture et à la fermeture | Chrome et Edge, Firefox 129, Safari 17.5 | Ils apparaissent et disparaissent instantanément |
Coins en squircle (corner-shape) | Chrome et Edge 139 | Coins arrondis |
| Prélever une couleur n’importe où sur l’écran | Chrome et Edge sur ordinateur | Pas de bouton pipette |
| Choisir un dossier entier dans la zone de dépôt | Navigateurs sur ordinateur | Fichiers uniquement |
| L’anneau du contrôle de rotation du carrousel se remplit en douceur | Chrome et Edge, Firefox 128, Safari | Il se remplit d’un coup |
Téléphones et écrans tactiles
Tous les composants fonctionnent en tactile. Les poignées du splitter, la zone de couleur, les bords de colonne et les toasts suivent le doigt sans faire défiler la page, le carrousel suit le balayage grâce au défilement natif du navigateur, et un appui long saisit un événement du planificateur. Sur les écrans tactiles, le texte des champs fait au moins 16 px, pour que les iPhone ne zooment pas dessus, et les mots que certains claviers composent, comme ceux d’Android, arrivent entiers.
Les écrans tactiles ne connaissent pas le survol, donc une hovercard ne fait que compléter le contenu de la page : n’y mettez rien d’essentiel. Sur un téléphone, la touche Entrée du chat passe à la ligne, et c’est le bouton qui envoie.
Le clavier dans Safari
Par défaut, dans Safari, la touche Tab ne passe que d’un champ de texte ou d’un menu déroulant à l’autre. Pour atteindre chaque bouton et chaque lien, activez « Appuyer sur Tab pour mettre en évidence chaque élément d’une page web » (« Press Tab to highlight each item on a webpage ») dans l’onglet Avancées des réglages de Safari, ou appuyez sur Option + Tab. Safari ne donne pas non plus le focus à un bouton quand on clique dessus ; les composants y remédient, pour que la navigation au clavier reprenne après un clic comme dans les autres navigateurs.