Activer la console de débogage Safari sur l’iPhone et l’iPad

Safari for iOS comprend une console de débogage optionnelle pour aider les développeurs web à traquer et à résoudre les problèmes liés aux pages web sur l’iPhone et l’iPad.

Mieux encore, avec les dernières versions d’iOS, il utilise le même inspecteur Web que Safari sur le bureau, ce qui signifie que si vous connectez l’iPhone ou l’iPad à l’ordinateur, vous pouvez utiliser les outils de débogage de Safari directement avec votre appareil iOS ou iPadOS

Les anciennes versions d’iOS ont également cette capacité et, bien qu’elle ne soit pas aussi complète que les outils de débogage et de développement de Safari, elle reste utile et facile à activer ou à désactiver sur l’iPhone et l’iPad.

Voyons comment activer cette fonctionnalité sur les nouvelles et anciennes versions d’iOS, et découvrons également les différences entre les versions.

Comment activer et utiliser Web Inspector dans Safari pour iPhone et iPad

Sur les versions modernes d’iOS et d’iPadOS, voici comment fonctionne Safari web inspector :

  1. Ouvrez Paramètres> Safari> Avancé puis appuyez sur pour activer « Inspecteur Web »
  2. Connectez l’iPhone ou l’iPad à un Mac, puis allez dans Safari et activez le menu développeur si vous ne l’avez pas fait en allant dans Safari> Préférences> Avancé> Afficher la barre de menu Développer
  3. Descendez la barre de menu « Développer » et trouvez l’iPhone ou l’iPad, puis ouvrez la page web que vous souhaitez déboguer
  4. Safari Web Inspector s’ouvrira et vous permettra de déboguer et d’inspecter les éléments web de l’appareil iOS ou IPadOS directement dans Safari sur Mac

Maintenant que vous naviguez sur l’iPhone ou l’iPad, vous trouverez l’inspecteur du Web dans Safari sur le Mac qui se mettra à jour.

Vous pouvez accéder à la console de débogage via l’onglet Console de l’inspecteur web, et vous pouvez accéder au débogueur via l’onglet Débogueur. Bien entendu, vous pouvez également utiliser les outils habituels de l’inspecteur web pour les éléments, les ressources, le réseau, etc.

Vous pouvez également utiliser une astuce View Source pour iOS et iPadOS pendant vos déplacements, si nécessaire.

Comment activer la console de débogage sur les anciennes versions d’iOS

Si vous avez une ancienne version d’iOS sur un ancien iPhone ou iPad, toute l’expérience de débogage se trouve sur l’appareil et vous n’avez pas la possibilité de le connecter à Safari sur un Mac. Néanmoins, il est toujours très utile, voici comment il fonctionne :

  1. Lancez « Paramètres » et tapez sur « Safari »
  2. Appuyez sur « Avancé »
  3. Faites glisser « Debug Console » sur ON

Une fois activée, tapez sur la console de débogage en haut de n’importe quel écran Safari pour voir les erreurs des pages web.

La liste par défaut affiche toutes les erreurs, mais vous pouvez accéder à des erreurs plus spécifiques de HTML, JavaScript et CSS en appuyant sur chacune d’entre elles.

Un autre outil utile pour les développeurs de sites web mobiles est Firebug Lite pour iOS, qui utilise un bookmarklet javascript pour charger une version plus simple du populaire outil de développement Firebug. Cette fonctionnalité est probablement la plus utile pour les anciennes versions d’iOS également, puisque les nouvelles versions ont de nouvelles capacités.

Utilisez-vous des outils de développement web pour l’iPhone ou l’iPad ? Partagez avec nous vos conseils, astuces, applications ou techniques dans les commentaires ci-dessous.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *