From 0cebacc7a0410721c68df0de4fd11c6dcb0b20ea Mon Sep 17 00:00:00 2001 From: parthlambdatest Date: Fri, 22 Nov 2024 17:12:00 +0530 Subject: [PATCH 1/4] add locators if they are in page's range --- src/lib/processSnapshot.ts | 35 +++++++++++++++++++++++++++++------ 1 file changed, 29 insertions(+), 6 deletions(-) diff --git a/src/lib/processSnapshot.ts b/src/lib/processSnapshot.ts index d25cdb1..a2798fa 100644 --- a/src/lib/processSnapshot.ts +++ b/src/lib/processSnapshot.ts @@ -56,6 +56,7 @@ export default async function processSnapshot(snapshot: Snapshot, ctx: Context): } } const page = await context.newPage(); + let height = 0; // populate cache with already captured resources let cache: Record = {}; @@ -284,6 +285,17 @@ export default async function processSnapshot(snapshot: Snapshot, ctx: Context): } if (ctx.config.cliEnableJavaScript && fullPage) await page.evaluate(scrollToBottomAndBackToTop, { frequency: 100, timing: ctx.config.scrollTime }); + // Calculate the height of the content + height = await page.evaluate(() => { + const body = document.body; + const html = document.documentElement; + return Math.max( + body.scrollHeight, body.offsetHeight, + html.clientHeight, html.scrollHeight, html.offsetHeight + ); + }); + + ctx.log.debug(`Calculated content height: ${height}`); try { await page.waitForLoadState('networkidle', { timeout: 5000 }); @@ -314,12 +326,23 @@ export default async function processSnapshot(snapshot: Snapshot, ctx: Context): } for (const locator of locators) { let bb = await locator.boundingBox(); - if (bb) processedOptions[ignoreOrSelectBoxes][viewportString].push({ - left: bb.x, - top: bb.y, - right: bb.x + bb.width, - bottom: bb.y + bb.height - }); + if (bb) { + // Calculate top and bottom from the bounding box properties + const top = bb.y; + const bottom = bb.y + bb.height; + + // Only push if top and bottom are within the calculated height + if (top <= height && bottom <= height) { + processedOptions[ignoreOrSelectBoxes][viewportString].push({ + left: bb.x, + top: top, + right: bb.x + bb.width, + bottom: bottom + }); + } else { + ctx.log.debug(`Bounding box for selector skipped due to exceeding height: ${JSON.stringify({ top, bottom, height })}`); + } + } } } ctx.log.debug(`Processed options: ${JSON.stringify(processedOptions)}`); From fae06c00c16f5676faf1108c711c2c4062881aa8 Mon Sep 17 00:00:00 2001 From: parthlambdatest Date: Fri, 22 Nov 2024 17:17:48 +0530 Subject: [PATCH 2/4] 4.0.11 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index cecd716..2f0ac13 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@lambdatest/smartui-cli", - "version": "4.0.10", + "version": "4.0.11", "description": "A command line interface (CLI) to run SmartUI tests on LambdaTest", "files": [ "dist/**/*" From 77c2b3208b143a605f7368648d93f9da53ad0765 Mon Sep 17 00:00:00 2001 From: parthlambdatest Date: Fri, 22 Nov 2024 17:34:02 +0530 Subject: [PATCH 3/4] evaluate height if required --- src/lib/processSnapshot.ts | 34 ++++++++++++++++++++++++---------- 1 file changed, 24 insertions(+), 10 deletions(-) diff --git a/src/lib/processSnapshot.ts b/src/lib/processSnapshot.ts index a2798fa..82bae3b 100644 --- a/src/lib/processSnapshot.ts +++ b/src/lib/processSnapshot.ts @@ -56,7 +56,6 @@ export default async function processSnapshot(snapshot: Snapshot, ctx: Context): } } const page = await context.newPage(); - let height = 0; // populate cache with already captured resources let cache: Record = {}; @@ -285,15 +284,6 @@ export default async function processSnapshot(snapshot: Snapshot, ctx: Context): } if (ctx.config.cliEnableJavaScript && fullPage) await page.evaluate(scrollToBottomAndBackToTop, { frequency: 100, timing: ctx.config.scrollTime }); - // Calculate the height of the content - height = await page.evaluate(() => { - const body = document.body; - const html = document.documentElement; - return Math.max( - body.scrollHeight, body.offsetHeight, - html.clientHeight, html.scrollHeight, html.offsetHeight - ); - }); ctx.log.debug(`Calculated content height: ${height}`); @@ -313,6 +303,30 @@ export default async function processSnapshot(snapshot: Snapshot, ctx: Context): throw new Error(`for snapshot ${snapshot.name} viewport ${viewportString}, multiple elements found for selector ${processedOptions.element}`); } } else if (selectors.length) { + let height = 0; + height = await page.evaluate(() => { + const DEFAULT_HEIGHT = 16384; + const body = document.body; + const html = document.documentElement; + if (!body || !html) { + ctx.log.debug('Document body or html element is missing, using default height'); + return DEFAULT_HEIGHT; + } + const measurements = [ + body?.scrollHeight || 0, + body?.offsetHeight || 0, + html?.clientHeight || 0, + html?.scrollHeight || 0, + html?.offsetHeight || 0 + ]; + const allMeasurementsInvalid = measurements.every(measurement => !measurement); + if (allMeasurementsInvalid) { + ctx.log.debug('All height measurements are invalid, using default height'); + return DEFAULT_HEIGHT; + } + return Math.max(...measurements); + }); + let locators: Array = []; if (!Array.isArray(processedOptions[ignoreOrSelectBoxes][viewportString])) processedOptions[ignoreOrSelectBoxes][viewportString] = [] From 920feef5a60d1dbb1ea37d4a241f0417f7d2b16f Mon Sep 17 00:00:00 2001 From: parthlambdatest Date: Fri, 22 Nov 2024 17:37:16 +0530 Subject: [PATCH 4/4] code cleanup --- src/lib/processSnapshot.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/lib/processSnapshot.ts b/src/lib/processSnapshot.ts index 82bae3b..ab46584 100644 --- a/src/lib/processSnapshot.ts +++ b/src/lib/processSnapshot.ts @@ -285,8 +285,6 @@ export default async function processSnapshot(snapshot: Snapshot, ctx: Context): } if (ctx.config.cliEnableJavaScript && fullPage) await page.evaluate(scrollToBottomAndBackToTop, { frequency: 100, timing: ctx.config.scrollTime }); - ctx.log.debug(`Calculated content height: ${height}`); - try { await page.waitForLoadState('networkidle', { timeout: 5000 }); ctx.log.debug('Network idle 500ms'); @@ -326,6 +324,7 @@ export default async function processSnapshot(snapshot: Snapshot, ctx: Context): } return Math.max(...measurements); }); + ctx.log.debug(`Calculated content height: ${height}`); let locators: Array = []; if (!Array.isArray(processedOptions[ignoreOrSelectBoxes][viewportString])) processedOptions[ignoreOrSelectBoxes][viewportString] = []