Menu

Tutoriel Browserstack: Plateforme de test des applications et des navigateurs (GUIDE)

  • Principal
  • Autre
  • Tutoriel Browserstack: Plateforme de test des applications et des navigateurs (GUIDE)

browserstack tutorial

Essayez Notre Instrument Pour Éliminer Les Problèmes

Apprenez à utiliser l'application mobile Browserstack et la plate-forme de test multi-navigateurs dans ce didacticiel pratique détaillé sur Browserstack:

BrowserStack est la plate-forme de test, pour tester les sites Web et les applications mobiles.

Nous pouvons tester une application Web dans plusieurs navigateurs et applications mobiles sur tous les appareils mobiles sans aucune machine virtuelle, aucun appareil ni émulateur.

Lorsqu'il s'agit d'une application mobile, nous pouvons tester les applications mobiles Android et iOS.

Tutoriel BrowserStack

Ce que vous apprendrez:

Qu'est-ce que BrowserStack?

Browser Stack est un outil de test basé sur le cloud. À l'aide de cet outil, les développeurs et les testeurs peuvent effectuer des tests inter-navigateurs de diverses applications Web et mobiles dans différents navigateurs Web.

Qu'est-ce que le test multi-navigateurs?

Les tests multi-navigateurs sont des tests fonctionnels. Nous effectuons ces tests pour vérifier si l'application fonctionne comme prévu ou non dans différents navigateurs Web pour les différents systèmes d'exploitation. Ici, nous pouvons exécuter les cas de test manuellement ou en faisant de l'automatisation en spécifiant les différents navigateurs dans les scripts d'automatisation.

Lecture suggérée => Guide du débutant pour les tests multi-navigateurs

Pourquoi BrowserStack?

En temps réel, il est difficile de tester une application dans différents navigateurs utilisant plusieurs systèmes d'exploitation, avec des versions différentes.

Il en coûtera cher d'acheter de nombreuses machines informatiques pour installer différents systèmes d'exploitation. Il est encore plus difficile d'acheter tous les appareils mobiles Android et iOS disponibles sur le marché aujourd'hui. Pour cette raison, il n'est pas pratique d'acheter et de configurer tous les appareils.

Ainsi, nous optons pour le BrowserStack pour éviter la complexité de basculer entre les systèmes d'exploitation, les navigateurs et les différentes versions.

En ce qui concerne les tests d'applications mobiles, nous pouvons éviter d'acheter tous les appareils mobiles disponibles aujourd'hui. Browser Stack est très flexible et évolutif. Nous pouvons tester n'importe où et à tout moment avec l'aide de Browser Stack.

Nous pouvons utiliser Browser Stack comme un laboratoire distant et pouvons l'utiliser comme de vrais navigateurs de bureau. Il nous offre des tests unitaires Javascript gratuits et prend en charge 750 configurations. Aucune configuration n'est requise pour l'utilisation de Browser Stack. Nous pouvons l'utiliser directement sur n'importe quelle machine indépendante en utilisant l'URL de Browser Stack et ses identifiants de connexion.

Page d

Historique de BrowserStack

BrowserStack a été fondé par Ritesh Arora et Nakul Aggarwal à Mumbai, en Inde, en 2011. Il compte environ 25 000 utilisateurs payants et 200 000 utilisateurs enregistrés dans 135 pays. Aujourd'hui, de nombreuses entreprises s'appuient sur Browser Stack pour tester des applications Web et mobiles.

Caractéristiques de BrowserStack

  • Test multi-navigateurs avec différents navigateurs sur différents systèmes d'exploitation.
  • Test d'applications natives sur mobile.
  • Test d'applications hybrides.
  • Automatisez les applications Web et mobiles.

Test de l'application Web

#1) Inscrivez-vous avec BrowserStack.

S

#deux) Connectez-vous à votre compte.

Connexion

# 3) Choisissez l'option de test inter-navigateur interactif en direct dans la liste déroulante des produits.

navigateur interactif en direct

