From 3229c27d50ece3aa10f8c39c9591afd3cfe9e7f1 Mon Sep 17 00:00:00 2001
From: Shawn Erquhart <shawn@erquh.art>
Date: Fri, 20 Apr 2018 12:52:48 -0400
Subject: [PATCH] return date object from date/datetime widgets if no format
 set

BREAKING CHANGE

As of 1.0, the documented behavior for the date and datetime widgets was
to always return a string value, but they were instead returning a date
object if the default date was not manually changed by the user. This
was addressed in #1143, but it became clear afterward that static site
generators were depending on the raw date objects that Netlify CMS was
unintentionally producing. Remaining as is or addressing the bug were
both "breaking" states, so this commit reverts to producing raw date
objects when no format is explicitly set.

It is now considered an edge case to require string dates, as most
static site generators expect to parse a raw date against formatting in
a site's templates.

Also note that this commit improves the original behavior by always
providing a date object when no format is provided, even if the user
manually changes the value.
---
 CHANGELOG.md                                  |  6 ++++
 .../EditorWidgets/Date/DateControl.js         | 28 +++++++++++++------
 website/site/content/docs/widgets/date.md     |  2 +-
 website/site/content/docs/widgets/datetime.md |  2 +-
 4 files changed, 28 insertions(+), 10 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 2e4758b15466..b57b2b3fd01e 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -5,6 +5,12 @@
     Click to see more.
   </summary>
 
+  ## v1
+
+  ---
+
+  ## v2
+  * (possibly breaking): return date object from date/datetime widgets if no format set ([@erquhart](https://github.com/erquhart) in [#1296](https://github.com/netlify/netlify-cms/pull/1296))
 </details>
 
 ## 1.8.2 (May 24, 2018)
diff --git a/src/components/EditorWidgets/Date/DateControl.js b/src/components/EditorWidgets/Date/DateControl.js
index 63d5d4365dc8..cd5c0f93ab57 100644
--- a/src/components/EditorWidgets/Date/DateControl.js
+++ b/src/components/EditorWidgets/Date/DateControl.js
@@ -20,7 +20,8 @@ export default class DateControl extends React.Component {
     includeTime: PropTypes.bool,
   };
 
-  format = this.props.field.get('format') || (this.props.includeTime ? DEFAULT_DATETIME_FORMAT : DEFAULT_DATE_FORMAT);
+  formatOutput = this.props.field.get('format');
+  formatDisplay = this.formatOutput || (this.props.includeTime ? DEFAULT_DATETIME_FORMAT : DEFAULT_DATE_FORMAT);
 
   componentDidMount() {
     const { value } = this.props;
@@ -41,22 +42,33 @@ export default class DateControl extends React.Component {
   handleChange = datetime => {
     const { onChange } = this.props;
 
-    // Set the date only if the format is valid
-    if (this.isValidDate(datetime)) {
-      const formattedValue = moment(datetime).format(this.format);
+    /**
+     * Set the date only if it is valid.
+     */
+    if (!this.isValidDate(datetime)) {
+      return;
+    }
+
+    /**
+     * Produce a formatted string only if a format is set in the config.
+     * Otherwise produce a date object.
+     */
+    if (this.formatOutput) {
+      const formattedValue = moment(datetime).format(this.formatOutput);
       onChange(formattedValue);
+    } else {
+      onChange(datetime);
     }
   };
 
   onBlur = datetime => {
-    const { setInactiveStyle, onChange } = this.props;
+    const { setInactiveStyle } = this.props;
 
     if (!this.isValidDate(datetime)) {
       const parsedDate = moment(datetime);
 
       if (parsedDate.isValid()) {
-        const formattedValue = parsedDate.format(this.format);
-        onChange(formattedValue);
+        this.handleChange(datetime);
       } else {
         window.alert('The date you entered is invalid.');
       }
@@ -67,7 +79,7 @@ export default class DateControl extends React.Component {
 
   render() {
     const { includeTime, value, classNameWrapper, setActiveStyle, setInactiveStyle } = this.props;
-    const format = this.format;
+    const format = this.formatDisplay;
     return (
       <DateTime
         timeFormat={!!includeTime}
diff --git a/website/site/content/docs/widgets/date.md b/website/site/content/docs/widgets/date.md
index 7eae7d4fb669..a962fd9f55bc 100644
--- a/website/site/content/docs/widgets/date.md
+++ b/website/site/content/docs/widgets/date.md
@@ -12,7 +12,7 @@ The date widget translates a date picker input to a date string. For saving date
 - **Data type:** Moment.js-formatted date string
 - **Options:**
   - `default`: accepts a date string, or an empty string to accept blank input; otherwise defaults to current date
-  - `format`: accepts Moment.js [tokens](https://momentjs.com/docs/#/parsing/string-format/); defaults to ISO8601 format `YYYY-MM-DD`
+  - `format`: optional; accepts Moment.js [tokens](https://momentjs.com/docs/#/parsing/string-format/); defaults to raw Date object (if supported by output format)
 - **Example:**
 
   ```yaml
diff --git a/website/site/content/docs/widgets/datetime.md b/website/site/content/docs/widgets/datetime.md
index 8e892b74a8f1..8bf02a0441a2 100644
--- a/website/site/content/docs/widgets/datetime.md
+++ b/website/site/content/docs/widgets/datetime.md
@@ -12,7 +12,7 @@ The datetime widget translates a datetime picker to a datetime string. For savin
 - **Data type:** Moment.js-formatted datetime string
 - **Options:**
   - `default`: accepts a datetime string, or an empty string to accept blank input; otherwise defaults to current datetime
-  - `format`: accepts Moment.js [tokens](https://momentjs.com/docs/#/parsing/string-format/); defaults to ISO8601 format `YYYY-MM-DDTHH:mm:ssZ`
+  - `format`: optional; accepts Moment.js [tokens](https://momentjs.com/docs/#/parsing/string-format/); defaults to raw Date object (if supported by output format)
 - **Example:**
 
   ```yaml