diff --git a/src/lib/slider/slider.spec.ts b/src/lib/slider/slider.spec.ts index dce81bc7defe..8bb7c99dd3de 100644 --- a/src/lib/slider/slider.spec.ts +++ b/src/lib/slider/slider.spec.ts @@ -16,6 +16,7 @@ import { dispatchFakeEvent, dispatchKeyboardEvent, dispatchMouseEvent, + createKeyboardEvent, } from '@angular/cdk/testing'; import {Component, DebugElement, Type, ViewChild} from '@angular/core'; import {ComponentFixture, fakeAsync, flush, TestBed} from '@angular/core/testing'; @@ -995,7 +996,7 @@ describe('MatSlider', () => { expect(sliderInstance.value).toBe(0); }); - it(`should take not action for presses of keys it doesn't care about`, () => { + it(`should take no action for presses of keys it doesn't care about`, () => { sliderInstance.value = 50; expect(testComponent.onChange).not.toHaveBeenCalled(); @@ -1008,6 +1009,26 @@ describe('MatSlider', () => { expect(testComponent.onChange).not.toHaveBeenCalled(); expect(sliderInstance.value).toBe(50); }); + + it('should ignore events modifier keys', () => { + sliderInstance.value = 0; + + [ + UP_ARROW, DOWN_ARROW, RIGHT_ARROW, + LEFT_ARROW, PAGE_DOWN, PAGE_UP, HOME, END + ].forEach(key => { + const event = createKeyboardEvent('keydown', key); + Object.defineProperty(event, 'altKey', {get: () => true}); + dispatchEvent(sliderNativeElement, event); + fixture.detectChanges(); + expect(event.defaultPrevented).toBe(false); + }); + + expect(testComponent.onInput).not.toHaveBeenCalled(); + expect(testComponent.onChange).not.toHaveBeenCalled(); + expect(sliderInstance.value).toBe(0); + }); + }); describe('slider with direction and invert', () => { diff --git a/src/lib/slider/slider.ts b/src/lib/slider/slider.ts index e95aa7157630..67cc25052160 100644 --- a/src/lib/slider/slider.ts +++ b/src/lib/slider/slider.ts @@ -18,6 +18,7 @@ import { PAGE_UP, RIGHT_ARROW, UP_ARROW, + hasModifierKey, } from '@angular/cdk/keycodes'; import { Attribute, @@ -582,9 +583,11 @@ export class MatSlider extends _MatSliderMixinBase } _onKeydown(event: KeyboardEvent) { - if (this.disabled) { return; } + if (this.disabled || hasModifierKey(event)) { + return; + } - let oldValue = this.value; + const oldValue = this.value; switch (event.keyCode) { case PAGE_UP: