başınatracTor Test Eğitimi: Otomasyon Aracı Çerçevesi

⚠️ Kullanımdan kaldırılma bildirimi: başınatracTor'dur. kullanımdan kaldırılmış ve arşivlenmişDestek Ağustos 2023'te sona erdi ve Angular CLI, Pro sürümünü kaldırdı.tracAngular 15'ten sonra Tor oluşturucu. Seçin Oyun yazarı, CypressYeni bir araç için WebdriverIO veya TestCafe kullanabilirsiniz. uçtan uca testAşağıdaki kılavuz, eski süitler için de geçerlidir.

Neden Profesyonellere İhtiyacımız Var?tracTor Framework mü?

JavaHemen hemen tüm web uygulamalarında komut dosyası kullanılır. Uygulamalar büyüdükçe, JavaSenaryo Ayrıca boyut ve karmaşıklık açısından da artar. Bu durumda, test uzmanlarının web uygulamasını çeşitli senaryolar için test etmesi zor bir görev haline gelir.

Bazen AngularJS uygulamalarındaki web öğelerini AngularJS kullanarak yakalamak zordur. JUnit or Selenium WebDriver.

başınatracTor, Node.js ile yazılmış bir programdır. JavaAngularJS uygulamalarında web elemanlarını tanımlamak için Node ile birlikte çalışan bir scripttir ve ayrıca kullanıcı eylemleriyle tarayıcıyı kontrol etmek için WebDriver'ı kullanır.

Peki, AngularJS uygulaması tam olarak nedir?

angularjs AngularJS uygulamaları, web uygulaması bileşenlerini ifade etmek için HTML'nin genişletilmiş sözdizimini kullanan web uygulamalarıdır. Genellikle dinamik web uygulamaları için kullanılırlar. Bu uygulamalar, normal web uygulamalarına kıyasla daha az ve daha esnek kod kullanır. AngularJS 1.x'in 31 Aralık 2021'de uzun vadeli desteğini sonlandırdığını ve bu nedenle bu tür uygulamaların günümüzde eski olduğunu unutmayın.

Neden Normal kullanarak AngularJS web öğelerini bulamıyoruz? Selenium Web Sürücüsü?

AngularJS uygulamalarında, HTML'de yer almayan ng-repeater, ng-controller, ng-model vb. gibi bazı ekstra HTML öznitelikleri bulunur. Selenium yer belirleyiciler. Selenium kullanarak bu web öğelerini tanımlayamıyor Selenium kod. Yani, Profesyoneltractepesindeki tor Selenium Web uygulamalarında bu özellikleri yönetebilir ve kontrol edebilir.

başınatracTor, AngularJS tabanlı uygulamalar için uçtan uca test çerçevesidir. Çoğu çerçeve test yapmaya odaklanırken, Tor daha kapsamlı bir yaklaşım sunar. birim testleri AngularJS uygulamaları için, ProtracTor, bir uygulamanın gerçek işlevselliğini test etmeye odaklanır.

Pro'ya başlamadan öncetracTor için şunları yüklememiz gerekiyor:

1. Selenium: bulabilirsin Selenium kurulum adımları Selenium WebDriver kurulum kılavuzu.
2. NPM (Node.js): Pro'yu yüklemek için Node.js'i yüklememiz gerekiyor.tracBu kurulum adımlarını şurada bulabilirsiniz: Node.js indirme ve yükleme kılavuzu.

başınatracTor Kurulumu

) 1 Adım Komut istemini açın ve yazın “npm install -g protractor” ve Enter'a bas.

Yukarıdaki komut gerekli dosyaları indirecek ve Pro'yu kuracaktır.tracAşağıda gösterildiği gibi, istemci sisteminde Tor komutu çalıştırılır.

) 2 Adım Kurulumu ve sürümü kullanarak kontrol edin “profesyoneltractor –sürüm". Başarılı olursa, sürümü aşağıdaki ekran görüntüsündeki gibi gösterecektir. Değilse, 1. adımı tekrar gerçekleştirin.

