diff --git a/src/material/datepicker/calendar-body.html b/src/material/datepicker/calendar-body.html index 04d4c1667577..d41991ddc2ea 100644 --- a/src/material/datepicker/calendar-body.html +++ b/src/material/datepicker/calendar-body.html @@ -42,6 +42,7 @@ [style.paddingTop]="_cellPadding" [style.paddingBottom]="_cellPadding">
{{item.displayValue}} diff --git a/src/material/datepicker/calendar-body.spec.ts b/src/material/datepicker/calendar-body.spec.ts index dad5f9c6aa4a..9918af58c132 100644 --- a/src/material/datepicker/calendar-body.spec.ts +++ b/src/material/datepicker/calendar-body.spec.ts @@ -1,5 +1,5 @@ import {async, ComponentFixture, TestBed} from '@angular/core/testing'; -import {Component} from '@angular/core'; +import {Component, DebugElement} from '@angular/core'; import {MatCalendarBody, MatCalendarCell, MatCalendarCellCssClasses} from './calendar-body'; import {By} from '@angular/platform-browser'; @@ -21,6 +21,7 @@ describe('MatCalendarBody', () => { describe('standard calendar body', () => { let fixture: ComponentFixture; let testComponent: StandardCalendarBody; + let calendarBodyDebugElement: DebugElement; let calendarBodyNativeElement: Element; let rowEls: Element[]; let labelEls: Element[]; @@ -36,7 +37,7 @@ describe('MatCalendarBody', () => { fixture = TestBed.createComponent(StandardCalendarBody); fixture.detectChanges(); - const calendarBodyDebugElement = fixture.debugElement.query(By.directive(MatCalendarBody)); + calendarBodyDebugElement = fixture.debugElement.query(By.directive(MatCalendarBody)); calendarBodyNativeElement = calendarBodyDebugElement.nativeElement; testComponent = fixture.componentInstance; @@ -49,6 +50,14 @@ describe('MatCalendarBody', () => { expect(cellEls.length).toBe(14); }); + it('sets all mat-calendar-body-cell-content role attribute to button', () => { + const contentCells = calendarBodyDebugElement + .queryAll(By.css('.mat-calendar-body-cell-content')) + .map(button => button.nativeElement); + expect(contentCells.every((button: any) => button.getAttribute('role') === 'button')) + .toBe(true, 'to see role="button" on every element'); + }); + it('highlights today', () => { const todayCell = calendarBodyNativeElement.querySelector('.mat-calendar-body-today')!; expect(todayCell).not.toBeNull();