fix(DatePicker): protect flatpickr in shallow render tests (carbon-de…

…sign-system#1389) * fix(DatePicker): protect flatpickr in shallow render tests * fix(DatePicker): add comment to describe the Null check
joshblack · Oct 3, 2018 · ae100de · ae100de
1 parent e85f04d
commit ae100de
Showing 1 changed file with 31 additions and 28 deletions.
diff --git a/src/components/DatePicker/DatePicker.js b/src/components/DatePicker/DatePicker.js
@@ -247,34 +247,37 @@ export default class DatePicker extends Component {
         typeof appendTo === 'string'
           ? document.querySelector(appendTo)
           : appendTo;
-      this.cal = new flatpickr(this.inputField, {
-        defaultDate: value,
-        appendTo: appendToNode,
-        mode: datePickerType,
-        allowInput: true,
-        dateFormat: dateFormat,
-        locale: l10n[locale],
-        minDate: minDate,
-        maxDate: maxDate,
-        plugins:
-          datePickerType === 'range'
-            ? [new rangePlugin({ input: this.toInputField })]
-            : '',
-        clickOpens: true,
-        nextArrow: this.rightArrowHTML(),
-        leftArrow: this.leftArrowHTML(),
-        onChange: (...args) => {
-          if (onChange) {
-            onChange(...args);
-          }
-        },
-        onReady: onHook,
-        onMonthChange: onHook,
-        onYearChange: onHook,
-        onOpen: onHook,
-        onValueUpdate: onHook,
-      });
-      this.addKeyboardEvents(this.cal);
+      // inputField ref might not be set in enzyme tests
+      if (this.inputField) {
+        this.cal = new flatpickr(this.inputField, {
+          defaultDate: value,
+          appendTo: appendToNode,
+          mode: datePickerType,
+          allowInput: true,
+          dateFormat: dateFormat,
+          locale: l10n[locale],
+          minDate: minDate,
+          maxDate: maxDate,
+          plugins:
+            datePickerType === 'range'
+              ? [new rangePlugin({ input: this.toInputField })]
+              : '',
+          clickOpens: true,
+          nextArrow: this.rightArrowHTML(),
+          leftArrow: this.leftArrowHTML(),
+          onChange: (...args) => {
+            if (onChange) {
+              onChange(...args);
+            }
+          },
+          onReady: onHook,
+          onMonthChange: onHook,
+          onYearChange: onHook,
+          onOpen: onHook,
+          onValueUpdate: onHook,
+        });
+        this.addKeyboardEvents(this.cal);
+      }
     }
   }