(3. ve 4. Adımlar İsteğe bağlıdır ancak daha iyi uygulama için önerilir)

) 3 Adım WebDriver yöneticisini güncelleyin. WebDriver yöneticisi, Angular web uygulamasının testlerini belirli bir tarayıcıda çalıştırmak için kullanılır. Pro sürümünden sonra...tracTor yüklü ise, WebDriver yöneticisinin en son sürüme güncellenmesi gerekir. Bu işlem, komut isteminde aşağıdaki komutu çalıştırarak yapılabilir.

webdriver-manager update

Sürücü dosyaları aşağıdaki gibi indirilir.

) 4 Adım WebDriver yöneticisini başlatın. Bu adım, WebDriver yöneticisini arka planda çalıştıracak ve pro üzerinden çalışan tüm testleri dinleyecektir.tracthor.

Bir test çalıştırıldıktan sonra, WebDriver otomatik olarak ilgili tarayıcıda yükler. Yöneticiyi aşağıdaki komutla başlatın.

webdriver-manager start

Konsol, dinleme adresini bildirir.

Şimdi, aşağıdaki adrese giderseniz... URL (http://localhost:4444/wd/hub/static/resource/hub.htmlTarayıcınızda (bu komutu çalıştırdığınızda) WebDriver yöneticisinin arka planda çalıştığını göreceksiniz.

Pro kullanarak örnek AngularJS uygulamasının test edilmesitractor

Sürücü yöneticisi çalışırken, ProtracTor'un çalışması için iki dosyaya ihtiyaç var, bir spec dosya ve yapılandırma dosyası.

1. yapılandırma dosyasıBu dosya profesyonellere yardımcı olur.tracTest dosyalarının bulunduğu yere (specs.js) erişmek ve iletişim kurmak için Tor'u kullanın. Selenium sunucu (Selenium (Adres). Chrome, Pro için varsayılan tarayıcıdır.tracthor.
2. Spesifikasyon dosyası: Bu Dosya, uygulamayla etkileşime geçmek için mantığı ve konum belirleyicileri içerir.

) 1 Adım Açmamız gerekiyor https://angularjs.org ve “Buraya bir isim girin” metin kutusuna “GURU99” metnini girin.

) 2 Adım Bu adımda,

1. "Adını girdim"Guru99 "
2. Çıktı metninde "Merhaba" Guru99 inç görülüyor.

) 3 Adım Şimdi adı girdikten sonra web sayfasındaki metni yakalamamız ve beklenen metinle doğrulamamız gerekiyor.

Kod:

Konfigürasyon dosyasını hazırlamamız gerekiyor (conf.js) ve spesifikasyon dosyası (spec.js) Yukarıda da belirtildiği gibi.

spec.js'nin mantığı:

describe('Enter GURU99 Name', function() {
 it('should add a Name as GURU99', function() {
 browser.get('https://angularjs.org');
 element(by.model('yourName')).sendKeys('GURU99');
  var guru= element(by.xpath('html/body/div[2]/div[1]/div[2]/div[2]/div/h1'));
expect(guru.getText()).toEqual('Hello GURU99!');
  });
});

Code spec.js dosyasının açıklaması:

