fix(checkbox): defaulting to invalid name and value attributes (#7130)

Fixes the checkbox defaulting to `name="null"` and `value="undefined"` for the underlying input, if the user hasn't passed them in.

Author: crisbeto

src/lib/checkbox/checkbox.html

@@ -6,9 +6,9 @@
            [id]="inputId"
            [required]="required"
            [checked]="checked"
-           [value]="value"
+           [attr.value]="value"
            [disabled]="disabled"
-           [name]="name"
+           [attr.name]="name"
            [tabIndex]="tabIndex"
            [indeterminate]="indeterminate"
            [attr.aria-label]="ariaLabel"

src/lib/checkbox/checkbox.spec.ts

@@ -873,6 +873,17 @@ describe('MatCheckbox', () => {
           .not.toContain('mat-checkbox-inner-container-no-side-margin');
       }, 1);
     }));
+
+    it('should not add the "name" attribute if it is not passed in', () => {
+      fixture.detectChanges();
+      expect(checkboxInnerContainer.querySelector('input')!.hasAttribute('name')).toBe(false);
+    });
+
+    it('should not add the "value" attribute if it is not passed in', () => {
+      fixture.detectChanges();
+      expect(checkboxInnerContainer.querySelector('input')!.hasAttribute('value')).toBe(false);
+    });
+
   });
 });
 

src/lib/checkbox/checkbox.ts

@@ -169,7 +169,7 @@ export class MatCheckbox extends _MatCheckboxMixinBase implements ControlValueAc
   @Output() indeterminateChange: EventEmitter<boolean> = new EventEmitter<boolean>();
 
   /** The value attribute of the native input element */
-  @Input() value: string ;
+  @Input() value: string;
 
   /** The native `<input type="checkbox"> element */
   @ViewChild('input') _inputElement: ElementRef;