Skip to content
This repository has been archived by the owner on Sep 5, 2024. It is now read-only.

Commit

Permalink
fix(calendar): fix broken unit tests for component rename and focus
Browse files Browse the repository at this point in the history
changes.
  • Loading branch information
jelbourn committed Aug 13, 2015
1 parent 733431b commit a3786ce
Show file tree
Hide file tree
Showing 4 changed files with 31 additions and 26 deletions.
2 changes: 1 addition & 1 deletion src/components/calendar/calendar.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@


// PRE RELEASE
// TODO(jelbourn): read-only state.
// TODO(jelbourn): Date "isComplete" logic
// TODO(jelbourn): Fix NVDA stealing key presses (IE) ???

Expand All @@ -26,6 +25,7 @@
// TODO(jelbourn): Previous month opacity is lowered when partially scrolled out of view.
// TODO(jelbourn): Support md-calendar standalone on a page (as a tabstop w/ aria-live
// announcement and key handling).
// Read-only calendar (not just date-picker).

// COULD GO EITHER WAY
// TODO(jelbourn): Clicking on the month label opens the month-picker.
Expand Down
48 changes: 26 additions & 22 deletions src/components/calendar/calendar.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -87,6 +87,10 @@ describe('md-calendar', function() {
});
}

function getFocusedDateElement() {
return element.querySelector('.md-focus');
}

beforeEach(module('material.components.calendar', 'ngAnimateMock'));

beforeEach(inject(function($injector) {
Expand Down Expand Up @@ -221,48 +225,48 @@ describe('md-calendar', function() {
selectedDate.focus();

dispatchKeyEvent(keyCodes.LEFT_ARROW);
expect(document.activeElement.textContent).toBe('10');
expect(getMonthLabelForDateCell(document.activeElement)).toBe('Feb 2014');
expect(getFocusedDateElement().textContent).toBe('10');
expect(getMonthLabelForDateCell(getFocusedDateElement())).toBe('Feb 2014');

dispatchKeyEvent(keyCodes.UP_ARROW);
expect(document.activeElement.textContent).toBe('3');
expect(getMonthLabelForDateCell(document.activeElement)).toBe('Feb 2014');
expect(getFocusedDateElement().textContent).toBe('3');
expect(getMonthLabelForDateCell(getFocusedDateElement())).toBe('Feb 2014');

dispatchKeyEvent(keyCodes.RIGHT_ARROW);
expect(document.activeElement.textContent).toBe('4');
expect(getMonthLabelForDateCell(document.activeElement)).toBe('Feb 2014');
expect(getFocusedDateElement().textContent).toBe('4');
expect(getMonthLabelForDateCell(getFocusedDateElement())).toBe('Feb 2014');

dispatchKeyEvent(keyCodes.DOWN_ARROW);
expect(document.activeElement.textContent).toBe('11');
expect(getMonthLabelForDateCell(document.activeElement)).toBe('Feb 2014');
expect(getFocusedDateElement().textContent).toBe('11');
expect(getMonthLabelForDateCell(getFocusedDateElement())).toBe('Feb 2014');

dispatchKeyEvent(keyCodes.HOME);
expect(document.activeElement.textContent).toBe('1');
expect(getMonthLabelForDateCell(document.activeElement)).toBe('Feb 2014');
expect(getFocusedDateElement().textContent).toBe('1');
expect(getMonthLabelForDateCell(getFocusedDateElement())).toBe('Feb 2014');

dispatchKeyEvent(keyCodes.END);
expect(document.activeElement.textContent).toBe('28');
expect(getMonthLabelForDateCell(document.activeElement)).toBe('Feb 2014');
expect(getFocusedDateElement().textContent).toBe('28');
expect(getMonthLabelForDateCell(getFocusedDateElement())).toBe('Feb 2014');

dispatchKeyEvent(keyCodes.RIGHT_ARROW);
expect(document.activeElement.textContent).toBe('1');
expect(getMonthLabelForDateCell(document.activeElement)).toBe('Mar 2014');
expect(getFocusedDateElement().textContent).toBe('1');
expect(getMonthLabelForDateCell(getFocusedDateElement())).toBe('Mar 2014');

dispatchKeyEvent(keyCodes.PAGE_UP);
expect(document.activeElement.textContent).toBe('1');
expect(getMonthLabelForDateCell(document.activeElement)).toBe('Feb 2014');
expect(getFocusedDateElement().textContent).toBe('1');
expect(getMonthLabelForDateCell(getFocusedDateElement())).toBe('Feb 2014');

dispatchKeyEvent(keyCodes.PAGE_DOWN);
expect(document.activeElement.textContent).toBe('1');
expect(getMonthLabelForDateCell(document.activeElement)).toBe('Mar 2014');
expect(getFocusedDateElement().textContent).toBe('1');
expect(getMonthLabelForDateCell(getFocusedDateElement())).toBe('Mar 2014');

dispatchKeyEvent(keyCodes.UP_ARROW, {meta: true});
expect(document.activeElement.textContent).toBe('1');
expect(getMonthLabelForDateCell(document.activeElement)).toBe('Feb 2014');
expect(getFocusedDateElement().textContent).toBe('1');
expect(getMonthLabelForDateCell(getFocusedDateElement())).toBe('Feb 2014');

dispatchKeyEvent(keyCodes.DOWN_ARROW, {meta: true});
expect(document.activeElement.textContent).toBe('1');
expect(getMonthLabelForDateCell(document.activeElement)).toBe('Mar 2014');
expect(getFocusedDateElement().textContent).toBe('1');
expect(getMonthLabelForDateCell(getFocusedDateElement())).toBe('Mar 2014');

dispatchKeyEvent(keyCodes.ENTER);
applyDateChange();
Expand Down
3 changes: 2 additions & 1 deletion src/components/calendar/datePicker.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,12 +4,13 @@
// PRE RELEASE
// TODO(jelbourn): Documentation
// TODO(jelbourn): Demo that uses moment.js

// TODO(jelbourn): aria attributes tying together date input and floating calendar.
// TODO(jelbourn): make sure this plays well with validation and ngMessages.
// TODO(jelbourn): forward more attributes to the internal input (required, autofocus, etc.)
// TODO(jelbourn): auto-grow input to accomodate longer dates

// POST RELEASE
// TODO(jelbourn): forward more attributes to the internal input (required, autofocus, etc.)
// TODO(jelbourn): error state
// TODO(jelbourn): something better for mobile (calendar panel takes up entire screen?)
// TODO(jelbourn): input behavior (masking? auto-complete?)
Expand Down
4 changes: 2 additions & 2 deletions src/components/calendar/datePicker.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,12 +24,12 @@ describe('md-date-picker', function() {
pageScope.myDate = initialDate;
pageScope.isDisabled = false;

var template = '<md-date-picker ng-model="myDate" ng-disabled="isDisabled"></md-date-picker>';
var template = '<md-datepicker ng-model="myDate" ng-disabled="isDisabled"></md-datepicker>';
ngElement = $compile(template)(pageScope);
$rootScope.$apply();

scope = ngElement.scope();
controller = ngElement.controller('mdDatePicker');
controller = ngElement.controller('mdDatepicker');
element = ngElement[0];
}));

Expand Down

0 comments on commit a3786ce

Please sign in to comment.