fix: enforce multiline selectors use backtick (#6386)

* fix: enforce multiline selectors use backtick

* add checkbox validator

Author: andrewseguin

src/lib/autocomplete/autocomplete-trigger.ts

@@ -97,8 +97,8 @@ export function getMdAutocompleteMissingPanelError(): Error {
 }
 
 @Directive({
-  selector: 'input[mdAutocomplete], input[matAutocomplete],' +
-            'textarea[mdAutocomplete], textarea[matAutocomplete]',
+  selector: `input[mdAutocomplete], input[matAutocomplete],
+             textarea[mdAutocomplete], textarea[matAutocomplete]`,
   host: {
     'role': 'combobox',
     'autocomplete': 'off',

src/lib/button/button.ts

@@ -112,10 +112,10 @@ export const _MdButtonMixinBase = mixinColor(mixinDisabled(mixinDisableRipple(Md
  */
 @Component({
   moduleId: module.id,
-  selector: 'button[md-button], button[md-raised-button], button[md-icon-button],' +
-            'button[md-fab], button[md-mini-fab],' +
-            'button[mat-button], button[mat-raised-button], button[mat-icon-button],' +
-            'button[mat-fab], button[mat-mini-fab]',
+  selector: `button[md-button], button[md-raised-button], button[md-icon-button],
+             button[md-fab], button[md-mini-fab],
+             button[mat-button], button[mat-raised-button], button[mat-icon-button],
+             button[mat-fab], button[mat-mini-fab]`,
   host: {
     '[disabled]': 'disabled || null',
   },

src/lib/card/card.ts

@@ -30,8 +30,8 @@ export class MdCardContent {}
  * @docs-private
  */
 @Directive({
-  selector: 'md-card-title, mat-card-title, [md-card-title], [mat-card-title],' +
-  '[mdCardTitle], [matCardTitle]',
+  selector: `md-card-title, mat-card-title, [md-card-title], [mat-card-title],
+             [mdCardTitle], [matCardTitle]`,
   host: {
     'class': 'mat-card-title'
   }
@@ -43,8 +43,8 @@ export class MdCardTitle {}
  * @docs-private
  */
 @Directive({
-  selector: 'md-card-subtitle, mat-card-subtitle, [md-card-subtitle], [mat-card-subtitle],' +
-  '[mdCardSubtitle], [matCardSubtitle]',
+  selector: `md-card-subtitle, mat-card-subtitle, [md-card-subtitle], [mat-card-subtitle],
+             [mdCardSubtitle], [matCardSubtitle]`,
   host: {
     'class': 'mat-card-subtitle'
   }

src/lib/checkbox/checkbox-required-validator.ts

@@ -30,11 +30,10 @@ export const MD_CHECKBOX_REQUIRED_VALIDATOR: Provider = {
  * work with `md-checkbox`.
  */
 @Directive({
-  selector:
-  'md-checkbox[required][formControlName],' +
-  'mat-checkbox[required][formControlName],' +
-  'md-checkbox[required][formControl],md-checkbox[required][ngModel],' +
-  'mat-checkbox[required][formControl],mat-checkbox[required][ngModel]',
+  selector: `md-checkbox[required][formControlName],
+             mat-checkbox[required][formControlName],
+             md-checkbox[required][formControl], md-checkbox[required][ngModel],
+             mat-checkbox[required][formControl], mat-checkbox[required][ngModel]`,
   providers: [MD_CHECKBOX_REQUIRED_VALIDATOR],
   host: {'[attr.required]': 'required ? "" : null'}
 })

src/lib/dialog/dialog-content-directives.ts

@@ -17,8 +17,8 @@ let dialogElementUid = 0;
  * Button that will close the current dialog.
  */
 @Directive({
-  selector: 'button[md-dialog-close], button[mat-dialog-close],' +
-            'button[mdDialogClose], button[matDialogClose]',
+  selector: `button[md-dialog-close], button[mat-dialog-close],
+             button[mdDialogClose], button[matDialogClose]`,
   host: {
     '(click)': 'dialogRef.close(dialogResult)',
     '[attr.aria-label]': 'ariaLabel',
@@ -75,8 +75,8 @@ export class MdDialogTitle implements OnInit {
  * Scrollable content container of a dialog.
  */
 @Directive({
-  selector: '[md-dialog-content], md-dialog-content, [mat-dialog-content], mat-dialog-content,' +
-            '[mdDialogContent], [matDialogContent]',
+  selector: `[md-dialog-content], md-dialog-content, [mat-dialog-content], mat-dialog-content,
+             [mdDialogContent], [matDialogContent]`,
   host: {'class': 'mat-dialog-content'}
 })
 export class MdDialogContent { }
@@ -87,8 +87,8 @@ export class MdDialogContent { }
  * Stays fixed to the bottom when scrolling.
  */
 @Directive({
-  selector: '[md-dialog-actions], md-dialog-actions, [mat-dialog-actions], mat-dialog-actions,' +
-            '[mdDialogActions], [matDialogActions]',
+  selector: `[md-dialog-actions], md-dialog-actions, [mat-dialog-actions], mat-dialog-actions,
+             [mdDialogActions], [matDialogActions]`,
   host: {'class': 'mat-dialog-actions'}
 })
 export class MdDialogActions { }

src/lib/input/autosize.ts

@@ -15,8 +15,8 @@ import {Platform} from '@angular/cdk/platform';
  * Directive to automatically resize a textarea to fit its content.
  */
 @Directive({
-  selector: 'textarea[md-autosize], textarea[mdTextareaAutosize],' +
-            'textarea[mat-autosize], textarea[matTextareaAutosize]',
+  selector: `textarea[md-autosize], textarea[mdTextareaAutosize],
+             textarea[mat-autosize], textarea[matTextareaAutosize]`,
   exportAs: 'mdTextareaAutosize',
   host: {
     '(input)': 'resizeToFitContent()',