1. tanımlamak('GURU99 Adını Girin', fonksiyon()Açıklama sözdizimi şuradan alınmıştır: Jasmine çerçevesiBurada "describe" ('GURU99 Adını Girin') ifadesi tipik olarak bir uygulamanın bileşenlerini tanımlar; bu bileşenler bir sınıf veya fonksiyon olabilir. "GURU99 Adını Girin" olarak adlandırılan kod paketinde ise bu sadece bir metin dizisidir, kod değildir.
2. it('GURU99 olarak bir Ad eklenmelidir', function()
3. tarayıcı.get('https://angularjs.org') Şunun gibi Selenium WebDriver `browser.get` komutu, belirtilen tarayıcı örneğiyle yeni bir tarayıcı örneği açacaktır. URL.
4. eleman(by.model('adınız')).SendKey'ler('GURU99') Burada, Model adı olarak "yourName"i kullanarak web öğesini buluyoruz; bu da "ng modeliWeb sayfasındaki " işaretini görebilirsiniz. Aşağıdaki ekran görüntüsüne bakın-

5. var guru= element(by.xpath('html/body/div[2]/div[1]/div[2]/div[2]/div/h1')) Burada web öğesini kullanarak buluyoruz XPath ve değerini bir "guru" değişkeninde saklayın.
6. beklemek(guru.getText()).eşit('Merhaba GURU99!') Son olarak web sayfasından aldığımız metni (gettext() kullanarak) beklenen metinle doğruluyoruz.

conf.js'nin mantığı:

exports.config = {
  seleniumAddress: 'http://localhost:4444/wd/hub',
  specs: ['spec.js']
};

Code conf.js'nin açıklaması

1. seleniumAddress: 'http://localhost:4444/wd/hub' Yapılandırma dosyası Pro'ya şunu söylüyor:trackonumun Selenium Konuşulacak adres Selenium WebDriver.
2. özellikler: ['spec.js']Bu satır Pro'ya bilgi veriyortractest dosyalarının konumu spec.js

Yürütme Code

Öncelikle, conf.js ve spec.js dosyalarının bulunduğu klasöre gidin, ardından aşağıdaki adımları izleyin..

) 1 Adım Komut istemini açın.

) 2 Adım emin olmak Selenium WebDriver yöneticisi çalışır durumda. Bunun için "webdriver-manager start" komutunu verip Enter tuşuna basın..

(Eğer Selenium WebDriver çalışır durumda değil, bu nedenle Pro olarak test işlemine devam edemiyoruz.tracTor, web uygulamasını işlemek için WebDriver'ı bulamıyor.

) 3 Adım Yeni bir komut istemi açın ve komutu şu şekilde verin: “profesyoneltractor conf.js” Yapılandırma dosyasını çalıştırmak için. Çalıştırma aşağıdaki gibi tamamlanır.

Açıklama:

• Here ProtracTor, belirtilen spec dosyasıyla birlikte yapılandırma dosyasını çalıştıracaktır.
• Görebiliyoruz Selenium sunucu şu adreste çalışıyor:http://localhost:4444/wd/hubconf.js dosyasında vermiş olduğumuz.
• Ayrıca, yukarıdaki ekran görüntüsünde olduğu gibi kaç tanesinin geçildiğini ve başarısız olunduğunu burada görebilirsiniz..

Başarılı sonuç doğrulandı. Şimdi de başarısız sonuca bakalım.

) 1 Adım spec.js dosyasını açın ve aşağıdaki gibi "'Hello change GURU99'" şeklinde bir değişiklikle sonuçlanması bekleniyor.

Spec.js'deki değişiklikten sonra :

describe('Enter GURU99 Name', function() {
 it('should add a Name as GURU99', function() {
 browser.get('https://angularjs.org');
 element(by.model('yourName')).sendKeys('GURU99');
  var guru= element(by.xpath('html/body/div[2]/div[1]/div[2]/div[2]/div/h1'));
expect(guru.getText()).toEqual('Hello change GURU99!');
  });
});

) 2 Adım spec.js dosyasını kaydedin ve yukarıdaki "Çalıştırma" adımlarını tekrarlayın. Code" Bölüm

Şimdi yukarıdaki adımları uygulayın.

Sonuç:

Sonucun ekran görüntüsünde 'F' ile gösterilen başarısız olduğunu ve nedeninin şu şekilde olduğunu görebiliriz: “Beklenen 'Merhaba GURU99!' 'Merhaba GURU99'u değiştir!'e eşit olacak. Ayrıca, kod çalıştırılırken kaç hata oluştuğunu da gösterir.

ile aynı şeyi başarabilir miyiz? Selenium Web Sürücüsü?

