diff --git a/components/button/test/button.test.js b/components/button/test/button.test.js index 5bf666ada..44f789f2e 100644 --- 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(` +
+ <${COMPONENT_NAME} form="testForm" name="button_name" value="button_value">Button Text +
+ `) + ); + + 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( + `
+ +
+ <${COMPONENT_NAME} form="testForm" name="button_name" value="button_value">Button Text +
+
` + ) + ); + + 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(` -
- <${COMPONENT_NAME} form="testForm" name="button_name" value="button_value">Button Text -
- `) - ); - - 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( - `
- -
- <${COMPONENT_NAME} form="testForm" name="button_name" value="button_value">Button Text -
-
` - ) - ); - - 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(); - }); - }); });