Back to Resources

Blog

Posted April 12, 2018

Extended Debugging with Sauce Labs

quote

The addition of an Extended Debugging feature to the Sauce Labs platform makes it easy for QA engineers to gain insight into network requests that can cause automated tests to fail. It also helps to identify application problems before shipping a new release to production.

That is because today, most applications are executed within the browser, so when a problem occurs, it's essential to access the browser console logs to resolve the defect promptly. Extended debugging helps to achieve this. It also opens up new opportunities for adding new test coverage around analytic testing, network throttling, and more.

This article provides an overview of extended debugging in Sauce Labs and what it can do for you.

What Does Extended Debugging Do?

There are advantages to using Sauce Labs’ Extended Debugging feature over solutions like BrowserMob proxy. It's native to the browser and directly connected, with no additional layers between the testing framework and the application, and a lot of features out of the box.

You now have direct entry to browser developer tools that provide in-depth access to the internals of the browser and your web application. Use the Extended Debugging feature to track down performance issues, and get insights for code optimization. You can also debug flaky tests, and use it with intercept requests, throttle, and more. This will help you diagnose problems quickly and give you extra test coverage, which ultimately helps you build web applications with confidence—and faster.

This is an exciting feature that is beneficial for Sauce Labs clients only, so I thought I'd discuss how it can be helpful to my team.

Out-of the-Box Features

The features straight out of the box as of SauceCon18 allow access to existing browser developer tools, and Sauce Labs’ custom browser driver for extended debugging or extra test coverage. I'm not going to dwell on existing browser developer tools here. It's important to understand where to find the documentation for JS profiling, DOM changes, app runtime, network APIs, app performance stats, and more (see Chrome and Firefox).

I'm interested in the custom browser extensions, manipulation and mockup of networking requests, receiving information about network events, intercepting and blocking requests, throttling, and log types (network, metrics, and timing). I love when the code is clean, crisp and straightforward. Here’s an example of how to add network throttling to specific tests or an entire test suite by including a network profile or condition (by targeting maximum download speed, upload throughput, and latency manipulation).

Network Throttling

driver.execute_script('sauce:throttle', {...})  |  |-- condition // profile name or condition    |-- download // download speed    |-- upload // upload speed    |-- latency // round trip time

Intercepting Network Requests

driver.execute_script('sauce:intercept, {...})  |  |-- url // what request should be redirect    |-- redirect // where to redirect    |-- response // what should be the response body    |-- error // error value

Take the time to tinker! Many great innovations and new strategies began with individuals who are curious and love to tinker with new tools released to the community. Let's start tinkering today by exploring intercepting network requests, network timing logs, and more features here!

Building a Strategy Around Extended Debugging

Now, we are starting from scratch and building a strategy that works around Extended Debugging. Let’s shift from tinkering to focusing on strategy and need. The tool is more than a debugger for application performance or flaky tests—It's another layer of quality checking.

It's a perfect fit for analytics testing to ensure that any of the analytics vendors like comScore, Adobe Analytics (Omniture), and Chartbeat are triggered correctly when end users access your web application. For instance, Chartbeat provides analytics about the content for Gannett | USA Today Network properties. It helps produce actionable insights into what content to publish and promote, with a focus on real-time data. The Chartbeat + Extended Debugging test finds the Chartbeat ping in the network calls and validates that Chartbeat tracking is picking up the expected requests for each page of the application.

Take a minute and start drafting a strategy or need by using a mind mapping technique to identify how you will use Extended Debugging. Everyone will have a different starting point. I see other opportunities using throttle offline or in other network conditions, analyzing network performance, and more.

Conclusion

You can't solve all of the world’s QA problems in one day. Take baby steps to tinker and build a strategy to increase your quality coverage using the available features from Sauce Labs. They will build confidence in your releases before shipping to production, and after (shifting right). This new solution will help us to identify application performance issues and failures faster, before impacting end users.

Greg Sypolt (@gregsypolt) is Director of Quality Engineering at Gannett | USA Today Network, a Fixate IO Contributor, and co-founder of Quality Element. He is responsible for test automation solutions, test coverage (from unit to end-to-end), and continuous integration across all Gannett | USA Today Network products, and has helped change the testing approach from manual to automated testing across several products at Gannett | USA Today Network. To determine improvements and testing gaps, he conducted a face-to-face interview survey process to understand all product development and deployment processes, testing strategies, tooling, and interactive in-house training programs.

Published:
Apr 12, 2018
Share this post
Copy Share Link
© 2024 Sauce Labs Inc., all rights reserved. SAUCE and SAUCE LABS are registered trademarks owned by Sauce Labs Inc. in the United States, EU, and may be registered in other jurisdictions.