Bazen AngularJS öğeleri XPath veya CSS seçicileri kullanılarak bulunabilir. Selenium WebDriver. Ancak bu öğeler dinamik olarak oluşturulur ve yeniden bağlanır, bu nedenle ProtracAngularJS paketleri için Tor daha güvenli bir seçenekti.

Jasmine Reporters'ı kullanarak Raporlar Oluşturun

başınatracTor, Jasmine muhabirlerini destekler. Bu bölüm, Tor'un kullandığı yöntemleri kullanır. JUnitAşağıdaki adımları izleyerek XmlReporter ile test yürütme raporlarını otomatik olarak XML formatında oluşturabilirsiniz.

Jasmine Reporter Kurulumu

İki seçenek var: yerel veya küresel.

1. Komut istemini açın ve yerel olarak yüklemek için aşağıdaki komutu çalıştırın

npm install --save-dev jasmine-reporters@^2.0.0

Yukarıdaki komut, jasmine-reporters'ı çalıştırıldığı dizinin içine yerel olarak kurar.

2. Komut istemini açın ve genel kurulum için aşağıdaki komutu yürütün

npm install –g jasmine-reporters@^2.0.0

Burada muhabirler yerel olarak görevlendiriliyor..

) 1 Adım Komutu yürütün.

npm install --save-dev jasmine-reporters@^2.0.0

aşağıdaki gibi komut isteminden.

) 2 Adım Dizindeki kurulum klasörlerini kontrol edin. Aşağıdaki anlık görüntüdeki gibi başarıyla kurulduğunda “Node_modules” mevcut olmalıdır.

) 3 Adım Mevcut bir conf.js dosyasına aşağıdaki renkli kodu ekleyin

exports.config = {
      seleniumAddress: 'http://localhost:4444/wd/hub',
      capabilities: {
          'browserName': 'firefox'
      },
      specs: ['spec.js'],
     framework: 'jasmine2' ,
      onPrepare: function() {
          var jasmineReporters = require('C:/Users/RE041943/Desktop/guru/node_modules/jasmine-reporters');
          jasmine.getEnv().addReporter(new jasmineReporters.JUnitXmlReporter(null, true, true)
          );
     }
   };

Kodun açıklaması:

Kodda “raporu oluşturuyoruz”JUnitXmlReporter” ve Raporun nerede saklanacağını Yol'a vermek.

) 4 Adım Komut istemini açın ve komutu yürütün içintractor conf.js.

) 5 Adım Yukarıdaki kodu çalıştırdığınızda belirtilen yolda junitresults.xml oluşturulacaktır.

) 6 Adım XML'i açın ve sonucu doğrulayın. Başarısızlık mesajı sonuç dosyasında bizim gibi gösterilir. Test Durumu Test başarısız oldu. Test senaryosu, "spec.js" dosyasından beklenen sonuç ile web sayfasından alınan gerçek sonuç eşleşmediği için başarısız oldu.

) 7 Adım Kanıtlar veya sonuç dosyaları için junitresult.xml dosyasını kullanın.

başınatracTOR ve Modern Test Otomasyonu Alternatifleri

Profesyonel olduğundan beritracTor artık güncelleme almadığı için, yeni paketler planlayan ekiplerin, Angular projelerinin artık geçiş yaptığı çerçevelere karşı nasıl bir performans sergilediğini bilmeleri gerekiyor. Aşağıdaki tablo, Pro ile karşılaştırmayı yapıyor.tracAşağıdaki SSS bölümünde en sık karşımıza çıkan üç alternatifi inceleyin.

Mevcut bir Profesyonel üyesi olan takımlartracTor suite genellikle en hızlı hareket eder Web sürücüsüIOkomut stili ve Selenium-Pro'nun temel aldığı sürücü yönetimine yakın kalın.tracTor test uzmanları bunu zaten biliyor. Sıfırdan başlayan veya en hızlı test çalışmalarına ihtiyaç duyan ekipler daha sık bu yöntemi seçiyor. Cypress Ya da oyun yazarı.

SSS