FORMS-13760 Date picker display value not working during prefill (#1180)

@review @vdua
DOD(Yes)

Author: rismehta

it/content/src/main/content/jcr_root/content/forms/af/core-components-it/samples/prefill/basic/.content.xml

@@ -46,6 +46,8 @@
                     sling:resourceType="forms-components-examples/components/form/datepicker"
                     enabled="{Boolean}true"
                     fieldType="date-input"
+                    displayFormat="d MMMM, y"
+                    displayPatternType="d MMMM, y"
                     name="dob"
                     readOnly="{Boolean}false"
                     textIsRich="[true,true]"

ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/datepicker/v1/datepicker/clientlibs/site/js/datepickerview.js

@@ -84,15 +84,15 @@
                 if (this.widgetObject == null) {
                     this.widgetObject = new DatePickerWidget(this, this.getWidget(), model);
                 }
-                if (this.widgetObject.getValue() !== '') {
-                    this._model.value = this.widgetObject.getValue();
+                if (this.isActive()) {
+                    this.widgetObject.setValue(model.value);
+                } else {
+                    this.widgetObject.setDisplayValue(model.value);
                 }
                 this.widgetObject.addEventListener('blur', (e) => {
                     this._model.value = this.widgetObject.getValue();
-
                     //setDisplayValue is required for cases where value remains same while focussing in and out.
                     this.widgetObject.setDisplayValue(this._model.value);
-
                     this.setInactive();
                 }, this.getWidget());
                 this.widgetObject.addEventListener('focus', (e) => {
@@ -111,7 +111,6 @@
                     this.setActive();
                 });
             }
-
         }
 
         #noFormats() {

ui.tests/test-module/specs/prefill/customprefill.spec.js

@@ -53,7 +53,7 @@ describe('Custom Prefill Test', function () {
             cy.previewForm(pagePath, {"params" : [`prefillId=${prefillId}`]});
             // validating the prefilled data
             cy.get(nameTextBox).should("have.value", "John Doe");
-            cy.get(dobDropdown).should("have.value", "1999-10-10");
+            cy.get(dobDropdown).should("have.value", "10 October, 1999");
             cy.get(genderRadioButton).should("have.value", "0");
             cy.get(jobDropdown).should("have.value", "1");
         }