From 20a09301e95032321d037c77b8216c6d6b72a490 Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@users.noreply.github.com>
Date: Tue, 14 May 2019 18:57:51 +0200
Subject: [PATCH] fix(chips): able to remove disabled chip via remove button
 (#15732)

Fixes users being able to remove disabled chips by clicking on their remove button.

Fixes #15708.
---
 src/material/chips/chip-remove.spec.ts | 31 +++++++++++++++++++++-----
 src/material/chips/chip.ts             |  6 +++--
 2 files changed, 30 insertions(+), 7 deletions(-)

diff --git a/src/material/chips/chip-remove.spec.ts b/src/material/chips/chip-remove.spec.ts
index 7e7dc1f6404a..3ad3a83ac309 100644
--- a/src/material/chips/chip-remove.spec.ts
+++ b/src/material/chips/chip-remove.spec.ts
@@ -31,33 +31,54 @@ describe('Chip Remove', () => {
 
   describe('basic behavior', () => {
     it('should applies the `mat-chip-remove` CSS class', () => {
-      let hrefElement = chipNativeElement.querySelector('a')!;
+      let buttonElement = chipNativeElement.querySelector('button')!;
 
-      expect(hrefElement.classList).toContain('mat-chip-remove');
+      expect(buttonElement.classList).toContain('mat-chip-remove');
     });
 
     it('should emits (removed) on click', () => {
-      let hrefElement = chipNativeElement.querySelector('a')!;
+      let buttonElement = chipNativeElement.querySelector('button')!;
 
       testChip.removable = true;
       fixture.detectChanges();
 
       spyOn(testChip, 'didRemove');
 
-      hrefElement.click();
+      buttonElement.click();
+      fixture.detectChanges();
 
       expect(testChip.didRemove).toHaveBeenCalled();
     });
+
+    it('should not remove if parent chip is disabled', () => {
+      let buttonElement = chipNativeElement.querySelector('button')!;
+
+      testChip.disabled = true;
+      testChip.removable = true;
+      fixture.detectChanges();
+
+      spyOn(testChip, 'didRemove');
+
+      buttonElement.click();
+      fixture.detectChanges();
+
+      expect(testChip.didRemove).not.toHaveBeenCalled();
+    });
+
   });
 });
 
 @Component({
   template: `
-    <mat-chip [removable]="removable" (removed)="didRemove()"><a matChipRemove></a></mat-chip>
+    <mat-chip
+      [removable]="removable"
+      [disabled]="disabled"
+      (removed)="didRemove()"><button matChipRemove></button></mat-chip>
   `
 })
 class TestChip {
   removable: boolean;
+  disabled = false;
 
   didRemove() {}
 }
diff --git a/src/material/chips/chip.ts b/src/material/chips/chip.ts
index a60323382d1f..0d045cc2d463 100644
--- a/src/material/chips/chip.ts
+++ b/src/material/chips/chip.ts
@@ -394,8 +394,10 @@ export class MatChipRemove {
 
   /** Calls the parent chip's public `remove()` method if applicable. */
   _handleClick(event: Event): void {
-    if (this._parentChip.removable) {
-      this._parentChip.remove();
+    const parentChip = this._parentChip;
+
+    if (parentChip.removable && !parentChip.disabled) {
+      parentChip.remove();
     }
 
     // We need to stop event propagation because otherwise the event will bubble up to the