Helping the Intercom team deploy faster and safer with automated visual testing

THE CHALLENGE

Without manually reviewing every pull request, Intercom had no way to know with certainty that their UI remained intact

Intercom has transformed the way businesses connect with customers. Their Messenger and customizable suite of messaging-first products provide over 30,000 companies with the tools they need to acquire, engage, and support customers at every stage of the customer lifecycle. To build and improve their solutions, Intercom has a team of over 130 engineers. Their teams build and maintain everything from their marketing website and core application to their design system and component library.

Deploying new code quickly and automatically is fundamental to Intercom. With such a large and complex stack, however, continuous deployment comes with risks that functional testing doesn’t address. Without manually reviewing every pull request, Intercom had no way to know with certainty that their UI remained intact, designs were correctly implemented, and that no visual bugs were being introduced.

THE SOLUTION

With an extensive library of SDKs and integrations, Percy is Intercom’s one-stop-shop for automatic visual QA

Because the messenger app is integrated into customers’ websites, it is especially important that it is always visually perfect. With Percy’s Storybook for React integration, they can review every visual change on a component level. Furthermore, Visual testing helps Intercom make updates to its large and complex Ember web application. Now, without trying to manually test across every responsive width and browser, they know exactly when and how something has visually changed.

With Percy’s Capybara for Rails integration, visual tests run on every CircleCI build. Automation gives them immediate insight and confidence that their designs and brand remain intact on every code review.

THE IMPACT

The level of confidence that visual testing provides helps all of Intercom’s engineers to deploy with confidence and get a good night’s sleep

Visual testing has now become a fail-safe against visual regressions for Intercom, helping them uphold their flawless product experience and launch with confidence. Percy allows Intercom to easily view changes directly from their GitHub pull requests—without having to download and spin up the changes locally. That seamless feedback loop not only saves them time but also helps their team collaborate more effectively on code reviews.

Intercom does a lot of work to ensure their products are as fast and performant as possible. This often means refactoring or updating large chunks of their codebase. With visual testing, they are able to monitor their UI for visual stability when making these updates. Having confidence that nothing has broken is just as important as catching bugs.

Continuous visual reviews help Intercom’s interdisciplinary teams ensure that page variations for A/B tests are correctly implemented while controls remain stable. It also gives them confidence that existing pages don’t unexpectedly change while developing new designs and layouts.