Fix for MUI Date Picker component on DOM

CSCfi · Dec 3, 2021 · 636ea46 · 636ea46
1 parent 8ac88ab
commit 636ea46
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 10 deletions.
diff --git a/cypress/integration/doiForm.spec.js b/cypress/integration/doiForm.spec.js
@@ -252,9 +252,9 @@ describe("DOI form", function () {
       .should("be.visible")
 
     cy.wait(500)
-    cy.get("div[data-testid='Start'] > div").then(() =>
-      cy.get("div[data-testid='Start'] > div > button").click({ force: true })
-    )
+    cy.get("div[data-testid='Start'] > div")
+      .should("be.visible")
+      .then(() => cy.get("div[data-testid='Start'] > div > button").click({ force: true }))
     cy.get("div").contains("4", { timeout: 10000 }).click()
     cy.get("input[data-testid='dates.0.date']").should("have.value", "2021-10-04/")
 

diff --git a/src/components/NewDraftWizard/WizardForms/WizardJSONSchemaParser.js b/src/components/NewDraftWizard/WizardForms/WizardJSONSchemaParser.js
@@ -114,6 +114,7 @@ const DatePickerWrapper = styled(Grid)(({ theme }) => ({
   "& div": {
     padding: 0,
     margin: 0,
+    display: "inline-block",
     "& input": {
       padding: 0,
       margin: 0,
@@ -873,18 +874,13 @@ const FormDatePicker = ({ name, label, required, description }: FormFieldBasePro
                     disabled={unknownDates.checkedEndDate}
                   />
                   <DesktopDatePicker
-                    InputProps={{ "data-testid": "Start" }}
-                    renderInput={params => {
-                      params.inputProps.placeholder = ""
-                      params.inputProps.value = ""
-                      return <TextField {...params} sx={{ "& fieldset": { border: "none" } }} />
-                    }}
+                    label="Start"
+                    renderInput={params => <DateSelection {...params} />}
                     value={startDate}
                     onChange={handleChangeStartDate}
                     disabled={unknownDates.checkedStartDate}
                     minDate={moment("0001-01-01")}
                     shouldDisableDate={day => moment(day).isAfter(endDate)}
-                    InputAdornmentProps={{ sx: { height: "auto" } }}
                   />
                 </DatePickerWrapper>
                 <DatePickerWrapper item xs="auto">