# 4 ) Vous verrez la liste des systèmes d'exploitation sur le côté gauche de la page. Nous avons Android, iOS, Windows Phone, Windows 10, Windows 8, Windows XP, Mac et bien plus encore.

Sélectionnez le système d

# 5) Choisissez n'importe quel système d'exploitation dans la liste. Vous pourrez voir une liste de navigateurs avec différentes versions. Nous pouvons voir des navigateurs comme chrome, Mozilla Firefox, IE, opéra, safari, etc. avec différentes versions comme Chrome 75, Chrome 74, Chrome 73, IE 11, IE 10, etc.

Liste de navigateurs avec version

# 6) Choisissez un navigateur particulier de n'importe quelle version. Le navigateur sera ouvert. Saisissez l'URL de l'application. Commencez à tester l'application de la même manière que vous le faites dans les navigateurs système réels.

Entrez l

Utilisation des fonctions des touches de la pile du navigateur lors du test de l'application

Si vous souhaitez choisir un autre navigateur, cliquez sur l'option Changer de navigateur. Cela vous mènera à l'écran du tableau de bord, où vous pourrez choisir l'autre navigateur pour le test.

Si vous souhaitez tester l'application sur une résolution différente, puis cliquez sur l'icône de résolution, où une liste de la résolution disponible apparaîtra, vous pouvez sélectionner celle requise et continuer le test.

Une fois que vous avez terminé les tests dans un navigateur particulier, cliquez sur Arrêter la session et cela vous mènera à l'écran du tableau de bord.

Fonction clé - Navigateur de commutateur

Création d'un bogue à partir de BrowserStack

Cliquer sur Signaler une option de bogue . Vous verrez une boîte d'option pour mettre en évidence le problème sur la page. Vous pouvez mettre en évidence le problème en utilisant différentes options telles que le rectangle, le cercle, le crayon, etc.

En plus de cela, vous pouvez voir le mode d'option pour signaler un bogue, comme l'endroit où vous souhaitez signaler un bogue, en utilisant Jira, Trello, GitHub, Slack ou via par e-mail, ou si vous souhaitez télécharger la page de problème , etc. De cette façon, vous pouvez choisir n'importe quelle option dans la liste ci-dessus et continuer à signaler un bogue.

Création de bogue

quel est le meilleur logiciel de base de données

Test de l'application mobile dans les navigateurs mobiles

Choisissez l'option de test inter-navigateur interactif en direct dans la liste déroulante des produits. Vous verrez la liste des systèmes d'exploitation sur le côté gauche de la page. Cliquez sur l'option Android dans cette liste. Vous pouvez voir la liste des appareils Android comme Samsung, Motorola, Google, un plus, etc.

Passez la souris sur l'appareil que vous souhaitez tester et vous pourrez voir les navigateurs comme chrome, Mozilla Firefox, Safari, navigateur UC, etc. Choisissez le navigateur et le navigateur sélectionné s'ouvrira.

Application mobile - Sélectionnez le navigateur

Entrez l'URL de l'application et commencez à tester comment vous le faites dans le navigateur du système réel.

Test de l'application mobile native dans BrowserStack

Inscrivez-vous au compte Browser Stack et connectez-vous avec le compte. Choisir la App Live - Test d'applications natives et hybrides interactives option dans la liste déroulante des produits.

Test de l

Vous y verrez les 3 onglets principaux, c'est-à-dire pour télécharger l'application, la liste des appareils Android et la liste des appareils iOS.

Applications téléchargées

Téléchargement de l'application

Cliquez sur le bouton de téléchargement de l'application et une fenêtre de dialogue système s'ouvrira.

Accédez au dossier de l'application, choisissez l'application que vous souhaitez tester et l'application sera téléchargée avec succès. Vous pourrez voir l'application dans la section des applications téléchargées. Là, nous pouvons télécharger les applications jusqu'à une taille de 500 Mo.

Nous pouvons également télécharger l'application d'autres manières. Choisir la Option de test d'applications natives et hybrides interactives App Live dans la liste déroulante des produits et sélectionnez l'onglet appareil réel Android ou appareil réel iOS.

