1+ package com .applitools .example ;
2+
3+ import com .applitools .eyes .BatchInfo ;
4+ import com .applitools .eyes .RectangleSize ;
5+ import com .applitools .eyes .TestResultsSummary ;
6+ import com .applitools .eyes .config .Configuration ;
7+ import com .applitools .eyes .playwright .Eyes ;
8+ import com .applitools .eyes .playwright .fluent .Target ;
9+ import com .applitools .eyes .playwright .visualgrid .BrowserType ;
10+ import com .applitools .eyes .visualgrid .model .DeviceName ;
11+ import com .applitools .eyes .visualgrid .model .ScreenOrientation ;
12+ import com .applitools .eyes .visualgrid .services .RunnerOptions ;
13+ import com .applitools .eyes .playwright .visualgrid .VisualGridRunner ;
14+ import com .microsoft .playwright .Browser ;
15+ import com .microsoft .playwright .BrowserContext ;
16+ import com .microsoft .playwright .Page ;
17+ import com .microsoft .playwright .Playwright ;
18+ import org .junit .jupiter .api .*;
19+
20+ import java .time .Duration ;
21+
22+ public class AcmeBankTests {
23+ // This JUnit test case class contains everything needed to run a full visual test against the ACME bank site.
24+ // It runs the test once locally,
25+ // and then it performs cross-browser testing against multiple unique browsers in Applitools Ultrafast Grid.
26+
27+ // Test control inputs to read once and share for all tests
28+ private static String applitoolsApiKey ;
29+ private static boolean headless ;
30+
31+ // Applitools objects to share for all tests
32+ private static BatchInfo batch ;
33+ private static Configuration config ;
34+ private static VisualGridRunner runner ;
35+
36+ // Test-specific objects
37+ private static Playwright playwright ;
38+ private static Browser browser ;
39+ private BrowserContext context ;
40+ private Page page ;
41+ private Eyes eyes ;
42+
43+ @ BeforeAll
44+ public static void setUpConfigAndRunner () {
45+ // This method sets up the configuration for running visual tests in the Ultrafast Grid.
46+ // The configuration is shared by all tests in a test suite, so it belongs in a `BeforeAll` method.
47+ // If you have more than one test class, then you should abstract this configuration to avoid duplication.
48+
49+ // Read the Applitools API key from an environment variable.
50+ applitoolsApiKey = System .getenv ("APPLITOOLS_API_KEY" );
51+
52+ // Read the headless mode setting from an environment variable.
53+ // Use headless mode for Continuous Integration (CI) execution.
54+ // Use headed mode for local development.
55+ headless = Boolean .parseBoolean (System .getenv ().getOrDefault ("HEADLESS" , "true" ));
56+
57+ // Create the runner for the Ultrafast Grid.
58+ // Concurrency refers to the number of visual checkpoints Applitools will perform in parallel.
59+ // Warning: If you have a free account, then concurrency will be limited to 1.
60+ runner = new VisualGridRunner (new RunnerOptions ().testConcurrency (5 ));
61+
62+ // Create a new batch for tests.
63+ // A batch is the collection of visual checkpoints for a test suite.
64+ // Batches are displayed in the Eyes Test Manager, so use meaningful names.
65+ batch = new BatchInfo ("Example: Playwright Java JUnit with the Ultrafast Grid" );
66+
67+ // Create a configuration for Applitools Eyes.
68+ config = new Configuration ();
69+
70+ // Set the Applitools API key so test results are uploaded to your account.
71+ // If you don't explicitly set the API key with this call,
72+ // then the SDK will automatically read the `APPLITOOLS_API_KEY` environment variable to fetch it.
73+ config .setApiKey (applitoolsApiKey );
74+
75+ // Set the batch for the config.
76+ config .setBatch (batch );
77+
78+ // Add 3 desktop browsers with different viewports for cross-browser testing in the Ultrafast Grid.
79+ // Other browsers are also available, like Edge and IE.
80+ config .addBrowser (800 , 600 , BrowserType .CHROME );
81+ config .addBrowser (1600 , 1200 , BrowserType .FIREFOX );
82+ config .addBrowser (1024 , 768 , BrowserType .SAFARI );
83+
84+ // Add 2 mobile emulation devices with different orientations for cross-browser testing in the Ultrafast Grid.
85+ // Other mobile devices are available, including iOS.
86+ config .addDeviceEmulation (DeviceName .Pixel_2 , ScreenOrientation .PORTRAIT );
87+ config .addDeviceEmulation (DeviceName .Nexus_10 , ScreenOrientation .LANDSCAPE );
88+
89+ // Start Playwright and launch the browser.
90+ playwright = Playwright .create ();
91+ browser = playwright .chromium ().launch (new com .microsoft .playwright .BrowserType .LaunchOptions ().setHeadless (headless ));
92+ }
93+
94+ @ BeforeEach
95+ public void openBrowserAndEyes (TestInfo testInfo ) {
96+ // This method sets up each test with its own Page and Applitools Eyes objects.
97+
98+ // Get a new context from the browser
99+ context = browser .newContext ();
100+
101+ // Create a new page in the context.
102+ // Creating a new context is not mandatory and a new page can be created from the browser instance.
103+ // page = browser.newPage();
104+ page = context .newPage ();
105+
106+ // Create the Applitools Eyes object connected to the VisualGridRunner and set its configuration.
107+ eyes = new Eyes (runner );
108+ eyes .setConfiguration (config );
109+
110+ // Open Eyes to start visual testing.
111+ // It is a recommended practice to set all four inputs:
112+ eyes .open (
113+ page , // Page object to "watch"
114+ "ACME Bank Web App" , // The name of the app under test
115+ testInfo .getDisplayName (), // The name of the test case
116+ new RectangleSize (1024 , 768 )); // The viewport size for the local browser
117+ }
118+
119+ @ Test
120+ public void logIntoBankAccount () {
121+ // This test covers login for the Applitools demo site, which is a dummy banking app.
122+ // The interactions use typical Selenium WebDriver calls,
123+ // but the verifications use one-line snapshot calls with Applitools Eyes.
124+ // If the page ever changes, then Applitools will detect the changes and highlight them in the Eyes Test Manager.
125+ // Traditional assertions that scrape the page for text values are not needed here.
126+
127+ // Load the login page.
128+ page .navigate ("https://demo.applitools.com" );
129+
130+ // Verify the full login page loaded correctly.
131+ eyes .check (Target .window ().fully ().withName ("Login page" ));
132+
133+ // Perform login.
134+ page .locator ("#username" ).fill ("andy" );
135+ page .locator ("#password" ).fill ("i<3pandas" );
136+ page .locator ("#log-in" ).click ();
137+
138+ // Verify the full main page loaded correctly.
139+ // This snapshot uses LAYOUT match level to avoid differences in closing time text.
140+ eyes .check (Target .window ().fully ().withName ("Main page" ).layout ());
141+ }
142+
143+ @ AfterEach
144+ public void cleanUpTest () {
145+
146+ // Close Eyes to tell the server it should display the results.
147+ eyes .closeAsync ();
148+
149+ // Close the page.
150+ page .close ();
151+
152+ // Warning: `eyes.closeAsync()` will NOT wait for visual checkpoints to complete.
153+ // You will need to check the Eyes Test Manager for visual results per checkpoint.
154+ // Note that "unresolved" and "failed" visual checkpoints will not cause the JUnit test to fail.
155+
156+ // If you want the JUnit test to wait synchronously for all checkpoints to complete, then use `eyes.close()`.
157+ // If any checkpoints are unresolved or failed, then `eyes.close()` will make the JUnit test fail.
158+ }
159+
160+ @ AfterAll
161+ public static void printResults () {
162+
163+ // Close the Playwright instance.
164+ playwright .close ();
165+
166+ // Close the batch and report visual differences to the console.
167+ // Note that it forces JUnit to wait synchronously for all visual checkpoints to complete.
168+ TestResultsSummary allTestResults = runner .getAllTestResults ();
169+ System .out .println (allTestResults );
170+ }
171+ }
0 commit comments