Skip to content

Commit 94be467

Browse files
committed
fix: allow use of tabindex
1 parent 934be6f commit 94be467

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
@@ -42,7 +42,8 @@ describe('MdSelect', () => {
4242
SelectWithErrorSibling,
4343
ThrowsErrorOnInit,
4444
BasicSelectOnPush,
45-
BasicSelectOnPushPreselected
45+
BasicSelectOnPushPreselected,
46+
SelectWithPlainTabindex
4647
],
4748
providers: [
4849
{provide: OverlayContainer, useFactory: () => {
@@ -1092,6 +1093,17 @@ describe('MdSelect', () => {
10921093
expect(select.getAttribute('tabindex')).toBe('3');
10931094
});
10941095

1096+
it('should be able to set the tabindex via the native attribute', () => {
1097+
fixture.destroy();
1098+
1099+
const plainTabindexFixture = TestBed.createComponent(SelectWithPlainTabindex);
1100+
1101+
plainTabindexFixture.detectChanges();
1102+
select = plainTabindexFixture.debugElement.query(By.css('md-select')).nativeElement;
1103+
1104+
expect(select.getAttribute('tabindex')).toBe('5');
1105+
});
1106+
10951107
it('should set aria-required for required selects', () => {
10961108
expect(select.getAttribute('aria-required'))
10971109
.toEqual('false', `Expected aria-required attr to be false for normal selects.`);
@@ -1873,6 +1885,14 @@ class MultiSelect {
18731885
@ViewChildren(MdOption) options: QueryList<MdOption>;
18741886
}
18751887

1888+
@Component({
1889+
selector: 'select-with-plain-tabindex',
1890+
template: `
1891+
<md-select tabindex="5"></md-select>
1892+
`
1893+
})
1894+
class SelectWithPlainTabindex { }
1895+
18761896

18771897
class FakeViewportRuler {
18781898
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, MdOptionSelectionChange} from '../core/option/option';
1920
import {ENTER, SPACE} from '../core/keyboard/keycodes';
@@ -152,7 +153,7 @@ export class MdSelect implements AfterContentInit, ControlValueAccessor, OnDestr
152153
private _placeholderState = '';
153154

154155
/** Tab index for the element. */
155-
private _tabIndex: number = 0;
156+
private _tabIndex: number;
156157

157158
/**
158159
* The width of the trigger. Must be saved to set the min width of the overlay panel
@@ -294,10 +295,13 @@ export class MdSelect implements AfterContentInit, ControlValueAccessor, OnDestr
294295

295296
constructor(private _element: ElementRef, private _renderer: Renderer,
296297
private _viewportRuler: ViewportRuler, private _changeDetectorRef: ChangeDetectorRef,
297-
@Optional() private _dir: Dir, @Self() @Optional() public _control: NgControl) {
298+
@Optional() private _dir: Dir, @Self() @Optional() public _control: NgControl,
299+
@Attribute('tabindex') tabIndex: string) {
298300
if (this._control) {
299301
this._control.valueAccessor = this;
300302
}
303+
304+
this._tabIndex = parseInt(tabIndex) || 0;
301305
}
302306

303307
ngAfterContentInit() {

0 commit comments

Comments
 (0)