@@ -223,9 +223,9 @@ You can see the Smart UI dashboard to view the results. This will help you ident
223223
224224The following are the different options which are currently supported:
225225
226- | Key | Description |
226+ | Key | Description |
227227| ------------------------- | ------------------------------------------------------------------------------------------------------------------------- |
228- | ` page ` (instance) | The instance of page used in your tests. |
228+ | ` driver ` (instance) | The instance of the web driver used in your tests. |
229229| ` "Screenshot Name" ` (string) | Specify a name for the screenshot in your tests to match the same screenshot with the name from your baseline. |
230230| ` options ` (object) | Specify one or a combination of selectors in the ` ignoreDOM ` or ` selectDOM ` objects. These selectors can be based on ` HTML DOM IDs, CSS classes, CSS selectors, or XPaths ` used by your webpage. They define elements that should be excluded from or included in the visual comparison.|
231231
@@ -238,54 +238,58 @@ When conducting visual tests, you may encounter scenarios where certain elements
238238<Tabs className =" docs__val " groupId =" framework " >
239239<TabItem value =" IgnoreID " label =" Ignore ID " default >
240240
241- ``` js title="This is a sample for your configuration for Playwright to ignore by ID"
242- let options = {
243- ignoreDOM: {
244- id: [" ID-1" , " ID-2" ],
245- }
246- }
247- await page .goto (' Required URL' );
248- await smartuiSnapshot .smartuiSnapshot (page, " Screenshot Name" , options);
241+ ``` java title="This is a sample for your configuration for Java to ignore by ID"
242+ List<String > cssID = Arrays . asList(" <required ID>" );
243+ Map<String , Object > options = new HashMap<> ();
244+ Map<String , List<String > > ignore = new HashMap<> ();
245+ ignore. put(" id" , cssID);
246+ options. put(" ignoreDOM" , ignore);
247+
248+ driver. get(" Required URL" );
249+ SmartUISnapshot . smartuiSnapshot(driver, " Screenshot Name" , options);
249250```
250251
251252</TabItem >
252253<TabItem value =" IgoreClass " label =" Ignore Class " >
253254
254- ``` js title="This is a sample for your configuration for Playwright to ignore by Class"
255- let options = {
256- ignoreDOM: {
257- class: [" Class-1" , " Class-2" ],
258- }
259- }
260- await page .goto (' Required URL' );
261- await smartuiSnapshot .smartuiSnapshot (page, " Screenshot Name" , options);
255+ ``` java title="This is a sample for your configuration for Java to ignore by Class"
256+ List<String > cssclass = Arrays . asList(" <required class>" );
257+ Map<String , Object > options = new HashMap<> ();
258+ Map<String , List<String > > ignore = new HashMap<> ();
259+ ignore. put(" class" , cssclass);
260+ options. put(" ignoreDOM" , ignore);
261+
262+ driver. get(" Required URL" );
263+ SmartUISnapshot . smartuiSnapshot(driver, " Screenshot Name" , options);
262264```
263265
264266</TabItem >
265267<TabItem value =" IgnoreXPath " label =" Ignore XPath " >
266268
267- ``` js title="This is a sample for your configuration for Playwright to ignore by XPath"
268- let options = {
269- ignoreDOM: {
270- xpath: [" Xpath-1" , " Xpath-2" ],
271- }
272- }
273- await page .goto (' Required URL' );
274- await smartuiSnapshot .smartuiSnapshot (page, " Screenshot Name" , options);
269+ ``` java title="This is a sample for your configuration for Java to ignore by XPath"
270+ List<String > path = Arrays . asList(" <required xpath>" );
271+ Map<String , Object > options = new HashMap<> ();
272+ Map<String , List<String > > ignore = new HashMap<> ();
273+ ignore. put(" xpath" , path);
274+ options. put(" ignoreDOM" , ignore);
275+
276+ driver. get(" Required URL" );
277+ SmartUISnapshot . smartuiSnapshot(driver, " Screenshot Name" , options);
275278```
276279
277280</TabItem >
278281
279282<TabItem value =" IgnoreSelector " label =" Ignore CSS Selector " >
280283
281- ``` js title="This is a sample for your configuration for Playwright to ignore by CSS Selector"
282- let options = {
283- ignoreDOM: {
284- cssSelector: [" CSS-Selector-1" , " CSS-Selector-2" ],
285- }
286- }
287- await page .goto (' Required URL' );
288- await smartuiSnapshot .smartuiSnapshot (page, " Screenshot Name" , options);
284+ ``` java title="This is a sample for your configuration for Java to ignore by CSS Selector"
285+ List<String > selector = Arrays . asList(" <required selector>" );
286+ Map<String , Object > options = new HashMap<> ();
287+ Map<String , List<String > > ignore = new HashMap<> ();
288+ ignore. put(" cssSelector" , selector);
289+ options. put(" ignoreDOM" , ignore);
290+
291+ driver. get(" Required URL" );
292+ SmartUISnapshot . smartuiSnapshot(driver, " Screenshot Name" , options);
289293```
290294</TabItem >
291295
@@ -294,54 +298,58 @@ let options = {
294298<Tabs className =" docs__val " groupId =" framework " >
295299<TabItem value =" SelectID " label =" Select ID " default >
296300
297- ``` js title="This is a sample for your configuration for Playwright to select by ID."
298- let options = {
299- selectDOM: {
300- id: [" ID-1" , " ID-2" ],
301- }
302- }
303- await page .goto (' Required URL' );
304- await smartuiSnapshot .smartuiSnapshot (page, " Screenshot Name" , options);
301+ ``` java title="This is a sample for your configuration for Java to select by ID."
302+ List<String > cssID = Arrays . asList(" <required ID>" );
303+ Map<String , Object > options = new HashMap<> ();
304+ Map<String , List<String > > select = new HashMap<> ();
305+ select. put(" id" , cssID);
306+ options. put(" selectDOM" , select);
307+
308+ driver. get(" Required URL" );
309+ SmartUISnapshot . smartuiSnapshot(driver, " Screenshot Name" , options);
305310```
306311
307312</TabItem >
308313<TabItem value =" SelectClass " label =" Select Class " >
309314
310- ``` js title="This is a sample for your configuration for Playwright to select by Class"
311- let options = {
312- selectDOM: {
313- class: [" Class-1" , " Class-2" ],
314- }
315- }
316- await page .goto (' Required URL' );
317- await smartuiSnapshot .smartuiSnapshot (page, " Screenshot Name" , options);
315+ ``` java title="This is a sample for your configuration for Java to select by Class"
316+ List<String > cssclass = Arrays . asList(" <required class>" );
317+ Map<String , Object > options = new HashMap<> ();
318+ Map<String , List<String > > select = new HashMap<> ();
319+ select. put(" class" , cssclass);
320+ options. put(" selectDOM" , select);
321+
322+ driver. get(" Required URL" );
323+ SmartUISnapshot . smartuiSnapshot(driver, " Screenshot Name" , options);
318324```
319325
320326</TabItem >
321327<TabItem value =" SelectXPath " label =" Select XPath " >
322328
323- ``` js title="This is a sample for your configuration for Playwright to select by XPath"
324- let options = {
325- selectDOM: {
326- xpath: [" Xpath-1" , " Xpath-2" ],
327- }
328- }
329- await page .goto (' Required URL' );
330- await smartuiSnapshot .smartuiSnapshot (page, " Screenshot Name" , options);
329+ ``` java title="This is a sample for your configuration for Java to select by XPath"
330+ List<String > path = Arrays . asList(" <required xpath>" );
331+ Map<String , Object > options = new HashMap<> ();
332+ Map<String , List<String > > select = new HashMap<> ();
333+ select. put(" xpath" , path);
334+ options. put(" selectDOM" , select);
335+
336+ driver. get(" Required URL" );
337+ SmartUISnapshot . smartuiSnapshot(driver, " Screenshot Name" , options);
331338```
332339
333340</TabItem >
334341
335342<TabItem value =" SelectSelector " label =" Select CSS Selector " >
336343
337- ``` js title="This is a sample for your webhook configuration for Playwright to select by CSS Selector"
338- let options = {
339- selectDOM: {
340- cssSelector: [" CSS-Selector-1" , " CSS-Selector-2" ],
341- }
342- }
343- await page .goto (' Required URL' );
344- await smartuiSnapshot .smartuiSnapshot (page, " Screenshot Name" , options);
344+ ``` java title="This is a sample for your webhook configuration for Java to select by CSS Selector"
345+ List<String > selector = Arrays . asList(" <required selector>" );
346+ Map<String , Object > options = new HashMap<> ();
347+ Map<String , List<String > > select = new HashMap<> ();
348+ select. put(" cssSelector" , selector);
349+ options. put(" selectDOM" , select);
350+
351+ driver. get(" Required URL" );
352+ SmartUISnapshot . smartuiSnapshot(driver, " Screenshot Name" , options);
345353```
346354</TabItem >
347355
@@ -355,54 +363,50 @@ You can capture screenshots of targeted elements by leveraging various locator m
355363<Tabs className =" docs__val " groupId =" framework " >
356364<TabItem value =" ElementID " label =" Capture Element by ID " default >
357365
358- ``` js title="This is a sample for your configuration for Playwright to capture an element by ID."
359- let options = {
360- element: {
361- id: ' Required ID' ,
362- }
363- };
364- await page .goto (' Required URL' );
365- await smartuiSnapshot .smartuiSnapshot (page, " Screenshot Name" , options);
366+ ``` java title="This is a sample for your configuration for Javas to capture an element by ID."
367+ HashMap<String , Object > options = new HashMap<> ();
368+ HashMap<String , String > locator = new HashMap<> ();
369+ options. put(" element" , locator);
370+ locator. put(" id" , " Required ID" );
371+ driver. get(" Required URL" );
372+ SmartUISnapshot . smartuiSnapshot(driver, " Screenshot Name" , options);
366373```
367374
368375</TabItem >
369376<TabItem value =" ElementClass " label =" Capture Element by Class " >
370377
371- ``` js title="This is a sample for your configuration for Playwright to capture an element by Class"
372- let options = {
373- element: {
374- class: ' Required Class' ,
375- }
376- };
377- await page .goto (' Required URL' );
378- await smartuiSnapshot .smartuiSnapshot (page, " Screenshot Name" , options);
378+ ``` java title="This is a sample for your configuration for Java to capture an element by Class"
379+ HashMap<String , Object > options = new HashMap<> ();
380+ HashMap<String , String > locator = new HashMap<> ();
381+ options. put(" element" , locator);
382+ locator. put(" class" , " Required Class" );
383+ driver. get(" Required URL" );
384+ SmartUISnapshot . smartuiSnapshot(driver, " Screenshot Name" , options);
379385```
380386
381387</TabItem >
382388<TabItem value =" ElementXPath " label =" Capture Element by XPath " >
383389
384- ``` js title="This is a sample for your configuration for Playwright to capture an element by XPath"
385- let options = {
386- element: {
387- xpath: ' Required Xpath' ,
388- }
389- };
390- await page .goto (' Required URL' );
391- await smartuiSnapshot .smartuiSnapshot (page, " Screenshot Name" , options);
390+ ``` java title="This is a sample for your configuration for Java to capture an element by XPath"
391+ HashMap<String , Object > options = new HashMap<> ();
392+ HashMap<String , String > locator = new HashMap<> ();
393+ options. put(" element" , locator);
394+ locator. put(" xpath" , " Required Xpath" );
395+ driver. get(" Required URL" );
396+ SmartUISnapshot . smartuiSnapshot(driver, " Screenshot Name" , options);
392397```
393398
394399</TabItem >
395400
396401<TabItem value =" ElementSelector " label =" Capture Element by Selector " >
397402
398- ``` js title="This is a sample for your webhook configuration for Playwright to capture an element by CSS Selector"
399- let options = {
400- element: {
401- cssSelector: ' Required CSS Selector' ,
402- }
403- };
404- await page .goto (' Required URL' );
405- await smartuiSnapshot .smartuiSnapshot (page, " Screenshot Name" , options);
403+ ``` java title="This is a sample for your configuration for Java to capture an element by CSS Selector"
404+ HashMap<String , Object > options = new HashMap<> ();
405+ HashMap<String , String > locator = new HashMap<> ();
406+ options. put(" element" , locator);
407+ locator. put(" cssSelector" , " Required Selector" );
408+ driver. get(" Required URL" );
409+ SmartUISnapshot . smartuiSnapshot(driver, " Screenshot Name" , options);
406410```
407411</TabItem >
408412
@@ -412,50 +416,43 @@ let options = {
412416
413417If you encounter difficulties loading interactive elements that appear on scroll in full-page screenshots, consider functionally incorporating a full-page scroll into your script before capturing the screenshot. This approach ensures the elements load first, facilitating the screenshot processing.
414418
415- ``` js Example for scrolling to bottom for lazy elements
416- const { chromium } = require (' playwright' );
417- const smartuiSnapshot = require (' @lambdatest/playwright-driver' );
418-
419- (async () => {
420- const browser = await chromium .launch ({ headless: false }); // Set headless: false to see the browser UI
421- const page = await browser .newPage ();
422-
423- try {
424- await page .goto (' Required URL' );
425-
426- // Function to scroll to the bottom of the page
427- async function quickScrollToBottom (lastPageWait ) {
428- await page .evaluate (async (lastPageWait ) => {
429- const scrollToBottom = async (lastPageWait ) => {
430- const getScrollHeight = () => document .body .scrollHeight ;
431- let lastHeight = await getScrollHeight ();
432- let currentHeight = 0 ;
433-
434- while (currentHeight < lastHeight) {
435- window .scrollTo (0 , lastHeight);
436- await new Promise (resolve => setTimeout (resolve, 1000 )); // Wait for page to load
437- currentHeight = lastHeight;
438- lastHeight = await getScrollHeight ();
439- }
440-
441- if (lastPageWait) {
442- await new Promise (resolve => setTimeout (resolve, lastPageWait)); // Additional wait at the bottom
443- }
444-
445- // Scroll back to the top after reaching the bottom
446- window .scrollTo (0 , 0 );
447- await new Promise (resolve => setTimeout (resolve, 1000 )); // Wait for scroll to top
448- };
449-
450- await scrollToBottom (lastPageWait);
451- }, lastPageWait);
419+ ``` java Example for scrolling to bottom for lazy elements
420+ // Rest of your code here
421+
422+ @Test
423+ public void basicTest() throws Exception {
424+ System . out. println(" Loading Url" );
425+ driver. get(" Required URL" );
426+ quickScrollToBottom();
427+
428+ SmartUISnapshot . smartuiSnapshot(driver, " Screenshot Name" );
429+ Thread . sleep(5000 ); // wait for 5 seconds
430+ System . out. println(" Test Finished" );
431+ }
432+
433+ public void quickScrollToBottom() throws InterruptedException {
434+ long lastHeight = ((Number ) ((JavascriptExecutor ) driver). executeScript(" return document.body.scrollHeight" )). longValue();
435+ while (true ) {
436+ ((JavascriptExecutor ) driver). executeScript(" window.scrollTo(0, document.body.scrollHeight);" );
437+ Thread . sleep(2000 );
438+
439+ long newHeight = ((Number ) ((JavascriptExecutor ) driver). executeScript(" return document.body.scrollHeight" )). longValue();
440+ if (newHeight == lastHeight) {
441+ break ;
442+ }
443+ lastHeight = newHeight;
452444 }
445+ ((JavascriptExecutor ) driver). executeScript(" window.scrollTo(0, 0);" );
446+ Thread . sleep(1000 ); // wait for 1 second
447+ }
453448
454- await quickScrollToBottom (100 ); // Adjust wait time as needed
455- await smartuiSnapshot .smartuiSnapshot (page, " Screenshot Name" );
449+ @AfterMethod
450+ public void tearDown() {
451+ if (driver != null ) {
452+ driver. quit();
453+ }
454+ }
455+ }
456+ ```
456457
457- } finally {
458- await browser .close ();
459- }
460- })();
461- ```
458+ For additional information about SmartUI APIs please explore the documentation [ here] ( https://www.lambdatest.com/support/api-doc/ )
0 commit comments