Fix Date Format (#841)

app/scripts/directives/datepicker.js

@@ -14,9 +14,16 @@ angular
       },
       controller: function ($timeout, $scope) {
         $scope.updateTimeStamp = function (timestamp) {
+          //For Graduation date question, set the day to 1. The API needs the day but that could change in the future.
+          timestamp = $scope.monthYearOnly
+            ? moment(new Date(timestamp)).set('date', 1)
+            : timestamp;
           $scope.$apply(function () {
+            let dateSaveFormat = $scope.monthYearOnly
+              ? 'YYYY-MM-DD'
+              : 'YYYY-MM-DD HH:mm:ss';
             $scope.localModel = moment(new Date(timestamp)).format(
-              'YYYY-MM-DD HH:mm:ss',
+              dateSaveFormat,
             );
           });
         };
@@ -29,7 +36,7 @@ angular
             : scope.localModel
             ? moment(new Date(scope.localModel)).format('MM/DD/YYYY hh:mm A')
             : null;
-        let dateOptions = scope.monthYearOnly
+        scope.dateOptions = scope.monthYearOnly
           ? {
               viewMode: 'years',
               format: 'MMMM YYYY',
@@ -50,7 +57,7 @@ angular
               defaultDate: initialDate,
             };
         datePickerElement
-          .datetimepicker(dateOptions)
+          .datetimepicker(scope.dateOptions)
           .on('dp.change', function (ev) {
             scope.updateTimeStamp(ev.date);
           });

app/views/components/answerDisplay.html

@@ -28,4 +28,8 @@
     - {{answer.amount |
     localizedCurrency:conference.currency.currencyCode}}</span
   >
+  <!--Remove slice when API can handle receiving YYYY-MM format-->
+  <span ng-switch-when="graduationDateQuestion">
+    {{answer.value.slice(0,-3)}}</span
+  >
 </ng-switch>

test/spec/directives/datepicker.spec.js

@@ -0,0 +1,36 @@
+import 'angular-mocks';
+
+describe('Directive: datepicker', function () {
+  beforeEach(angular.mock.module('confRegistrationWebApp'));
+
+  var element, scope, $compile, $rootScope;
+  beforeEach(inject(function (_$compile_, _$rootScope_, $templateCache) {
+    $compile = _$compile_;
+    $rootScope = _$rootScope_;
+
+    scope = $rootScope.$new();
+    $templateCache.put('views/components/graduationDateQuestion.html', '');
+    scope.monthYearOnly = true;
+    element = $compile(
+      '<crs-datetimepicker model="answer.value" month-year-only="true"></crs-datetimepicker>',
+    )(scope);
+    scope.$digest();
+    scope = element.isolateScope() || element.scope();
+  }));
+
+  it('Sets the date to the correct format based on the type of date question', function () {
+    scope.updateTimeStamp(new Date('02/05/1994'));
+
+    expect(scope.localModel).toBe('1994-02-01');
+
+    scope.monthYearOnly = false;
+
+    scope.updateTimeStamp(new Date('02/05/1994'));
+
+    expect(scope.localModel).toBe('1994-02-05 00:00:00');
+  });
+
+  it('Sets date options correctly based on type of date', function () {
+    expect(scope.dateOptions.viewMode).toBe('years');
+  });
+});