Choisissez n'importe quel appareil et il s'ouvrira. Cliquez sur le Play Store. Connectez-vous avec le compte et recherchez l'application que vous souhaitez tester. Téléchargez et installez l'application et commencez à tester l'application.

De même, nous pouvons télécharger les applications de bien d'autres façons, par exemple en les synchronisant avec le centre d'applications, en les synchronisant avec hockeyapp, en les installant avec testflight, en installant avec l'App Store ou en installant avec le Play Store.

Suppression de l'application

Cliquez sur l'icône de suppression et vous verrez la case à cocher sur chaque application. Cochez la case et cliquez sur le lien de suppression et cela supprimera automatiquement l'application téléchargée après 60 jours à compter de la date de téléchargement.

Maintenant, observez l'onglet des appareils réels Android, cliquez sur cet onglet et vous verrez la liste des appareils Android comme Samsung, Motorola, Google, un plus, etc. avec différents modèles d'appareils. Vous pouvez voir la version du système d'exploitation et la taille de l'écran dans chaque modèle.

Version du système d

Maintenant, observez l'onglet des appareils réels iOS et cliquez sur cet onglet, vous verrez la liste des appareils iOS comme l'iPhone et l'iPad avec différents modèles d'appareils. Vous pouvez voir la version du système d'exploitation et la taille de l'écran dans chaque modèle.

Appareils réels iOS

Cliquez sur n'importe quel appareil Android ou iOS pour tester. L'appareil particulier sera ouvert et l'application se lancera. Commencez à tester vos performances sur l'appareil réel.

Sélectionnez un appareil iOS

Utilisation des fonctions des touches de la pile du navigateur lors du test des applications natives

Cliquez sur l'option Changer d'appareil si vous souhaitez changer d'appareil. Cliquez sur l'option Arrêter la session une fois que vous avez terminé les tests sur un appareil particulier, et il naviguera vers la page du tableau de bord. Cliquez sur les paramètres pour choisir le délai d'expiration de la session et la taille du moniteur.

Nous pouvons créer le bug en cliquant sur le Signaler une option de bogue , tout comme ce que nous avons discuté dans la section des tests Web ci-dessus. Maintenant, regardez le menu de la trousse d'outils Web, qui propose d'autres options pour faire fonctionner l'appareil de manière faisable et tester l'application.

Clique sur le Option de rotation de l'appareil pour faire pivoter l'appareil horizontalement ou verticalement. Clique sur le installer l'application pour installer la nouvelle application. Clique sur le tuer l'application pour fermer simplement l'application et non l'appareil. Cliquer sur Changer de langue pour changer la langue des tests. Cliquer sur Info appareil pour vérifier les informations complètes sur l'appareil.

Test d

Comparaison des tests de BrowserStack par rapport aux tests de périphériques réels

Test de la pile du navigateur Test d'appareils réels
Économique: Nous pouvons tester l'application sur un seul appareil en commutant les différents appareils et navigateurs. Pas économique: Besoin d'acheter tous les appareils disponibles sur le marché pour les tests.
Très souple: Nous pouvons effectuer des tests multi-navigateurs et des tests d'applications mobiles sur une seule plateforme.Besoin de transporter plusieurs appareils partout où nous allons.
Pas besoin d'acheter la licence du système d'exploitation.Besoin d'acheter une licence OS.
Vite: Pas besoin d'attendre pour charger le système d'exploitation et les navigateurs. Lent: Besoin d'attendre pour charger le système d'exploitation et les navigateurs.
Pas besoin d'utiliser des machines virtuelles.Nous devons utiliser des machines virtuelles.

Automatisez le site Web à l'aide de scripts Selenium

Écrivons les scripts Selenium et faisons des tests d'automatisation dans la pile du navigateur. Téléchargez et installez la dernière version de Java. Téléchargez et installez la dernière version d'Eclipse ou d'un autre IDE.

