Bug 1364026 - (Part 2) Check if min and max attributes on input type date are valid date strings. r=mconley draft
authorScott Wu <scottcwwu@gmail.com>
Tue, 11 Jul 2017 13:58:04 +0800
changeset 610275 dedd970ef233e056e2941b657cf1fb82942023fd
parent 610274 82a2519f68364129c3a42a8b912452e513d07500
child 637800 3837e223e90d111684e5c690e900bbcd80b2a52b
push id68825
push userbmo:scwwu@mozilla.com
push dateTue, 18 Jul 2017 02:33:07 +0000
reviewersmconley
bugs1364026
milestone56.0a1
Bug 1364026 - (Part 2) Check if min and max attributes on input type date are valid date strings. r=mconley MozReview-Commit-ID: LX6VveJdqer
toolkit/content/browser-content.js
toolkit/content/widgets/datekeeper.js
toolkit/content/widgets/datepicker.js
--- a/toolkit/content/browser-content.js
+++ b/toolkit/content/browser-content.js
@@ -1763,18 +1763,18 @@ let DateTimePickerListener = {
           rect: this.getBoundingContentRect(this._inputElement),
           dir: this.getComputedDirection(this._inputElement),
           type: this._inputElement.type,
           detail: {
             // Pass partial value if it's available, otherwise pass input
             // element's value.
             value: Object.keys(value).length > 0 ? value
                                                  : this._inputElement.value,
-            min: this._inputElement.min,
-            max: this._inputElement.max,
+            min: this._inputElement.getMinimum(),
+            max: this._inputElement.getMaximum(),
             step: this._inputElement.getStep(),
             stepBase: this._inputElement.getStepBase(),
           },
         });
         break;
       }
       case "MozUpdateDateTimePicker": {
         let value = this._inputElement.getDateTimeInputBoxValue();
--- a/toolkit/content/widgets/datekeeper.js
+++ b/toolkit/content/widgets/datekeeper.js
@@ -11,19 +11,21 @@ function DateKeeper(props) {
   this.init(props);
 }
 
 {
   const DAYS_IN_A_WEEK = 7,
         MONTHS_IN_A_YEAR = 12,
         YEAR_VIEW_SIZE = 200,
         YEAR_BUFFER_SIZE = 10,
-        // The min and max values are derived from the ECMAScript spec:
+        // The min value is 0001-01-01 based on HTML spec:
+        // https://html.spec.whatwg.org/#valid-date-string
+        MIN_DATE = -62135596800000,
+        // The max value is derived from the ECMAScript spec:
         // http://ecma-international.org/ecma-262/5.1/#sec-15.9.1.1
-        MIN_DATE = -8640000000000000,
         MAX_DATE = 8640000000000000;
 
   DateKeeper.prototype = {
     get year() {
       return this.state.dateObj.getUTCFullYear();
     },
 
     get month() {
@@ -38,32 +40,33 @@ function DateKeeper(props) {
       return this.state.selection;
     },
 
     /**
      * Initialize DateKeeper
      * @param  {Number} year
      * @param  {Number} month
      * @param  {Number} day
-     * @param  {String} min
-     * @param  {String} max
+     * @param  {Number} min
+     * @param  {Number} max
      * @param  {Number} step
      * @param  {Number} stepBase
      * @param  {Number} firstDayOfWeek
      * @param  {Array<Number>} weekends
      * @param  {Number} calViewSize
      */
     init({ year, month, day, min, max, step, stepBase, firstDayOfWeek = 0, weekends = [0], calViewSize = 42 }) {
       const today = new Date();
       const isDateSet = year != undefined && month != undefined && day != undefined;
 
       this.state = {
         step, firstDayOfWeek, weekends, calViewSize,
-        min: new Date(min != undefined ? min : MIN_DATE),
-        max: new Date(max != undefined ? max : MAX_DATE),
+        // min & max are NaN if empty or invalid
+        min: new Date(Number.isNaN(min) ? MIN_DATE : min),
+        max: new Date(Number.isNaN(max) ? MAX_DATE : max),
         stepBase: new Date(stepBase),
         today: this._newUTCDate(today.getFullYear(), today.getMonth(), today.getDate()),
         weekHeaders: this._getWeekHeaders(firstDayOfWeek, weekends),
         years: [],
         months: [],
         days: [],
         selection: { year, month, day },
       };
--- a/toolkit/content/widgets/datepicker.js
+++ b/toolkit/content/widgets/datepicker.js
@@ -19,18 +19,18 @@ function DatePicker(context) {
   DatePicker.prototype = {
     /**
      * Initializes the date picker. Set the default states and properties.
      * @param  {Object} props
      *         {
      *           {Number} year [optional]
      *           {Number} month [optional]
      *           {Number} date [optional]
-     *           {String} min
-     *           {String} max
+     *           {Number} min
+     *           {Number} max
      *           {Number} step
      *           {Number} stepBase
      *           {Number} firstDayOfWeek
      *           {Array<Number>} weekends
      *           {Array<String>} monthStrings
      *           {Array<String>} weekdayStrings
      *           {String} locale [optional]: User preferred locale
      *         }