Recommended
Recommended
More Related Content
What's hot
What's hot (20)
Similar to TechTalk: Advanced Practices for Visual Test Automation
Similar to TechTalk: Advanced Practices for Visual Test Automation (20)
More from Lizzy Guido (she/her)
More from Lizzy Guido (she/her) (16)
Recently uploaded
Recently uploaded (20)
TechTalk: Advanced Practices for Visual Test Automation
- 1. Object Spy, Visual Analysis and XML/Xpath Intro and Demo for Partners David Broerman Partner Enablement Manager Email: davidb@perfectomobile.com
- 2. Agenda • Intro to Perfecto • XML and Xpath and Objects • What are XML and Xpath? • Working with XML and Xpath • Object Analysis and the Perfecto Object Spy • What is Visual Analysis • Best Practices with Perfecto • Demo Perfecto Automation • Discuss Object Spy , Visual and Xpath Review a Perfecto Lab Selenium/Appium Project in Eclipse • Discuss Object Spy , Visual and Xpath • Q&A
- 3. Intro to Perfecto Perfecto Offers: A Cloud Based Continuous Quality Lab enabling testing and monitoring of all digital platforms on real devices and real end user conditions, for enterprises adopting agile delivery processes. 3/28/2017 3
- 4. Intro to Perfecto Dominant leader & visionary Strong Ecosystem Perfecto @ a glance Working with Enterprises and Partners to deliver exceptional digital experiences. 4 Setting the bar for market success • Founded in late 2006, Business HQ in Boston • Over 300 employees globally • Fortune 500 customer base 3/28/2017 “Perfecto Mobile marks shift in mobile apps quality with Continuous Quality Lab”
- 5. Cloud Based Quality Platform For The Digital Era 3/28/2017 5© 2017, Perfecto Mobile Ltd. All Rights Reserved. Open & Integrated into Dev/Test/Ops Any test tool Any CI server Any test framework Any IDE Any Location Code/Debug Functional Test Performance Test Production Insight One Lab for all Digital Platforms Reporting & Analytics Wind Tunnel Layer Customer Support Browsers Desktops Mobile Devices IoT
- 6. Open and Integrated 6 Open & Integrated Xcode Selenium 3/28/2017
- 7. What are XML and Xpath? • XML • EXtensible Markup Language • XML enables you to create data that can read by any application on any platform • Native Object analysis relies on XML • The Object Tree is an XML document • Xpath (XML Path Language) • XPath is the query language for XML documents • Describes a way to locate and process items in XML documents • In automation, Xpath allows us to identify the object/objects
- 8. Importance of Understanding XML and XPath 8 • Native Object analysis relies on XML • Retrieves the XML document and analyzes it • However, it this is not enough to identify the object using its location in the object tree. This approach is fragile. • It is necessary to use specific XPath expressions to uniquely identify the object. • This will enable your object to be found across multiple platforms and devices.
- 9. Native Objects Analysis 9 • The Object Tree is an XML document • The way to find elements inside XML is through XPath • To properly work with Objects, a good grasp of XML/XPath is needed.
- 10. The Perfecto Approach for Mobile Objects Native Object Analysis and Visual Object Analysis = HYBRID APPROACH! Best Practice: Use Native Object Analysis for Navigating and Visual/OCR for Validation. Pros Cons
- 11. The Object Spy enables working with objects • The Object Spy accesses the XML of the application • Identifies the element and writes an XPath Expression. • May need to export the XML into Firebug/FirePath. • Inserts the expression back into the Object Spy. • Applies the required action: • Click – click on the element • Set – an edit field with a value • Info – to retrieve an element to receive its properties • Find – find an element
- 12. Website & Apps – Object Trees/Identifying Objects • Web Objects • DOM • Same Tree (PM or Appium Framework) • Native App Objects • PM or Appium framework • Appium -Separate naming for Android and iOS • Perfecto – Script Once • Hybrid Application • PM automation framework • Mix of Native and DOM objects DOM Perfecto Mobile Appium
- 13. Working with the Object Spy Selected Automation Function and Parameter fields Object XPath Object TreePreview Panel Search and Export Filter displayed Objects Object Properties Automation functions associated with the selected object type
- 14. Adding Commands from the Object Spy
- 15. Working with Firebug and FirePath 15
- 16. Object Spy: Object Locator Available – • Object Locator is availabl e for Native, Web and Hybrid apps. • Easily generate accurate XPath identifiers from within the Perfecto Object Spy • Don’t have to export to XML and use tools such as FireBug and FirePath.
- 17. Visual Analysis • Visual analysis is an alternative way of interacting with a device. • Its’ source is the screenshot taken from the device (what the user sees). • Perfecto can analyze the screenshot looking for either text or images, with text being the recommended option. Best Practice: Use Native Object Analysis for Navigating and Visual for Validation.
- 18. Visual - Available Commands • Select - Clicks on the image/text • Find – Finds an image/text for visual relationship • Check – A Checkpoint that validates the text/image appears on the screen • (Sync is same command , Sync has a default timeout of 60 seconds and check does not) • Button – Clicks a Button • Edit - Sets a value inside an input field 3/28/2017 18© 2015, Perfecto Mobile Ltd. All Rights Reserved.
- 19. Example - Coding Visual Analysis – Java • Visual Analysis – Perfecto Proprietary command executed using RemoteWebDriver • Use the executeScript method • The script parameter contains the command name, in the following format: mobile:command :subcommand.3/28/2017 19© 2015, Perfecto Mobile Ltd. All Rights Reserved. Map<String, Object> params3 = new HashMap<>(); // Check for the text that indicates that the sign in was successful params3.put("content", "Welcome back John"); // allow up-to 30 seconds for the page to display params3.put("timeout", "30"); resultString = (String) driver.executeScript("mobile:checkpoint:text", params3); if (!resultString.equalsIgnoreCase("true")) { System.out.println("'Welcome back John' text not found"); }
- 20. Did You Know? • When talking with users of the Perfecto Solution • Approximately 90% of testing defects are found using Visual Validation! • Mobile is different as we want to understand the UX • Need to see what the user sees • An object on the screen may be found, but it may be hidden behind something else (need visual validation).
- 21. XPath Examples
- 22. Example of Power of Xpath with Objects 22 Let's say that we want to work on a username field. Remember: The default path generated by the Object Spy refers to its location; its placement on the page. The placement of that object can change, or be slightly different in another platform (i.e. tablet vs. smartphone). So, it's important to refer to it by its logical function instead of an arbitrary placement on the page. XPath will allow this to be specified: //[@username] This expression explicitly refers to the input field called 'username'. Advantages: It is easy to read. It is likely to work well with minimal maintenance. It is likely to be identical across devices and platforms.
- 23. XPath Expression Syntax 23 Expression Description nodename Selects all nodes with the name "nodename" // Selects nodes in the document from the current node that match the selection no matter where they are //vehicle Selects all vehicle elements no matter where they are in the document //@make Selects all attributes named make //*[@make="Toyota"] Select all attributes named make with value of Toyota //vehicle[@*] Selects all vehicle elements which have any attribute //*[text()=’Corolla’] Select all objects with the text Corolla //vehicle[2] Select the second vehicle element
- 24. Demo • Open Perfecto Automation and also Open existing Perfecto Lab Selenium/Appium Project in Eclipse • Discuss Object Spy , Visual Analysis and Xpath
- 25. Resources • Sample script and Demo Apps • https://community.perfectomobile.com/series/25427/posts/1064930 • Working with Object Spy and XPath • https://community.perfectomobile.com/posts/914140-web-objects • XPath Tutorial • http://www.w3schools.com/XPath/ • XML Tutorial • http://www.w3schools.com/xml/
- 26. Q&A
- 27. Thank You David Broerman Partner Enablement Manager Email: davidb@perfectomobile.com
Editor's Notes
- Hello Everyone – welcome to Perfecto’s tech talk webinar Object Spy, Visual Analysis and XML/Xpath Intro and Demo for Partners. My name is ….
- Before we get started with the Agenda, just a quick housekeeping item…at the end we should have a few mins for questions and answers. There is a panel in the webinar named Q&A to submit questions during the webinar, so if you think of something, please ask. If we are unable to get to finish questions for any reason, then we will send out the info to all attendees. Here’s the agenda…
- The Perfecto CQ (Continuous Quality) Lab platform is a cloud architected quality platform. One lab for all digital platforms, from browsers, desktops to mobile to IoT We have capabilities to mimic the real user environment with our Wind Tunnel Including Location, orientation, network conditions like 3g 4g, and everything you need to reproduce your users environment While providing Quality visibility and trending with our reporting and analytics for fast feedback loops Completely accessible/embeddable in your SDLC process and tools Accessible from coding to customer support To integrated in Any test tool, CI server, test framework, IDE and location
- Perfecto is committed to helping enterprises leverage existing practices, assets and expertise Perfecto Mobile strives integrate with popular tools used by enterprises. Customers can leverage existing assets and expertise . Our support for various tools is constantly expanding. Some customers also take advantage of our published API to create custom extensions to different frameworks.
- So what is XML anyway? XML stands for EXtensible Markup Language It’s formal definition: In computing, Extensible Markup Language (XML) is a markup language that defines a set of rules for encoding documents in a format that is both human-readable and machine-readable. What does that really mean? XML enables you to create data that can read by any application on any platform Native Object analysis relies on XML The Object Tree is an XML document Now describe xpath
- How it works: -Receives Object tree (XML) from App or Website Main Features: -All objects are exposed by Perfecto -Objects can be clicked, set or queried
- When the Object Spy accesses the XML (shows the Object Tree), These are the steps to work with objects, we will now drill down and show you step-by-step
- Identifying objects on the different types of mobile applications can be done in many ways. We will focus on using the following frameworks, according to Perfecto Mobile best practices: the DOM objects for testing web applications Appium framework for testing Native applications, and Perfecto Mobile framework for testing hybrid applications This Framework selection is for what Trees you see (Perfecto or Appium) (Remember, since in these examples we are working on a native application, we will be setting our Automation Framework and Driver to Appium. To do this, go to: More > Settings > Automation Tab > Framework tab) Using the Object Spy and picking an Automation Framework enables us to find, view properties, and perform interactions on the application using objects (such as a clicking on something on the device screen, selecting an image or text element, and setting text in an edit field). (A little more about identifying objects: Application User Interfaces are drawn to the screen based on a definition (that’s provided by the application) of how and where to draw the different UI Elements. The definition is a hierarchy of available UI Elements that can be described as an Object Tree. The Object Tree for Web applications uses a standard set of UI Element types to describe how to draw the User Interface. This is the DOM tree and the UI Elements in that standard can be used to describe any website or web application.) The Perfecto Mobile and Appium Frameworks: In the world of mobile applications, it is not as simple. Apple has its own proprietary set of UI Elements and this is different from the proprietary set used by Android. Perfecto Mobile created a framework that allows us to translate the competing UI Elements of the different application UI sets into a “common” set of UI Elements and describe the UI structure of an application using these generic UI Elements (Script Once). This is the Perfecto Mobile framework Object Tree. Appium, is used to test native apps, references the UI Elements using the names provided by the proprietary description files. This is the Appium framework Object Tree. The Perfecto Mobile framework identifies the objects in the application with the same standard. This means that the object tree representation of the elements will be the same on both iOS and Android applications. The Appium framework uses two different object tree representations – UI Automator for Android and UI Automation for iOS. This means that when we develop our automation test, according to this mode of work, we will need to create two separate tests (one for Android and another for iOS). (For advanced users, the Perfecto Mobile framework supports identification of the objects either with the application classes or based on a translated generic set of classes. This enables using the same objects for both Android and iOS applications, also referred to as ScriptOnce. This will be covered in later modules.) The framework we choose to work with will determine the object tree representation, in XML format, that we see and work with when using the Perfecto Mobile Object Spy. (For beginner users, each object is refined by a set of attributes that define what is actually displayed. For example, the text attribute defines the text to display.)
- The following slide will describe how to use the Object Spy.
- Adding commands to the Automation script Click on the object in the preview panel Replace the default XPath with the one you have created Edit any necessary parameter field values Click Add to add the function to your script Optional: enable Execute on Add in the Object Spy to keep the Object Spy window open for additional functions (refresh the Object Spy preview panel to see the updated device screen) Recap We saw the object spy and did the full loop, starting in the mobile application, using the object spy to export the XML, writing the Xpath expression and then copying it back to the object spy. Once the correct expression was in the Spy, we selected the appropriate command, and with “execute on add” we are ready for the next step in the script. This flow is identical for mobile applications and websites and repeats whenever we want to work with objects.
- Reading the XML document Go to Firefox Browser – make sure you have Firebug installed Open Firebug (top right of the Firefox browser menu bar) Inspect the element you want to work with by clicking on the Firebug inspector and then on the object in the page The object in the page and the location of it in the tree will be highlighted. Also, a default XPath will be automatically provided. Read the XML, understand what makes the element unique and write an XPath that will be able to find it (more on writing XPath expressions later on)
- Example: Android Device B of A Application Sign In Button (Click) Object Locator – provides a more robust xpath instead of just location based
- Analyzing a screenshot is slower and less reliable than object analysis, it exists as an addition to objects which is the main way to work. Its use is limited, but when it is needed it provides an excellent solution. Visual analysis is a Perfecto extension to RWD & Appium, providing a comprehensive solution that enables automating all test cases. The main uses for visual analysis are: In cases where object analysis does not work When there’s a need to validate what the user sees on a certain page
- There are 5 commands available to use with visual analysis. Exactly the same buttons for both Image and Text. All commands can receive a timeout to which is useful e.g. when a new page is loading. Can work with either text or an image with text being the preferred option. Text is easier to use, works seamlessly across multiple devices and requires the least maintenance.
- Since visual analysis is a Perfecto command, we use the executeScript method to run it. The commands require the needle to be provided (in this case the text “welcome back John”) and any additional parameters (in this case we set a timeout of 30 seconds, the system will search for the needle continually for 30 seconds) The returned true/false result can then be handled by the code.
- The following slides contain expressions written for various objects in the PM demo applications. Go through the expressions, emphasizing WHAT the expression is saying in plain English, and WHY it is saying it. [Trainer Notes: download the sample test “MobileObjectsSample.java” here https://community.perfectomobile.com/groups/30292/posts/1046689-sample-script-mobile-objects-sample add it to your project workspace run the test on an iOS and an Android device The next slides describe specific XPath expressions, used in the sample, in more detail.]
- The elements inside an application or website have a logical meaning a “login” button or “my account” link are not just the third or fourth element, they also have a specific purpose inside the application. Identifying these elements according to what they are, and not just according to where they are will result in a script that is much more robust, readable and valid for multiple devices and platforms. For example, the login button will always stay the login button, another element may be added before it changing the where but the what will remain the same.
- XPath allows us to specify: "Give me an element named vehicle that has an attribute with a value Toyota". XPath enables powerful and complex queries quickly and easily. Below is a list of the most common XPath syntax you will need to understand.
- Notes: Let’s review a sample test. Use Eclipse Project Named ??? RemoteWebDriverTest.java – run as java test Credentials in code: To run the sample remember to add your credentials and Lab URL String host = “myLab.perfectomobile.com"; capabilities.setCapability("user", “myUser"); capabilities.setCapability("password", “MyPassword"); Selenium and Perfecto Tree Uses Perfecto demo application – tried to login with username, password and validates message
- Let’s take a few minutes for Q&A. Remember, there is a panel in the webinar named Q&A to submit questions (if you have already done that, great) if not, please take a minute or so now to type out your questions, We’ll go on mute for a minute, and then come back and answer the questions.