resolved test timing issues

Vonage · Oct 19, 2021 · fedea26 · fedea26
1 parent 973f43c
commit fedea26
Showing 1 changed file with 49 additions and 49 deletions.
diff --git a/components/button/test/button.test.js b/components/button/test/button.test.js
@@ -54,7 +54,7 @@ describe('button', () => {
 			formElement.addEventListener('submit', () => (submitted = true));
 
 			actualElement.click();
-
+			await waitNextTask();
 			expect(submitted).to.equal(true);
 		});
 
@@ -71,7 +71,7 @@ describe('button', () => {
 			formElement.addEventListener('submit', () => (submitted = true));
 
 			actualElement.click();
-
+			await waitNextTask();
 			expect(submitted).to.equal(true);
 		});
 
@@ -138,7 +138,7 @@ describe('button', () => {
 
 			resetButton.click();
 			submitButton.click();
-
+			await waitNextTask();
 			expect(reset, 'expected button to reset the external form').to.eql(
 				expectedReset
 			);
@@ -192,7 +192,7 @@ describe('button', () => {
 
 			resetButton.click();
 			submitButton.click();
-
+			await waitNextTask();
 			expect(afterReset).to.eql(expectedAfterReset);
 			expect(afterSubmit).to.eql(expectedAfterSubmitted);
 		});
@@ -279,7 +279,7 @@ describe('button', () => {
 			formElement.addEventListener('submit', () => (submitted = true));
 
 			actualElement.click();
-
+			await waitNextTask();
 			expect(submitted, 'submit was not initiated').to.equal(true);
 		});
 
@@ -341,6 +341,50 @@ describe('button', () => {
 				display: 'none',
 			});
 		});
+
+		it('should not emit more than one click event when is of type "submit"', async function () {
+			const EVENT_DETECTION_TIMEOUT = 100;
+			const [formEl] = addElement(
+				textToDomToParent(`
+						<form action="./test" method="get" target="testIframe" name="testForm" id="testForm">
+							<${COMPONENT_NAME} form="testForm" name="button_name" value="button_value">Button Text</${COMPONENT_NAME}>
+						</form>
+			`)
+			);
+
+			formEl.addEventListener('submit', e => e.preventDefault());
+			const [buttonEl] = [COMPONENT_NAME].map(tagName => formEl.querySelector(tagName));
+			await waitNextTask();
+
+			return new Promise((resolve, reject) => {
+				let clickCounter = 0;
+				buttonEl.addEventListener('click', () => clickCounter++);
+				buttonEl.click();
+				setTimeout(() => (clickCounter === 1 ? resolve : reject)(new Error(`"click" event received ${clickCounter} times, expected once`)), EVENT_DETECTION_TIMEOUT);
+			});
+		});
+
+		it(`should add name and value fields to FormData when present`, async function () {
+			const [sectionEl] = addElement(
+				textToDomToParent(
+					`<section>
+						<iframe name="testIframe"></iframe>
+						<form action="./test" method="get" target="testIframe" name="testForm" id="testForm">
+							<${COMPONENT_NAME} form="testForm" name="button_name" value="button_value">Button Text</${COMPONENT_NAME}>
+						</form>
+					</section>`
+				)
+			);
+
+			const [formEl, buttonEl, iframeEl] = ["form", COMPONENT_NAME, "iframe"].map(tagName => sectionEl.querySelector(tagName));
+			await waitNextTask();
+			return new Promise((resolve, reject) => {
+				iframeEl.addEventListener('load', () => {
+					(/\bbutton_name=button_value\b/.test(iframeEl.contentWindow.location.search) ? resolve : reject)(new Error('wrong value received for form field "button_name"'));
+				}, { once: true });
+				buttonEl.click();
+			});
+		});
 	});
 
 	describe('sizing', () => {
@@ -401,48 +445,4 @@ describe('button', () => {
 			});
 		});
 	});
-
-	it('should not emit more than one click event when is of type "submit"', async function () {
-		const EVENT_DETECTION_TIMEOUT = 100;
-		const [formEl] = addElement(
-			textToDomToParent(`
-						<form action="./test" method="get" target="testIframe" name="testForm" id="testForm">
-							<${COMPONENT_NAME} form="testForm" name="button_name" value="button_value">Button Text</${COMPONENT_NAME}>
-						</form>
-			`)
-		);
-
-		formEl.addEventListener('submit', e => e.preventDefault());
-		const [buttonEl] = [COMPONENT_NAME].map(tagName => formEl.querySelector(tagName));
-		await waitNextTask();
-
-		return new Promise((resolve, reject) => {
-			let clickCounter = 0;
-			buttonEl.addEventListener('click', () => clickCounter++);
-			buttonEl.click();
-			setTimeout(() => (clickCounter === 1 ? resolve : reject)(new Error(`"click" event received ${clickCounter} times, expected once`)), EVENT_DETECTION_TIMEOUT);
-		});
-	});
-
-	it(`should add name and value fields to FormData when present`, async function () {
-		const [sectionEl] = addElement(
-			textToDomToParent(
-				`<section>
-						<iframe name="testIframe"></iframe>
-						<form action="./test" method="get" target="testIframe" name="testForm" id="testForm">
-							<${COMPONENT_NAME} form="testForm" name="button_name" value="button_value">Button Text</${COMPONENT_NAME}>
-						</form>
-					</section>`
-			)
-		);
-
-		const [formEl, buttonEl, iframeEl] = ["form", COMPONENT_NAME, "iframe"].map(tagName => sectionEl.querySelector(tagName));
-		await waitNextTask();
-		return new Promise((resolve, reject) => {
-			iframeEl.addEventListener('load', () => {
-				(/\bbutton_name=button_value\b/.test(iframeEl.contentWindow.location.search) ? resolve : reject)(new Error('wrong value received for form field "button_name"'));
-			}, { once: true });
-			buttonEl.click();
-		});
-	});
 });