@brightspace-ui/testing 0.28.0 → 0.29.0

package/README.md

@@ -335,6 +335,21 @@ describe('my-elem', () => {
 
 The filename and location of the resulting image will be based on the suite names and test name.
 
+Sometimes you might be writing tests to verify a component's position within the whole viewport. For snapshots of the whole page, set up your components and pass `document` to the assertion:
+
+```javascript
+import { fixture, html } from '@brightspace-ui/testing';
+
+describe('my-elem', () => {
+  describe('situation1', () => {
+    it('state1', async() => {
+      await fixture(html`<my-dialog opened></my-dialog>`);
+      await expect(document).to.be.golden();
+    });
+  });
+});
+```
+
 #### Configuring the Snapshot Area
 
 By default, the snapshot area will be a rectangle around the source element plus a `10px` buffer margin on each side. To use a different margin, pass it as an option:

package/package.json

@@ -2,7 +2,7 @@
   "name": "@brightspace-ui/testing",
   "description": "Utilities for testing front-end components and applications",
   "type": "module",
-  "version": "0.28.0",
+  "version": "0.29.0",
   "repository": "https://github.com/BrightspaceUI/testing.git",
   "scripts": {
     "lint": "eslint . --ext .js",

package/src/browser/vdiff.js

@@ -27,7 +27,7 @@ async function ScreenshotAndCompare(opts) {
 	}
 
 	const name = this.test.fullTitle();
-	const rect = this.elem.getBoundingClientRect();
+	const rect = this.elem === document ? null : this.elem.getBoundingClientRect();
 	const slowDuration = this.test.slow();
 	let result = await executeServerCommand('brightspace-visual-diff-compare', { name, rect, slowDuration, opts });
 	if (result.resizeRequired) {

package/src/server/report/result.js

@@ -195,11 +195,14 @@ export function renderBrowserResults(browser, tests, options) {
 			return acc;
 		}
 
-		let status = STATUS_TYPE.WARNING;
-		if (resultData.duration > resultData.info.slowDuration) {
-			status = STATUS_TYPE.ERROR;
-		} else if (resultData.duration < (resultData.info.slowDuration / 2)) {
-			status = STATUS_TYPE.NORMAL;
+		let status = STATUS_TYPE.NORMAL;
+		if (resultData.info) {
+			status = STATUS_TYPE.WARNING;
+			if (resultData.duration > resultData.info.slowDuration) {
+				status = STATUS_TYPE.ERROR;
+			} else if (resultData.duration < (resultData.info.slowDuration / 2)) {
+				status = STATUS_TYPE.NORMAL;
+			}
 		}
 
 		return acc.push(html`

package/src/server/visual-diff-plugin.js

@@ -182,18 +182,23 @@ export function visualDiff({ updateGoldens = false, runSubset = false } = {}) {
 				}
 
 				const opts = { margin: DEFAULT_MARGIN, ...payload.opts };
-
-				const page = session.browser.getPage(session.id);
-				await page.screenshot({
+				const screenshotOpts = {
 					animations: 'disabled',
-					clip: {
+					path: updateGoldens ? goldenFileName : screenshotFileName
+				};
+				if (!payload.rect) {
+					screenshotOpts.fullPage = true;
+				} else {
+					screenshotOpts.clip = {
 						x: payload.rect.x - opts.margin,
 						y: payload.rect.y - opts.margin,
 						width: payload.rect.width + (opts.margin * 2),
 						height: payload.rect.height + (opts.margin * 2)
-					},
-					path: updateGoldens ? goldenFileName : screenshotFileName
-				});
+					};
+				}
+
+				const page = session.browser.getPage(session.id);
+				await page.screenshot(screenshotOpts);
 
 				if (updateGoldens) {
 					return { pass: true };

package/src/server/visual-diff-reporter.js

@@ -70,6 +70,11 @@ function flattenResults(session, browserData, fileData) {
 		tests.forEach(t => {
 			const testName = `${prefix}${t.name}`;
 			const testKey = testName.replaceAll(' > ', ' ');
+			const info = getTestInfo(session, testKey);
+
+			// tests missing info but with no error were skipped via grep, so exclude them
+			if (!info && !t.error) return;
+
 			if (!fileData.tests.has(testName)) {
 				fileData.tests.set(testName, {
 					name: testName,
@@ -87,7 +92,7 @@ function flattenResults(session, browserData, fileData) {
 				duration: t.duration,
 				error: t.error?.message,
 				passed: t.passed,
-				info: getTestInfo(session, testKey)
+				info: info
 			});
 		});
 	}