професионалистtracУрок за тестване на Tor: Рамка за инструменти за автоматизация

Защо ни е нужен професионалистtracTor Framework?

JavaСкриптът се използва в почти всички уеб приложения. С нарастването на приложенията, JavaСценарий също се увеличава по размер и сложност. В такъв случай става трудна задача за Тестерите да тестват уеб приложението за различни сценарии.

Понякога е трудно да се заснемат уеб елементите в AngularJS приложенията, използващи JUnit or Selenium WebDriver.

професионалистtractor е NodeJS програма, написана на JavaСкрипт и се изпълнява с Node за идентифициране на уеб елементите в приложенията на AngularJS и също така използва WebDriver за управление на браузъра с потребителски действия.

Добре, добре сега, нека обсъдим какво точно е AngularJS приложение?

AngularJS приложенията са уеб приложения, които използват разширен синтаксис на HTML за изразяване на компоненти на уеб приложения. Използва се главно за динамични уеб приложения. Тези приложения използват по-малко и гъвкав код в сравнение с нормалните уеб приложения.

Защо не можем да намерим Angular JS уеб елементи, използвайки Normal Selenium Уеб драйвер?

Angular JS приложенията имат някои допълнителни HTML атрибути като ng-repeater, ng-controller, ng-model.. и т.н., които не са включени в Selenium локатори. Selenium не е в състояние да идентифицира тези уеб елементи, използвайки Selenium код. Така че, Protracтор на върха на Selenium може да обработва и контролира тези атрибути в уеб приложенията.

Най-добриятtracTor е цялостна платформа за тестване на приложения, базирани на Angular JS. Докато повечето платформи се фокусират върху провеждането на модулни тестове за Angular JS приложения, Pro...tracTor се фокусира върху тестването на действителната функционалност на приложението.

Преди да започнем Protractor, трябва да инсталираме следното:

1. SeleniumМожете да намерите Selenium Стъпките за инсталиране в следните връзки, (https://www.guru99.com/installing-selenium-webdriver.html )
2. Инсталиране на NPM (Node.js) NodeJS, трябва да инсталираме NodeJS, за да инсталираме Protracтор. Можете да намерите тези стъпки за инсталиране на следния линк. ( https://www.guru99.com/download-install-node-js.html )

професионалистtracИнсталация на Tor

Стъпка 1) Отворете командния ред и въведете „npm инсталиране –g pro“tracтор" и натиснете Enter.

Горната команда ще изтегли необходимите файлове и ще инсталира Protractor на клиентската система.

Стъпка 2) Проверете инсталацията и версията с помощта на "професионалистtractor –версия" Ако успее, ще покаже версията, както на екранната снимка по-долу. Ако не, изпълнете стъпка 1 отново.

(Стъпки 3 и 4 не са задължителни, но се препоръчват за по-добра практика)

Стъпка 3) Актуализирайте мениджъра на уеб драйвери. Мениджърът на уеб драйвери се използва за изпълнение на тестове срещу Angular уеб приложението в конкретен браузър. След ProtracСлед като tor е инсталиран, мениджърът на уеб драйвери трябва да бъде актуализиран до най-новата версия. Това може да стане чрез изпълнение на следната команда в командния ред.

webdriver-manager update

Стъпка 4) Стартирайте мениджъра на уеб драйвери. Тази стъпка ще стартира мениджъра на уеб драйвери във фонов режим и ще прослушва всички тестове, които се изпълняват чрез protracTor.

Веднъж професионалистtractor се използва за изпълнение на всеки тест, уеб драйверът автоматично ще се зареди и ще изпълни теста в съответния браузър. За да стартирате мениджъра на уеб драйвери, следната команда трябва да бъде изпълнена от командния ред.

webdriver-manager start

Сега, ако преминете към следното URL (http://localhost:4444/wd/hub/static/resource/hub.html) във вашия браузър, вие всъщност ще видите мениджъра на уеб драйвери, работещ във фонов режим.

Примерно тестване на AngularJS приложение с ProtracTor

професионалистtracTor се нуждае от два файла, за да работи, a спекулация файл и конфигурация файл.

1. файл за конфигуриранеТози файл помага на професионалиститеtractor до мястото, където са поставени тестовите файлове (specs.js) и с които да се общува Selenium сървър (Selenium Адрес). Chrome е браузърът по подразбиране за ProtracTor.

2. Спец файл: Този файл съдържа логиката и локаторите за взаимодействие с приложението.

Стъпка 1) Трябва да влезем https://angularjs.org и въведете текста като „GURU99“ в текстовото поле „Въведете име тук“.

Стъпка 2) В този етап,

1. Въведено е името „Guru99 "
2. В изходния текст „Здравей“ GuruВиждат се 99″.

Стъпка 3) Сега трябва да заснемем текста от уеб страницата след въвеждане на името и трябва да проверим с очаквания текст.

Code:

Трябва да подготвим конфигурационен файл (conf.js) и спецификационен файл (spec.js) както е споменато по-горе.

Логика на spec.js:

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:

1. описвам('Въведете име GURU99', функция() Синтаксисът на описание е от рамката на Jasmine. Тук "опишете" ('Въведете име GURU99') обикновено дефинира компоненти на приложение, което може да бъде клас или функция и т.н. В кодовия пакет наречено „Въведете GURU99“, това е просто низ, а не код.
2. it('трябва да добави име като GURU99', функция()
3. browser.get('https://angularjs.org') Както в Selenium Webdriver browser.get ще отвори нов екземпляр на браузъра със споменатото URL.
4. елемент(by.model('yourName')).sendKeys('GURU99') Тук намираме уеб елемента, използвайки името на модела като “yourName,” което е стойността на “ng-model” на уеб страницата. Вижте екранната снимка по-долу-

5. var guru= element(by.xpath('html/body/div[2]/div[1]/div[2]/div[2]/div/h1')) Тук намираме уеб елемента, използвайки XPath и съхранява стойността му в променлива „гуру“.
6. очаквам(guru.getText()).toEqual('Здравей GURU99!') Накрая проверяваме текста, който сме получили от уеб страницата (използвайки gettext()) с очаквания текст.

Логика на conf.js:

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

Code Обяснение на conf.js

1. seleniumAddress: 'http://localhost:4444/wd/hub' Конфигурационният файл казва на Protracза местоположението на Selenium Адрес за разговор Selenium WebDriver.
2. спецификации: ['spec.js']Този ред казва на Protracза местоположението на тестовите файлове spec.js

Изпълнение на Code

Тук първо ще променим пътя на директорията или ще отидем до папката, където са поставени confi.js и spec.js в нашата система.

Следвайте следната стъпка.

Стъпка 1) Отворете командния ред.

Стъпка 2) Уверете се, че мениджърът на уеб драйвери на selenium работи. За това дайте командата като „webdriver-manager start“ и натиснете Enter.

(Ако драйверът за Selenium Web не работи, не можем да продължим с теста като ProtracTor не може да намери уеб драйвера за обработка на уеб приложението)

Стъпка 3) Отворете нов команден ред и дайте командата като „професионалистtractor conf.js” за да стартирате конфигурационния файл.

Обяснение:

• Here Protractor ще изпълни конфигурационния файл с дадения spec файл в него.
• Можем да видим сървъра на селен да работи на „http://localhost:4444/wd/hub”, който сме дали във файла conf.js.
• Също така, тук можете да видите резултата колко са преминали и неуспехите, както на екранната снимка по-горе.

Добре, проверихме резултата, когато е преминат или според очакванията. Сега нека разгледаме и неуспешния резултат.

Стъпка 1) Отворете и промените, което се очаква да доведе до spec.js до „'Hello change GURU99“ като по-долу.

След промяна в spec.js :

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) Запазете файла spec.js и повторете горните стъпки от „Изпълнение на Code”Раздел

Сега изпълнете горните стъпки.

Резултат:

Можем да видим резултата като неуспешен, посочен с „F“ на екранната снимка с причината като „Очаква се „Здравей GURU99!“ да се равнява на 'Здравей, смени GURU99!'. Освен това показва колко грешки са възникнали при изпълнение на код.

Можем ли да постигнем същото с Selenium уеб драйвер?

Понякога можем да идентифицираме уеб елементите на AngularJS приложения, използвайки XPath или CSS селектор от Selenium уеб драйвер. Но в AngularJS приложенията елементите ще се генерират и променят динамично. Така че ProtracTor е по-добрата практика за работа с AngularJS приложения.

Генерирайте отчети с помощта на Jasmine Reporters

професионалистtracTor поддържа Jasmine Reporters за генериране на тестови отчети. В този раздел ще използваме JunitXMLReporter, за да генерираме автоматично отчети за изпълнение на тестове във XML формат.

Следвайте стъпките по-долу, за да генерирате отчети в XML формат.

Инсталиране на Jasmine Reporter

Има два начина, по които можете да направите това, локално или глобално

1. Отворете командния ред, изпълнете следната команда, за да инсталирате локално

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

Командата по-горе ще инсталира модули за възли на жасмин отчети локално означава от директорията, където изпълняваме командата в командния ред.

2. Отворете командния ред, изпълнете следната команда за глобална инсталация

npm install –g jasmine-reporters@^2.0.0

В този урок ще инсталираме репортерите на jasmine локално.

Стъпка 1) Изпълнете командата.

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

от командния ред, както по-долу.

Стъпка 2) Проверете инсталационните папки в директорията. „Node_modules“ трябва да е наличен, ако е успешно инсталиран, както е показано на снимката по-долу.

Стъпка 3) Добавете следния цветен код към съществуващ файл conf.js

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)
          );
     }
   };

Обяснение на кода:

В кода ние генерираме отчета „JUnitXmlReporter” и задаване на пътя, където да се съхранява отчетът.

Стъпка 4) Отворете командния ред и изпълнете командата заtractor conf.js.

Стъпка 5) Когато изпълните горния код, junitresults.xml ще бъде генериран в споменатия път.

Стъпка 6) Отворете XML и проверете резултата. Съобщението за грешка се показва във файла с резултати като our Тестов случай е неуспешно. Тестовият случай е неуспешен, тъй като очакваният резултат от „spec.js“ не съответства на действителния резултат от уеб страница

Стъпка 7) Използвайте файла junitresult.xml за доказателства или файлове с резултати.

Oбобщение

Въпреки че Selenium може да прави някои от нещата, които професионалиститеtracТор прави, професионалистътtractor е индустриалният стандарт и най-добрата практика за тестване на AngularJS приложения. Професионален.tracTor може също да управлява множество възможности в него и да обработва динамичните промени на уеб елементите, използвайки ng-модел, ng-click.. и т.н.. (Което селенът не може да направи).