Growing Trends of Open Source UI Frameworks

Growing Trends of Open Source UI Frameworks

• 1.
  Growing Trends OfOpen Source UI Frameworks
• 2.
  A Quick Introduction •DanielGiordano • MarketingManager,CrossBrowserTesting 1 UI Testing Frameworks
• 3.
  Today’s Agenda • WhatDoWeMeanByAutomationFrameworks •DifferentTypesOfFrameworks • SelectingTheRightFramework • PopularBrowserTestingFrameworks • NightWatchDemo UI Testing Frameworks
• 4.
  Page Proprietary & ConfidentialUITesting Frameworks Test Frameworks In SDLC Requirements Tests Defects What We Expect Configuration & Test Definition Sets Environments Actual Test Results
• 5.
  What is aTest Automation Framework? UI Testing Frameworks
• 6.
  Page Proprietary & ConfidentialUITesting Frameworks What is a Test Automation Framework? It’sasetofrules,tools,andspecificationsthatprovidesupportandeaseoftestingforaparticularproductorapplication. Many times a test framework is responsible for: Definingandassertingexpectations Drivingthetestinteractiontheapplication Executingthetest Reportingontests
• 7.
  Page Proprietary & ConfidentialUITesting Frameworks A Framework Is Not A “Shortcut” Yes it is. “If what we test is changing, our assertions should change.” “If the HTML changes, our Page Objects should change.” “If our environments need to change, then our driver .config file needs to change.
• 8.
  Don’t confuse “Types”of testing with “Tools” of testing. UI Testing Frameworks
• 9.
  Page Proprietary & ConfidentialUITesting Frameworks Adding Up An Automation Framework Assertions Assertionshelpusmakesuretests returnexpectedresults. // Chai expect expect(foo).to.be.a('string') expect(foo).to.equal('bar') Test Runners Controlsandinteractswithbrowsers toexecuteframework .url('http://www.github.com') .waitForElementVisible('body', 1000) .setValue('form[action="/search"] input[name="q"]', 'nightwatch') .keys(browser.Keys.ENTER) Test Framework Aframeworkgivesourteststructure andcommonsyntax. describe('#save()', function() { it('should save without error', function(done) }
• 10.
  Page Proprietary & ConfidentialUITesting Frameworks Types Of Automated Testing End to End TestingUnit Testing • Smallpiecesofcodetestingsinglefunctions • Think“noneedforaURLtotest” • Thinklarger interactionsthatmimichumans • Testingseveral”unittests”strungtogether  ”Log In” Button Clicks Or  “2+2=4”  CrossBrowserTesting.com loads  Click “Log In” Button  Fill in Username  Fill in Password  Click “Log In” Button
• 11.
  Page Proprietary & ConfidentialUITesting Frameworks Unit Testing E2EAutomation AssertionsRunner NightWatchJS WebDriver.IO Casper.JS Mocha, Jasmine Should Frameworks Chai Siz e of = Popularity Protractor
• 12.
  Page Proprietary & ConfidentialUITesting Frameworks Why Are JavaScript Frameworks So Popular? Because JavaScript is the language of the web.
• 13.
  Page Proprietary & ConfidentialUITesting Frameworks Downloads of Popular JS Frameworks
• 14.
  Page Proprietary & Confidential Let’sCompare Two UnitTesting Frameworks UI Testing Frameworks Mocha Jasmine Assertion Library Has none out of box. Choose between Chai, should, better-expect, expect.js expect(calculator.add(1, 4)).to.equal(5); Comes out of the box. expect(calculator.add(1, 4)).toEqual(5); Spies Has none out of box. Uses Sinon Comes out of the box. Asynch Testing Does it really well Does it really well in 2.X BDD/TDD Yes, both. Yes, both. Community Really active community since it’s the hot stock on the street. Older, more mature documentation and community base
• 15.
  Page Proprietary & ConfidentialUITesting Frameworks Let’s Compare Three E2E Testing Nightwatch Protractor WebDriver.IO Specialty Easy, out of the box set up Angular testing Customization Architecture Custom implementation of W3C webdriver JSON wire protocol Selenium Wrapper Custom implementation of W3C webdriver JSON wire protocol Assertion Library Mocha, Its Own Chai, Jasmine, Mocha Chai, Jasmine, Mocha Parallel Testing Yes Yes Yes POM Support Yes Yes Yes
• 16.
  Page Proprietary & ConfidentialUITesting Frameworks Critera For Selection  End to End Capabilities  Assertions  BDD/TDD Friendly  Tool Documentation  Visual Testing  CI Integrations  Dev Language  App Language  CloudSupport Community Size Style Fit Technical Fit
• 17.
  Why Run YourTests In The Cloud Using CrossBrowserTesting? UI Testing Frameworks
• 18.
  Page Proprietary & ConfidentialUITesting Frameworks Running In The Cloud CrossBrowserTesting’s Device Cloud SeleniumorAppiumscriptsgetcreated andexecutedasnormal,withonlyafew changestothecode. Seleniumsendscommandstoour browsersandmobiledevicesandwesend thetestresultsbacktotheuser.
• 19.
  Page Proprietary & Confidential 19 SeleniumTraining Test Coverage Speed No Hassle Cost
• 20.
  Page Proprietary & Confidential TestCoverage 20 Selenium Training • AllMajor Operating Systems • Windows XP, 7, 8, 10 • Mac 10.3-10.7 • Ubuntu • 1500+ DesktopBrowsers • Chrome, Firefox, Safari, Edge, IE 6-11 • RealAndroid & iOS • iPhone 5, 5 Plus, 6, 6 Plus,7 • iPadPro, Mini, Air2 • Nexus6, 6p, 7, 9 • GalaxyS5, S6, S7
• 21.
  Page Proprietary & Confidential Speed SeleniumTraining Test 2Test 2Test 2 Test 3 Test 3 Test 3 When we run automated tests sequentially we are limited in how many we can execute in a short period of time. Test 1Test 1 Test 1 Test 1 Test 1 Test 1 Test 2 Test 2 Test 2 Test 3 Test 3 Test 3 With parallel test execution we can test many cases and browsers at once. 21
• 22.
  Page Proprietary & Confidential HassleFree 22 Selenium Training
• 23.
  Page Proprietary & Confidential Cost 23 Thatis twentythousand dollars worth of hardwarein one time.These phones have atwo yearlife-cycle. CrossBrowserTesting Introduction
• 24.
  What Does ItLook Like? UI Testing Frameworks
• 25.
  Page Proprietary & ConfidentialUITesting Frameworks
• 26.
  Page Proprietary & ConfidentialUITesting Frameworks
• 27.
  Page Proprietary & ConfidentialUITesting Frameworks Test Automation Frameworks In SDLC Requirements Tests Defects What We Expect Configuration & Test Definition Sets Environments Actual Test Results Assertions Test Results Style Cloud Frameworks
• 28.
  Github.com/crossbrowsertesting Allofourexamplesandtutorials. UI Testing Frameworks
• 29.
  Questions? UI Testing Frameworks
• 30.
  Thank you! Subtitle