Skip to content

Commit 783d079

Browse files
committed
fix: allow use of tabindex
1 parent 25d0127 commit 783d079

File tree

2 files changed

+27
-3
lines changed

2 files changed

+27
-3
lines changed

src/lib/select/select.spec.ts

Lines changed: 21 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,8 @@ describe('MdSelect', () => {
4040
SelectWithErrorSibling,
4141
ThrowsErrorOnInit,
4242
BasicSelectOnPush,
43-
BasicSelectOnPushPreselected
43+
BasicSelectOnPushPreselected,
44+
SelectWithPlainTabindex
4445
],
4546
providers: [
4647
{provide: OverlayContainer, useFactory: () => {
@@ -1046,6 +1047,17 @@ describe('MdSelect', () => {
10461047
expect(select.getAttribute('tabindex')).toBe('3');
10471048
});
10481049

1050+
it('should be able to set the tabindex via the native attribute', () => {
1051+
fixture.destroy();
1052+
1053+
const plainTabindexFixture = TestBed.createComponent(SelectWithPlainTabindex);
1054+
1055+
plainTabindexFixture.detectChanges();
1056+
select = plainTabindexFixture.debugElement.query(By.css('md-select')).nativeElement;
1057+
1058+
expect(select.getAttribute('tabindex')).toBe('5');
1059+
});
1060+
10491061
it('should set aria-required for required selects', () => {
10501062
expect(select.getAttribute('aria-required'))
10511063
.toEqual('false', `Expected aria-required attr to be false for normal selects.`);
@@ -1627,6 +1639,14 @@ class FloatPlaceholderSelect {
16271639
@ViewChild(MdSelect) select: MdSelect;
16281640
}
16291641

1642+
@Component({
1643+
selector: 'select-with-plain-tabindex',
1644+
template: `
1645+
<md-select tabindex="5"></md-select>
1646+
`
1647+
})
1648+
class SelectWithPlainTabindex { }
1649+
16301650

16311651
class FakeViewportRuler {
16321652
getViewportRect() {

src/lib/select/select.ts

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import {
1414
ViewEncapsulation,
1515
ViewChild,
1616
ChangeDetectorRef,
17+
Attribute,
1718
} from '@angular/core';
1819
import {MdOption, MdOptionSelectEvent} from '../core/option/option';
1920
import {ENTER, SPACE} from '../core/keyboard/keycodes';
@@ -134,7 +135,7 @@ export class MdSelect implements AfterContentInit, ControlValueAccessor, OnDestr
134135
private _placeholderState = '';
135136

136137
/** Tab index for the element. */
137-
private _tabIndex: number = 0;
138+
private _tabIndex: number;
138139

139140
/**
140141
* The width of the trigger. Must be saved to set the min width of the overlay panel
@@ -260,10 +261,13 @@ export class MdSelect implements AfterContentInit, ControlValueAccessor, OnDestr
260261

261262
constructor(private _element: ElementRef, private _renderer: Renderer,
262263
private _viewportRuler: ViewportRuler, private _changeDetectorRef: ChangeDetectorRef,
263-
@Optional() private _dir: Dir, @Self() @Optional() public _control: NgControl) {
264+
@Optional() private _dir: Dir, @Self() @Optional() public _control: NgControl,
265+
@Attribute('tabindex') tabIndex: string) {
264266
if (this._control) {
265267
this._control.valueAccessor = this;
266268
}
269+
270+
this._tabIndex = parseInt(tabIndex) || 0;
267271
}
268272

269273
ngAfterContentInit() {

0 commit comments

Comments
 (0)