From 501faa9a547c043e8abef5cb75acca930f31fa2e Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@users.noreply.github.com>
Date: Fri, 18 Oct 2024 15:36:52 +0200
Subject: [PATCH] fix(material/chips): emitting end event multiple times when
 holding down key (#29894)

Fixes that that the chip input was emitting the `matChipEnd` event while the user is holding down the separator key.

Fixes #29883.

(cherry picked from commit 5153a5cd4bdd69649f07ba6596cad56bfd9eb2b1)
---
 src/material/chips/chip-input.spec.ts | 20 +++++++++++++++++++-
 src/material/chips/chip-input.ts      |  2 +-
 2 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/src/material/chips/chip-input.spec.ts b/src/material/chips/chip-input.spec.ts
index 049bcd3819f3..b5b8c6752165 100644
--- a/src/material/chips/chip-input.spec.ts
+++ b/src/material/chips/chip-input.spec.ts
@@ -1,7 +1,11 @@
 import {Directionality} from '@angular/cdk/bidi';
 import {COMMA, ENTER, TAB} from '@angular/cdk/keycodes';
 import {PlatformModule} from '@angular/cdk/platform';
-import {dispatchKeyboardEvent} from '@angular/cdk/testing/private';
+import {
+  createKeyboardEvent,
+  dispatchKeyboardEvent,
+  dispatchEvent,
+} from '@angular/cdk/testing/private';
 import {Component, DebugElement, ViewChild} from '@angular/core';
 import {ComponentFixture, TestBed, fakeAsync, flush, waitForAsync} from '@angular/core/testing';
 import {MatFormFieldModule} from '@angular/material/form-field';
@@ -248,6 +252,20 @@ describe('MatChipInput', () => {
 
       expect(inputNativeElement.getAttribute('aria-describedby')).toBeNull();
     }));
+
+    it('should not emit chipEnd if the key is repeated', () => {
+      spyOn(testChipInput, 'add');
+
+      chipInputDirective.separatorKeyCodes = [COMMA];
+      fixture.detectChanges();
+
+      const event = createKeyboardEvent('keydown', COMMA);
+      Object.defineProperty(event, 'repeat', {get: () => true});
+      dispatchEvent(inputNativeElement, event);
+      fixture.detectChanges();
+
+      expect(testChipInput.add).not.toHaveBeenCalled();
+    });
   });
 });
 
diff --git a/src/material/chips/chip-input.ts b/src/material/chips/chip-input.ts
index 6f39cbdb906c..7febba791fd7 100644
--- a/src/material/chips/chip-input.ts
+++ b/src/material/chips/chip-input.ts
@@ -182,7 +182,7 @@ export class MatChipInput implements MatChipTextControl, OnChanges, OnDestroy {
 
   /** Checks to see if the (chipEnd) event needs to be emitted. */
   _emitChipEnd(event?: KeyboardEvent) {
-    if (!event || this._isSeparatorKey(event)) {
+    if (!event || (this._isSeparatorKey(event) && !event.repeat)) {
       this.chipEnd.emit({
         input: this.inputElement,
         value: this.inputElement.value,