Nous devons obtenir le nom d'utilisateur et la clé d'accès à partir de la pile du navigateur. Pour l'obtenir, connectez-vous avec les informations d'identification du navigateur, accédez à des produits et cliquez sur Automatiser . Observez le nom d'utilisateur et la clé d'accès sur le côté gauche. Notez le nom d'utilisateur et le mot de passe.

Automatiser à l

Ouvrez l'IDE Eclipse. Créez le projet Java, créez le package, créez le fichier de classe et ajoutez tous les fichiers jar Selenium requis au projet. Écrivez les variables pour le nom d'utilisateur et la clé d'accès. Transmettez l'URL, le nom d'utilisateur et le mot de passe. Utilisez des annotations. Créez la méthode.

Définissez les capacités souhaitées pour afficher les journaux. Nous définissons les capacités souhaitées pour indiquer au pilote Web, de choisir le système d'exploitation, le navigateur et la version du navigateur mentionnés. Créez l'objet pour le pilote Web, obtenez l'URL pour ouvrir le site Web. Écrivez les commandes implicites d'attente pour attendre le lancement de l'application.

Écrivez le code pour tester des commandes telles que, obtenir l'URL, pour vérifier l'URL attendue à l'aide d'assertion et d'autres fonctionnalités telles que, cliquer, naviguer, saisir des données et bien plus encore.

Exécutez le script. Observez l'onglet d'automatisation. Vérifiez le journal de test de toutes les étapes de test et consultez les journaux visuels pour voir les captures d'écran du site Web. Observez les journaux de la console et les journaux réseau pour d'autres informations.

Public class testbrowserstack { Public static String Username =”anand”; Public static String accesskey =”anandaccess”; public static final String URL = 'https://' + username + ':' + accesskey + '@hub-cloud.browserstack.com/wd/hub'; public static void main(String() args) throws Exception { DesiredCapabilities caps = new DesiredCapabilities(); caps.setCapability('browserName', 'iPhone'); caps.setCapability('device', 'iPhone X'); caps.setCapability('realMobile', 'true'); caps.setCapability('os_version', '11'); caps.setCapability('name', 'Bstack-(Java) Sample Test'); WebDriver driver = new RemoteWebDriver(new URL(URL), caps); driver.get('http://www.google.com'); WebElement element = driver.findElement(By.name('q')); element.sendKeys('BrowserStack'); element.submit(); System.out.println(driver.getTitle()); driver.quit(); }

Avantages des tests de BrowserStack

  1. Nous pouvons tester tous les principaux navigateurs à partir d'un seul point de contrôle.
  2. Nous pouvons tester la compatibilité de la version précédente / ancienne des navigateurs.
  3. Il prend en charge les tests manuels et automatisés.
  4. Nous pouvons tester tous les appareils et navigateurs actuellement disponibles sur le marché.
  5. Nous pouvons tester l'application dans différentes résolutions.

Inconvénients des tests de BrowserStack

  1. Le temps de réponse n'est pas aussi bon qu'une machine virtuelle installée localement.
  2. Browser Stack n'est pas open-source.
  3. Certains bogues que nous pouvons trouver sur des appareils réels ne peuvent pas être identifiés.

Conclusion

En utilisant BrowserStack, nous pouvons effectuer des tests complets sans les dépendances de l'installation d'une machine virtuelle. Browser Stack est plus flexible et plus fiable à tester et permet en effet d'économiser du temps et de l'argent.

C'est comme un grand toit pour tous les appareils, systèmes d'exploitation, navigateurs et tous avec des versions différentes. Par conséquent, nous pouvons tester toutes sortes d'applications avec Browser Stack.

Browser Stack peut fonctionner sur plus de 200 navigateurs et plus de 40 appareils mobiles. Il peut exécuter des tests sur un service cloud. Ce n'est pas une plateforme open source. Vous devez payer pour acheter la licence en fonction du plan que vous prenez et du test que vous souhaitez exécuter.

Avez-vous déjà utilisé BrowserStack? Sinon, êtes-vous prêt à l'essayer aujourd'hui?

lecture recommandée

^