FORMS-14013 - Testcase added - Fixing Dropdown that had a selected va…

…lue without default/placeholder set (#1203) * Added test case * Adding actual fix * Improved test case * Small fix
adobe · Apr 29, 2024 · 8118d35 · 8118d35
1 parent ef7330d
commit 8118d35
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/...src/main/content/jcr_root/apps/core/fd/components/form/dropdown/v1/dropdown/dropdown.html b/...src/main/content/jcr_root/apps/core/fd/components/form/dropdown/v1/dropdown/dropdown.html
@@ -46,7 +46,7 @@
             data-sly-attribute.multiple="${dropdown.isMultiSelect ? 'multiple' : ''}"
             aria-readonly="${dropdown.readOnly ? 'true' : ''}">
         <div data-sly-test.isPlaceHolderSet="${dropdown.placeHolder != null}" data-sly-unwrap></div>
-        <option data-sly-test="${!isPlaceHolderSet}"  style="display: none;"></option>
+        <option data-sly-test="${!isPlaceHolderSet}" disabled selected></option>
         <option data-sly-test="${isPlaceHolderSet}" value="" disabled selected>${dropdown.placeHolder}</option>
         <div data-sly-list.enumName="${dropdown.enumNames}" data-sly-unwrap>
             <div data-sly-test="${enumName != null && dropdown.enums[enumNameList.index] != null}" data-sly-unwrap>

diff --git a/ui.tests/test-module/specs/dropdown/dropdown.runtime.spec.js b/ui.tests/test-module/specs/dropdown/dropdown.runtime.spec.js
@@ -223,4 +223,17 @@ describe("Form with Dropdown", () => {
           cy.get(`#${id}`).should('have.class', 'cmp-adaptiveform-dropdown--filled');
       });
   });
+
+    it("should have empty placeholder checked when default option is not configured", () => {
+        const [idDropdown, fieldView1] = Object.entries(formContainer._fields)[9];
+        const model = formContainer._model.getElement(idDropdown);
+        cy.get(`#${idDropdown} select`).invoke('val').then(val => {
+            expect(val, "Actual value of unselected dropdown").to.equal(null);
+        })
+        cy.get(`#${idDropdown} select`).find('option').then(options => {
+            expect(options[0].selected, "Empty Placeholder to be selected").to.be.true
+            expect(options[0].disabled, "Empty Placeholder to be disabled").to.be.true
+            expect(options[0].value, "Empty Placeholder to be empty in it's visual content").to.equal('')
+        });
+    });
 })