Deep visual testing across multiple browsers and pages using JUnit 5, Selenium, and recheck-web

AbstractVisualTest.java

/**
 * An abstract base class for all visual tests, defining the pages to test. One can also use separate test cases/methods
 * if specific pages need different test steps.
 */
abstract class AbstractVisualTest {

	WebDriver driver;
	Recheck re;

	abstract WebDriver getWebDriver();

	abstract Recheck getRecheck();

	@BeforeEach
	void setUp() {
		driver = getWebDriver();
		re = getRecheck();
	}

	@ParameterizedTest
	@ValueSource( strings = { "https://example.com/foo/", "https://example.com/bar/" } )
	void test( final String url ) {
		re.startTest( testName( driver, url ) );
		driver.get( url );
		re.check( driver, "initial" );
		re.capTest();
	}
	
	String testName( final WebDriver driver, final String url ) {
		final String urlName = url.replaceAll( "http(s)|:|/", "" );
		final String driverName = driver.getClass().getSimpleName();
		return urlName + "-via-" + driverName;
	}

	@AfterEach
	void tearDown() {
		driver.quit();
		re.cap();
	}

}

ChromeVisualTest.java

/**
 * An implementation of the abstract base class for a specific browser, in this case Chrome. One can use this class to
 * declare specific browser options and configure recheck-web per browser.
 */
class ChromeVisualTest extends AbstractVisualTest {

	@Override
	WebDriver getWebDriver() {
		return new ChromeDriver();
	}

	@Override
	Recheck getRecheck() {
		return new RecheckImpl();
	}

}

References:

• JUnit 5: https://junit.org/junit5/
• Selenium: https://www.seleniumhq.org/
• recheck-web: https://retest.de/

To get started with recheck-web, you can have a look at this introduction and/or this tutorial.

Alternatively, one can also combine a list of WebDrivers with a list of URLs to test against:

class CrossBrowserVisualTest {

	WebDriver driver;
	Recheck re;

	@BeforeEach
	void setUp() {
		re = new RecheckImpl();
	}

	@ParameterizedTest
	@MethodSource( "args" )
	void test( final Supplier<WebDriver> ctor, final String url ) {
		driver = ctor.get();
		re.startTest( testName( driver, url ) );
		driver.get( url );
		re.check( driver, "initial" );
		re.capTest();
	}

	@AfterEach
	void tearDown() {
		driver.quit();
	}

	String testName( final WebDriver driver, final String url ) {
		final String urlName = url.replaceAll( "http(s)|:|/", "" );
		final String driverName = driver.getClass().getSimpleName();
		return urlName + "-via-" + driverName;
	}

	static Stream<Arguments> args() {
		return drivers().flatMap( browser -> urls().map( url -> Arguments.of( browser, url ) ) );
	}

	static Stream<Supplier<WebDriver>> drivers() {
		return Stream.of( ChromeDriver::new, FirefoxDriver::new );
	}

	static Stream<String> urls() {
		return Stream.of( "https://example.com/foo/", "https://example.com/bar/" );
	}

}