From f62aa1aa0274f1ff86e18983046acc6aea457ccb Mon Sep 17 00:00:00 2001
From: Danny Gleckler <daniel.gleckler@d2l.com>
Date: Fri, 23 Jun 2023 21:28:10 -0400
Subject: [PATCH] Recreate golden with this before each test

---
 src/browser/vdiff.js          | 15 ++++++++++++---
 test/browser/element.vdiff.js |  8 ++++----
 2 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/src/browser/vdiff.js b/src/browser/vdiff.js
index 3beb8ed6..e635340e 100644
--- a/src/browser/vdiff.js
+++ b/src/browser/vdiff.js
@@ -1,10 +1,19 @@
 import { chai, expect } from '@open-wc/testing';
 import { executeServerCommand } from '@web/test-runner-commands';
 
-chai.Assertion.addMethod('golden', ScreenshotAndCompare);
+mocha.setup({ // eslint-disable-line no-undef
+	rootHooks: {
+		beforeEach() {
+			chai.Assertion.addMethod('golden',
+				(test => function(...args) {
+					return ScreenshotAndCompare.call(test, this._obj, ...args); // eslint-disable-line no-invalid-this
+				})(this.currentTest));
+		}
+	}
+});
 
-async function ScreenshotAndCompare(name, opts) {
-	const elem = this._obj;
+async function ScreenshotAndCompare(elem, opts) {
+	const name = this.fullTitle();
 	const rect = elem.getBoundingClientRect();
 	const { pass, message } = await executeServerCommand('brightspace-visual-diff', { name, rect, opts });
 	if (!pass) {
diff --git a/test/browser/element.vdiff.js b/test/browser/element.vdiff.js
index d8d99a54..df36cbbf 100644
--- a/test/browser/element.vdiff.js
+++ b/test/browser/element.vdiff.js
@@ -42,10 +42,10 @@ describe('element-matches', () => {
 		{ name: 'rtl', rtl: true },
 		{ name: 'transition', action: elem => elem.style.opacity = '0.2' }
 	].forEach(({ name, rtl, action }) => {
-		it(name, async function() {
+		it(name, async() => {
 			const elem = await fixture(`<${elementTag} text="Visual Difference"></${elementTag}>`, { rtl: rtl });
 			if (action) await action(elem);
-			await expect(elem).to.be.golden(this.test.fullTitle());
+			await expect(elem).to.be.golden();
 		});
 	});
 });
@@ -65,7 +65,7 @@ describe('element-different', () => {
 			elem.style.height = '70px';
 		} }*/
 	].forEach(({ name, action }) => {
-		it(name, async function() {
+		it(name, async() => {
 			const elem = await fixture(`<${elementTag} text="Visual Difference"></${elementTag}>`);
 			const isGolden = await executeServerCommand('vdiff-get-golden-flag');
 			if (!isGolden) {
@@ -75,7 +75,7 @@ describe('element-different', () => {
 
 			let fail = false;
 			try {
-				await expect(elem).to.be.golden(this.test.fullTitle());
+				await expect(elem).to.be.golden();
 			} catch (ex) {
 				fail = true;
 			}