Nouveaux utilisateurs sur la plate-forme Web en juin

Découvrez quelques-unes des fonctionnalités intéressantes qui ont été intégrées aux navigateurs Web stables et bêta en juin 2024.

Versions stables des navigateurs

En juin 2024, Firefox 127 et Chrome 126 sont devenus stables. Cet article passe en revue les nouvelles fonctionnalités ajoutées à la plate-forme Web.

Méthodes JavaScript Set

Les ensembles constituent une structure de données essentielle dans tout langage de programmation. Vous pouvez désormais utiliser les méthodes intégrées de JavaScript pour effectuer des opérations de définition. Les méthodes d'ensemble suivantes sont désormais disponibles à partir de Firefox 127 et ont été intégrées à Baseline Newly Available:

Navigateurs pris en charge

  • 122
  • 122
  • 127
  • 17

Source

Pour en savoir plus, consultez Les méthodes JavaScript Set font désormais partie de Baseline.

API Async Clipboard

L'API Clipboard est désormais entièrement compatible avec Firefox 127. Firefox prend désormais en charge l'interface ClipboardItem, ainsi que les méthodes read() et write() de l'interface du presse-papiers. Pour en savoir plus sur l'API Clipboard, consultez la section Débloquer l'accès au presse-papiers.

Navigateurs pris en charge

  • 76
  • 79
  • 127
  • 13.1

Source

Interpolation des couleurs dans les dégradés CSS

Les dégradés CSS sont spécifiés pour accepter un <color-interpolation-method>. Cette option est désormais compatible avec Firefox, ce qui rend cette approche interopérable sur tous les principaux moteurs. Par exemple, vous pouvez maintenant spécifier un linear-gradient() à l'aide du système de couleurs HSL et d'une interpolation plus longue.

.longer {
  background: linear-gradient(90deg in hsl longer hue, red, blue);
}

Navigateurs pris en charge

  • 111
  • 111
  • 127
  • 16,2

Transitions d'affichage entre documents

Auparavant, vous deviez modifier l'architecture de votre site Web en SPA pour utiliser l'API View Transitions. Ce n'est plus le cas. À partir de Chrome 126, les transitions d'affichage sont désormais activées par défaut pour les navigations de même origine. Vous pouvez créer une transition de vue entre deux documents d'origine différents.

Pour activer une transition entre documents, les deux extrémités doivent l'activer. Pour ce faire, utilisez la règle at @view-transition et définissez le descripteur de navigation sur auto.

@view-transition {
  navigation: auto;
}

Navigateurs pris en charge

  • 126
  • 126
  • x
  • x

Source

Pour en savoir plus, consultez la documentation sur les transitions entre documents.

Extension trigger-rumble de l'API Gamepad

Chrome 126 étend l'interface GamepadHapticActuator afin d'exposer la fonctionnalité trigger-rumble sur le Web pour les manettes de jeu compatibles. Cette extension permet aux applications Web qui exploitent l'API Gamepad de faire vibrer les déclencheurs des manettes de jeu équipées de cette fonctionnalité.

Versions bêta des navigateurs

Les versions bêta du navigateur vous donnent un aperçu des nouveautés de la prochaine version stable du navigateur. C'est le moment idéal pour tester de nouvelles fonctionnalités, ou suppressions, qui pourraient avoir un impact sur votre site avant qu'elle ne soit lancée publiquement. Les nouvelles versions bêta sont Firefox 128, Chrome 127, Safari 18 et Safari 17.6. Ces versions apportent de nombreuses fonctionnalités intéressantes à la plate-forme. Consultez les notes de version pour en savoir plus. En voici quelques-unes.

Safari 17.6 est une version de correctifs pour des fonctionnalités existantes. Safari 18 propose un certain nombre de nouvelles fonctionnalités intéressantes, y compris les requêtes de conteneur de style, l'API de transition de vues pour les applications monopages et la prise en charge du mot clé safe dans les propriétés Flexbox.

Chrome 127 inclut la propriété CSS font-size-adjust, la possibilité de spécifier du texte alternatif sur le contenu généré en tant que nombre arbitraire d'éléments et la possibilité d'ajouter des informations de chapitres individuels dans MediaMetaData.

Firefox 128 inclut les propriétés et les valeurs CSS, ce qui rend cette fonctionnalité de référence disponible depuis peu. Utilisez @property pour définir un élément type et une valeur de remplacement pour les propriétés personnalisées CSS.