What is Reflow?

Reflow is a web based tool that enables the rapid creation and maintenance of browser-based end-to-end tests, across all modern browsers.

Reflow takes as input manual interactions with your website, and outputs a fully automated visual regression test suite, that can be executed to validate your product with multiple browsers, mobile devices, geolocations and more. A reflow test can be parameterized, quickly covering large numbers of scenarios according to your business needs.

Reflow is designed to be used by a combination of Technical and Non-Technical personnel. Multiple escape hatches exist to allow you to extend it with custom code should you run into a limitation, want to abstract common flows, or have a custom use-case.

Eliminating Flaky Tests

Flaky tests kill engineering time. Unfortunately, it is non-trivial to eliminate flakiness using current open-source tools. Reflow has several different strategies that collectively enable it to reduce the cost of maintaining your end-to-end tests:

1. Fuzzy Selectors: When reflow records an element interactions, it stores both a "best selector" and an object containing all possible selectors associated with a page element. Upon replay, the "best selector" is first used to see if the element can be found quickly. If not, then all other possible selectors are ranked and compared against the original element, until a match is found and validated.
2. Intelligent Waiting: Reflow tracks every DOM update on the page, and when an element interaction is recorded, it knows precisely when that element appeared on the page, and what the page looked like the moment before the interaction. This timing information allows reflow's replay agents to intelligently wait for an element to appear before interacting with it, even if the element takes a long time to appear due to an asyncronous interaction.
3. Visual Selectors: When an element interaction is recorded, a screenshot of that element is recorded. This screenshot is then used to evaluate both the element found by the "best selector", as well as used to auto-heal the element via looking at how element candidates that match a subset of selectors visually look compared to the original recorded selector
4. Ambiguity reduced to a Button Click: When strategies [1,2,3] result in either ambiguity (i.e. more than one element matches the fuzzy selector), or no element found, reflow will rank all possible elements on the page to find the closest match to the originally recorded element and fail the test. When a user looks at the failed test, reflow will immediately offer an "Auto Heal" button, that will visually demonstrate the closest match reflow found, and allow a user to approve a change to the original test that will replace the element selector with the new found one.

Reducing False Positives with Visual Regression Testing

Reflow automatically stores screenshots of all page elements it interacts with. It also enables the creation of visual match assertions -- an assertion that an element does not visually change between runs.

Visual Match assertions allow for large amounts of behaviour to be automatically captured and validated upon, with very low maintenance effort. These visual assertions can be auto healed at a single click when there is an expected change to your product's visual look.

Resilient Infrastructure

Reflow can run entirely in the cloud, meaning there is no components that your team needs to maintain to power your QA workflows.

High Concurrency

Reflow scales to thousands of concurrent browsers, automatically, to keep up with your team's demand.

Long Term Inspection

Reflow takes screenshots before and after every interaction with your application. It compares these to previous runs (or a run explicitly selected), and helps you to quickly spot any visual differences with a Comparison Image, Visual Percentage Change, and Visual Alerts.

Reflow can retain these screenshots forever.