fix(chips): only add type attribute to button remove icons

src/material-experimental/mdc-chips/chip-icons.ts

@@ -112,9 +112,6 @@ const _MatChipRemoveMixinBase:
     '(click)': 'interaction.next($event)',
     '(keydown)': 'interaction.next($event)',
 
-    // Prevent accidental form submissions.
-    'type': 'button',
-
     // We need to remove this explicitly, because it gets inherited from MatChipTrailingIcon.
     '[attr.aria-hidden]': 'null',
   }
@@ -126,8 +123,12 @@ export class MatChipRemove extends _MatChipRemoveMixinBase implements CanDisable
    */
   interaction: Subject<MouseEvent | KeyboardEvent> = new Subject<MouseEvent | KeyboardEvent>();
 
-  constructor(_elementRef: ElementRef) {
-    super(_elementRef);
+  constructor(elementRef: ElementRef) {
+    super(elementRef);
+
+    if (elementRef.nativeElement.nodeName === 'BUTTON') {
+      elementRef.nativeElement.setAttribute('type', 'button');
+    }
   }
 
   static ngAcceptInputType_disabled: BooleanInput;

src/material-experimental/mdc-chips/chip-remove.spec.ts

@@ -49,6 +49,12 @@ describe('MDC-based Chip Remove', () => {
       expect(buttonElement.getAttribute('type')).toBe('button');
     });
 
+    it('should not set the `type` attribute on non-button elements', () => {
+      const buttonElement = chipNativeElement.querySelector('span.mat-mdc-chip-remove')!;
+
+      expect(buttonElement.hasAttribute('type')).toBe(false);
+    });
+
     it('should start MDC exit animation on click', () => {
       let buttonElement = chipNativeElement.querySelector('button')!;
 
@@ -158,7 +164,10 @@ describe('MDC-based Chip Remove', () => {
     <mat-chip
       [removable]="removable"
       [disabled]="disabled"
-      (removed)="didRemove()"><button matChipRemove></button></mat-chip>
+      (removed)="didRemove()">
+      <button matChipRemove></button>
+      <span matChipRemove></span>
+    </mat-chip>
   `
 })
 class TestChip {

src/material/chips/chip-remove.spec.ts

@@ -42,6 +42,12 @@ describe('Chip Remove', () => {
       expect(buttonElement.getAttribute('type')).toBe('button');
     });
 
+    it('should not set the `type` attribute on non-button elements', () => {
+      const buttonElement = chipNativeElement.querySelector('span.mat-chip-remove')!;
+
+      expect(buttonElement.hasAttribute('type')).toBe(false);
+    });
+
     it('should emits (removed) on click', () => {
       let buttonElement = chipNativeElement.querySelector('button')!;
 
@@ -79,7 +85,10 @@ describe('Chip Remove', () => {
     <mat-chip
       [removable]="removable"
       [disabled]="disabled"
-      (removed)="didRemove()"><button matChipRemove></button></mat-chip>
+      (removed)="didRemove()">
+      <button matChipRemove></button>
+      <span matChipRemove></span>
+    </mat-chip>
   `
 })
 class TestChip {

src/material/chips/chip.ts

@@ -422,13 +422,19 @@ export class MatChip extends _MatChipMixinBase implements FocusableOption, OnDes
   host: {
     'class': 'mat-chip-remove mat-chip-trailing-icon',
     '(click)': '_handleClick($event)',
-
-    // Prevent accidental form submissions.
-    'type': 'button',
   }
 })
 export class MatChipRemove {
-  constructor(protected _parentChip: MatChip) {}
+  constructor(
+    protected _parentChip: MatChip,
+    // @breaking-change 11.0.0 `elementRef` parameter to be made required.
+    elementRef?: ElementRef<HTMLElement>) {
+
+      // @breaking-change 11.0.0 Remove null check for `elementRef`.
+    if (elementRef && elementRef.nativeElement.nodeName === 'BUTTON') {
+      elementRef.nativeElement.setAttribute('type', 'button');
+    }
+   }
 
   /** Calls the parent chip's public `remove()` method if applicable. */
   _handleClick(event: Event): void {

tools/public_api_guard/material/chips.d.ts

@@ -182,7 +182,7 @@ export declare class MatChipListChange {
 
 export declare class MatChipRemove {
     protected _parentChip: MatChip;
-    constructor(_parentChip: MatChip);
+    constructor(_parentChip: MatChip, elementRef?: ElementRef<HTMLElement>);
     _handleClick(event: Event): void;
     static ɵdir: i0.ɵɵDirectiveDefWithMeta<MatChipRemove, "[matChipRemove]", never, {}, {}, never>;
     static ɵfac: i0.ɵɵFactoryDef<MatChipRemove>;