Accessibility and Testability - two sides of the same coin

What makes a UI testable?

If you've ever struggled with testing icon buttons, sliders, datepickers, you know what I mean. Those things are a pain to test, and the tests you've written is probably not very maintainable either.

Here's an argument on making UI more accessible - it's means your UI is more testable too - let me show you what I mean.

 
 

Outline/Structure of the Talk

[45 min]

  • [5 min] Introduction
    • [2 min] Why this topic matters - testability is a two-way conversation between QAs and the engineering team, and QAs need to know how to advocate good practices to enable test automation so that they themselves can write higher quality tests.
    • [3 min] Examples of un-testable UI components - datepickers, custom dropdown components, radio buttons, icon buttons, table rows with action buttons, etc.
      • Examples of nasty tests we try to write for un-testable UI components
      • What bad tests mean for the business:
        • More unstable tests, more time spent on test maintenance
        • Difficult on-boarding for new QAs because tests have unreadable selectors and are overly complex
        • QA team's morale impacted when stakeholders question the ROI of automated tests
  • [5 min] What makes a UI testable?
    • Custom components using semantic HTML, e.g. using < input > instead of for radio buttons and checkboxes, or using < select >
      for dropdowns
    • Properly labelling elements using best practices like setting `title` attribute or ARIA attributes and the
    • Basically, practices that make the UI accessible
  • [25 min] How to make UI components testable with 4 - 5 examples
    • 4-5 Codepen examples showing un-testable and testable UI components, and how tests would look like for both versions.
      • based on common UI components that QAs frequently find challenging - datepickers, custom dropdown components, radio buttons, icon buttons, table rows with action buttons, etc.
      • We'll spend 5 minute each per example.
  • [2 min] Conclusion to re-emphasize key points
  • [8 min] FAQs

Learning Outcome

What makes a web page testable and un-testable and how to build testable components.

Target Audience

QAs and web developers

Prerequisites for Attendees

Audience should have basic knowledge about HTML and how to write CSS and XPATH selectors

schedule Submitted 11 months ago

Public Feedback


    • Shweta Sharma
      keyboard_arrow_down

      Shweta Sharma / Nikita Jain - Accessibility testing 101

      45 Mins
      Talk
      Beginner

      "This world is such a beautiful place to live in." If you can read the first sentence without any screen readers or assistance, you're privileged. As technologists, shouldn’t we be more empathetic towards differently-abled people and make all parts of our website accessible to them? In my humble opinion, the true power of technology can be identified when it reaches out to people of all kinds having different physical or psychological challenges. We not only legally bound to provide Accessibility but also it should be considered as our moral responsibility.

      As testers, we have a wonderful opportunity to contribute to Accessibility by ensuring that the site is accessible in many different ways. Although it is impossible to identify all the issues that exist around Accessibility in the world, we are lucky enough to still understand a majority of them. With this understanding, there have been many measures taken in order to make your site accessible. But, don’t forget - we are QA engineers. We got to ensure that the site is accessible as per the standards set by WCAG 2.0 (AA) by testing for accessibility using various tools and techniques.

    • Abhijeet Vaikar
      keyboard_arrow_down

      Abhijeet Vaikar - End-end test code as a first class citizen

      45 Mins
      Case Study
      Intermediate

      "All tests in today's automated regression run have been marked as Untested. What happened?"

      "No notifications are being sent for test runs on the channel"

      "I pulled latest code, and the framework dependency shows compilation error"

      "What does this new method in the framework do?"

      How often do you hear such things within your team?

      As Quality champions, we need to walk the talk. When we expect our developers to write quality code, write unit tests, build features without introducing bugs, the onus lies on us (as test engineers) to do the same. With almost every test engineering team writing automated tests to check functionality of their products and services, it becomes very important to ensure that the test automation framework and the test scripts are bug-free and follow good standards of software engineering.

      It cannot be stressed enough that test automation code should be as good as production code. In order to build production-quality test automation framework and scripts, a number of steps can be taken at:

      1. Code & System Level

      2. Process & People Level

      Our test engineering team went through a transition from having random & unexpected failing test runs to having greater confidence in the quality of the tests. Learn from this case study of our journey to ensure that end-end UI automated tests are built with quality in mind. We will also see demonstration of some of the use cases.

    • Gaurav Singh
      keyboard_arrow_down

      Gaurav Singh - How to build an automation framework with Selenium : Patterns and practices

      Gaurav Singh
      Gaurav Singh
      Test automation Lead
      Gojek
      schedule 1 year ago
      Sold Out!
      45 Mins
      Talk
      Beginner

      With an ever increasing no of businesses being conducted on web the testing need to write automated tests for the app's UI is something that can never be ignored. As you all know Selenium provides an API that enables us to do this quite effectively.

      However, when tasked with setting up the automation framework, there are a lot of questions that arise in the minds of aspiring test developers regardless of what level they are in their career.


      Some of such questions are:

      1. How does one actually go about the business of building a robust and effective automation framework on top of selenium?
      2. What are the elementary building blocks to include in the framework that an aspiring automation developer should know of?
      3. How should we model our tests? XUnit style vs BDD?
      4. Are there good practices, sensible design patterns and abstractions that we can follow in our code?
      5. What are some of the anti patterns/common mistakes we should avoid

      A lot of literature, documentation and blogs exists on these topics on the web already.

      However In this talk,

      I would combine this existing knowledge and my years of experience in building automation frameworks and breakdown these elements and walk you through exactly the sort of decisions/considerations and practices that you can take while starting to implement or improve the UI automation for your team.

      Hope to see you there!

    • Vijay Ravindran
      keyboard_arrow_down

      Vijay Ravindran - Automation on Unity Engine application - Ways to automate Unity Game Engine applications using Unity Test Runner and Autoplay,Selenium tool.

      Vijay Ravindran
      Vijay Ravindran
      Sr. QAE
      Trimble
      schedule 11 months ago
      Sold Out!
      45 Mins
      Tutorial
      Beginner

      Unity 3D game engine is used to develop games and enterprise application development in multiple platform which is compatible across devices. It is an excellent cross development tool, especially used for Next-Gen technologies like augmented and virtual reality applications.

      As everyone is familiar with the terms like appium, selenium for automation in mobile application, it's quite a big challenge and uncertain when it comes to automation in mobile application built in Unity engine. Here we will discuss about the solution on automating unity built application using following methods:

      1. Using Unity Test Runner - which comes with Unity application using [UnityTest] attribute
      2. Using AutoPlay, Selenium - Similar to web testing with inspector and web driver protocol support.

      Method 1 : Unity Test Runner

      • The Unity Test Runner is a tool that tests your code in both Edit mode and Play mode, and also on target platforms such as Standalone, Android, or iOS.
      • The Unity Test Runner uses a Unity integration of the NUnit library, which is an open-source unit testing library for .Net languages.
      • [UnityTest Attribute] - Addition to the standard NUnit library for the Unity Test Runner.

      Method 2: Using AutoPlay and Selenium

      • Inspect game scene
      • Manage game on real devices (install / uninstall, start / stop, etc)
      • Run Selenium tests (with all base selenium actions like click, getText, swipe, get elements property, etc)
      • Write test on any programming language (Java, C#, python, etc)

      Looking forward to meet you all in SeleniumConf 2020