saucelabs.com
Open in
urlscan Pro
34.96.70.78
Public Scan
URL:
https://saucelabs.com/resources/case-studies/battlefy-accelerates-ui-modernization-with-sauce-labs-using-visual-testing
Submission: On June 30 via api from US — Scanned from DE
Submission: On June 30 via api from US — Scanned from DE
Form analysis 2 forms found in the DOM
<form class="nav-search-form-mobile nav-action-list-search-form"><input class="nav-search-input-mobile nav-action-list-search-form-input" type="text" placeholder="Search" aria-label="search"><button class="nav-action-list-search-form-button"
type="submit" aria-label="search"><i class="svg svg-search nav-action-list-search-form-icon"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M23.822 20.88l-6.353-6.354c.93-1.465 1.467-3.2 1.467-5.059.001-5.219-4.247-9.467-9.468-9.467s-9.468 4.248-9.468 9.468c0 5.221 4.247 9.469 9.468 9.469 1.768 0 3.421-.487 4.839-1.333l6.396 6.396 3.119-3.12zm-20.294-11.412c0-3.273 2.665-5.938 5.939-5.938 3.275 0 5.94 2.664 5.94 5.938 0 3.275-2.665 5.939-5.94 5.939-3.274 0-5.939-2.664-5.939-5.939z"></path></svg>
</i></button></form><form class="nav-search-form-desktop nav-action-list-items-search-form"><button class="nav-action-list-items-search-form-button" type="button" aria-label="search"><i class="svg svg-search nav-action-list-items-search-form-icon has-fill-primary"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M23.822 20.88l-6.353-6.354c.93-1.465 1.467-3.2 1.467-5.059.001-5.219-4.247-9.467-9.468-9.467s-9.468 4.248-9.468 9.468c0 5.221 4.247 9.469 9.468 9.469 1.768 0 3.421-.487 4.839-1.333l6.396 6.396 3.119-3.12zm-20.294-11.412c0-3.273 2.665-5.938 5.939-5.938 3.275 0 5.94 2.664 5.94 5.938 0 3.275-2.665 5.939-5.94 5.939-3.274 0-5.939-2.664-5.939-5.939z"></path></svg>
</i></button>
<div class="nav-action-list-items-search-form-input-container is-hidden"><input class="nav-search-input-desktop nav-action-list-items-search-form-input" type="text" placeholder="Search" aria-label="search"></div>
</form>Text Content
* *
Solutions
* * Solutions For
* * Enterprise
The continuous testing platform for enterprise scale automation
* * Start-ups & SMB Teams
Plans designed for individuals, small and medium-sized teams
* * Open Source Projects
Free live and automated testing for open source projects
* * Testing Solutions
* * Continuous Testing
Automate tests at every stage of the development cycle
* * Automated Testing
Release more quickly and improve developer productivity
* * Live Testing
Interactively test websites and real mobile devices
*
Platform
* * Continuous Testing Cloud
* * Overview
* * Testing Features
* * Cross-browser Testing
* * Mobile App Testing
* Real Device Cloud
* Emulators & Simulators
* Mobile Beta Testing
* * Low-Code Testing
* Salesforce Apps
* Oracle Apps
* * Error Reporting
* * API Testing
* * Visual Testing
* End-to-End Testing
* Component Testing
* * Ecosystem
* * Supported Integrations
* * Browsers & Devices
* Analytics & Performance
* * Sauce Performance
* * Sauce Insights
* Automation Tools
* * Selenium
* * Espresso
* * Appium
* * XCUITest
* * Cypress
* * Playwright
* * TestCafe
* * View all
*
Pricing
*
Resources
* * * * Sauce Labs Blog
* * Resource Center
* Articles
* Videos
* Webinars
* Case Studies
* White Papers
* Data Sheets
* * * * Training & Support
* Documentation
* Knowledge Base
* Our Experts
* Training
* * Community
* Events
* Selenium
* Appium
*
Company
* * * * About Us
* * Testing for GoodTesting for Good
* * What is Sauce Labs
* * Our Team
* * Careers
* * Security
* * News
* * Partners
* Technology Alliance
* Test Automation Consulting
*
Contact
* * * * Contact Sales
* * General Inquiries
* Get Support
* * Contact Support
* * Sauce Community
* Solutions
* * Solutions For
* * Enterprise
The continuous testing platform for enterprise scale automation
* * Start-ups & SMB Teams
Plans designed for individuals, small and medium-sized teams
* * Open Source Projects
Free live and automated testing for open source projects
* * Testing Solutions
* * Continuous Testing
Automate tests at every stage of the development cycle
* * Automated Testing
Release more quickly and improve developer productivity
* * Live Testing
Interactively test websites and real mobile devices
* Platform
* * Continuous Testing Cloud
* * Overview
* * Testing Features
* * Cross-browser Testing
* * Mobile App Testing
* Real Device Cloud
* Emulators & Simulators
* Mobile Beta Testing
* * Low-Code Testing
* Salesforce Apps
* Oracle Apps
* * Error Reporting
* * API Testing
* * Visual Testing
* End-to-End Testing
* Component Testing
* * Ecosystem
* * Supported Integrations
* * Browsers & Devices
* Analytics & Performance
* * Sauce Performance
* * Sauce Insights
* Automation Tools
* * Selenium
* * Espresso
* * Appium
* * XCUITest
* * Cypress
* * Playwright
* * TestCafe
* * View all
* Pricing
* Resources
* * * * Sauce Labs Blog
* * Resource Center
* Articles
* Videos
* Webinars
* Case Studies
* White Papers
* Data Sheets
* * * * Training & Support
* Documentation
* Knowledge Base
* Our Experts
* Training
* * Community
* Events
* Selenium
* Appium
* Company
* * * * About Us
* * Testing for GoodTesting for Good
* * What is Sauce Labs
* * Our Team
* * Careers
* * Security
* * News
* * Partners
* Technology Alliance
* Test Automation Consulting
* Contact
* * * * Contact Sales
* * General Inquiries
* Get Support
* * Contact Support
* * Sauce Community
*
* * Try it free
* Sign in
* My Account
*
Home / Resource Center / Case Studies / Battlefy Accelerates UI Modernization
with Sauce Labs Using Visual Testing
BATTLEFY ACCELERATES UI MODERNIZATION WITH SAUCE LABS USING VISUAL TESTING
Battlefy is a fast-growing startup in the esports industry that serves customers
including Blizzard Entertainment, Riot Games, Electronic Arts, PUBG Corp, id
Software, Nintendo, and a global market of millions of active players localized
in 11 different languages. They help gamers and non-gamers alike find and
organize esports tournaments. With the rapid growth of online gaming, Battlefy
was consistently pushing out new features to their web application to keep up
with ever-changing demand. Leveraging the Sauce Labs visual testing solution,
Sauce Visual, was critical to the team’s success, migrating to React from
Angular and validating the impact of code changes across their User Interface
(UI).
THE CHALLENGE
Battlefy’s technology powers e-sports experiences for world-class brands and
global game
studios. Brands and publishers trust Battlefy to provide an exciting,
competitive experience for players around the world. Hundreds of their
components are put to the test daily to enable visitors to search and join
upcoming esports tournaments. Their user experience is everything to them and if
it’s broken for their end-users, it’s game over.
Back in 2013, the latest go-to technology stack was MEAN (Mongo, Express,
Angular, Node). As advances in JavaScript emerged, the team was faced with the
challenge of migrating their large UI application built in Angular over to
React.
With a large scale legacy code migration looming, the Battlefy team was worried
about testing all the code they were moving over. Their main goal was to ensure
things continued to both look and function correctly.
On top of that, the Battlefy team was moving fast. They were constantly building
and shipping new features and components. It got to a point where creating and
maintaining tests became a huge bottleneck, slowing down their release cycle. It
became more and more important to get automated test coverage quickly and easily
to ensure confidence, without spending a lot of time writing tests.
In order to successfully ensure their web app was visually flawless and
functioned properly, they needed an automated visual testing solution.
THE SOLUTION
Battlefy selected Sauce Labs to help them with their visual testing needs for
several reasons. Sauce Visual integrates with Storybook, a user interface
development environment that runs outside of the main app and integrates
directly with React, allowing them to quickly get visual component testing
across their Storybook library in seconds. It integrates directly into their
Continuous Integration pipeline with CircleCI build tool and GitHub pull
requests, with automated commit status update. As a result, visual test runs are
triggered automatically as part of their build process.
Even though the team moves fast, Sauce Visual has always been there to notify us
when visual regressions would occur as it is seamlessly connected into our
Continuous Integration pipeline
Jaime Bueza
Chief Evangelist
With Sauce Visual, Battlefy is easily able to detect and prevent visual
regressions on production, scale out the engineering QA process, and accelerate
UI modernization. Designers and engineers at Battlefy work closely to build
engaging experiences for players around the world. Sauce Visual’s approval
workflow has been critical to ensuring that what gets shipped to production
continues to be high quality and in-line with the design team’s vision.
“Even though the team moves fast, Sauce Visual has always been there to notify
us when
visual regressions would occur as it is seamlessly connected into our Continuous
Integration pipeline,” said Jaime Bueza, Chief Evangelist at Battlefy.
Throughout the years, the team has managed to identify, plan, and execute UI
migrations on different parts of the platform with minimal risk.
THE RESULTS
Battlefy engineering has been able to leverage Sauce Visual as a solution for
reducing risks
and increasing developer productivity. They reduced the time spent manually
testing their UIs and writing component unit tests. This saved them over 40
hours a week, equivalent to having another full-time employee.
As newer software engineers on-board and begin to ship code to production, they
can do so more quickly because they are able to test hundreds of components in
minutes and verify their changes right away. It has enabled new and existing
engineers to catch visual regressions faster and earlier on in the development
cycle.
“Build times are amazing right now considering we have almost 400 UI states,”
reports Jaime. The team runs more than 100,000 visual test cases a month.
After using Sauce Visual for over a year now, it has consistently performed with
fast build
times and continues to test a number of screen resolutions and browsers,
ensuring everything appears to the users as it was intended.
* Contact Sales
* Solutions for enterprise
--------------------------------------------------------------------------------
Industry
Internet
--------------------------------------------------------------------------------
Company Size
51-100
Download PDF
Even though the team moves fast, Sauce Visual has always been there to notify us
when visual regressions would occur as it is seamlessly connected into our
Continuous Integration pipeline.
Jaime Bueza
Chief Evangelist
--------------------------------------------------------------------------------
Topics
Visual TestingCI/CDAutomated Testing
RELATED RESOURCES
Sauce Labs Customer Conversations: LightBox
Charles Sampankanpanich, a Senior Test Engineer at LightBox, discusses how they
are runnning tests …
HomeAway Scales Testing with Sauce Labs In Shift To Continuous Delivery
HomeAway is a family of 50 websites and hundreds of apps that collectively
provide a network of …
Article
Automated Testing in CI/CD - A Continuous Integration Server Integration Primer
White Paper
Making the Move to Automated Testing
Solutions
* Enterprise
* Start-ups & SMB Teams
* Open Source
* Continuous Testing
* Automated Testing
* Live Testing
Platform
* Overview
* Cross-browser Testing
* Mobile App Testing
* Low-Code Testing
* Error Reporting
* API Testing
* Visual Testing
* Sauce Performance
* Supported Integrations
* Browsers & Devices
* Debugging Tools
* Sauce Insights
* Automation Tools
* Pricing
Resources
* Community
* Sauce Labs Blog
* Training & Support
* Resource Center
* Status
Company
* Partners
* About Us
* Careers
* Our Team
* Security
* News
* Contact
Follow us
* Privacy
* Terms of Service
* EEA
* CCPA
* Cookies Settings
© 2022 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.
By clicking “Accept All Cookies”, you agree to the storing of cookies on your
device to enhance site navigation, analyze site usage, and assist in our
marketing efforts. This website uses cookies to enhance user experience and to
analyze performance and traffic on our website. We also share information about
your use of our site with our social media, advertising and analytics partners.
To learn more please visit our Cookie Notice.
Cookies Settings Reject All Accept All Cookies
PRIVACY PREFERENCE CENTER
* YOUR PRIVACY
* STRICTLY NECESSARY COOKIES
* FUNCTIONAL COOKIES
* PERFORMANCE COOKIES
* TARGETING COOKIES
* SOCIAL MEDIA COOKIES
YOUR PRIVACY
When you visit any website, it may store or retrieve information on your
browser, mostly in the form of cookies. This information might be about you,
your preferences or your device and is mostly used to make the site work as you
expect it to. The information does not usually directly identify you, but it can
give you a more personalized web experience. Because we respect your right to
privacy, you can choose not to allow some types of cookies. Click on the
different category headings to find out more and change our default settings.
However, blocking some types of cookies may impact your experience of the site
and the services we are able to offer.
More information
STRICTLY NECESSARY COOKIES
Always Active
These cookies are necessary for the website to function and cannot be switched
off in our systems. They are usually only set in response to actions made by you
which amount to a request for services, such as setting your privacy
preferences, logging in or filling in forms. You can set your browser to
block or alert you about these cookies, but some parts of the site will not then
work. These cookies do not store any personally identifiable information.
FUNCTIONAL COOKIES
Functional Cookies
These cookies enable the website to provide enhanced functionality and
personalisation. They may be set by us or by third party providers whose
services we have added to our pages. If you do not allow these cookies then
some or all of these services may not function properly.
PERFORMANCE COOKIES
Performance Cookies
These cookies allow us to count visits and traffic sources so we can measure and
improve the performance of our site. They help us to know which pages are the
most and least popular and see how visitors move around the site. All
information these cookies collect is aggregated and therefore anonymous. If you
do not allow these cookies we will not know when you have visited our site, and
will not be able to monitor its performance.
TARGETING COOKIES
Targeting Cookies
These cookies may be set through our site by our advertising partners. They may
be used by those companies to build a profile of your interests and show you
relevant adverts on other sites. They do not store directly personal
information, but are based on uniquely identifying your browser and internet
device. If you do not allow these cookies, you will experience less targeted
advertising.
SOCIAL MEDIA COOKIES
Social Media Cookies
These cookies are set by a range of social media services that we have added to
the site to enable you to share our content with your friends and networks. They
are capable of tracking your browser across other sites and building up a
profile of your interests. This may impact the content and messages you see on
other websites you visit. If you do not allow these cookies you may not be
able to use or see these sharing tools.
Back Button
BACK
Filter Button
Consent Leg.Interest
checkbox label label
checkbox label label
checkbox label label
Clear
checkbox label label
Apply Cancel
Confirm My Choices
Allow All