test(material/select): add select to side-nav

Author: adolgachev

src/dev-app/sidenav/BUILD.bazel

@@ -14,6 +14,9 @@ ng_project(
         "//:node_modules/@angular/forms",
         "//src/material/button",
         "//src/material/checkbox",
+        "//src/material/form-field",
+        "//src/material/input",
+        "//src/material/select",
         "//src/material/sidenav",
         "//src/material/toolbar",
     ],

src/dev-app/sidenav/sidenav-demo.html

@@ -26,6 +26,16 @@
       End Side Sidenav
       <br>
       <button matButton (click)="end.close()">Close</button>
+      <mat-form-field>
+        <mat-label>What color?</mat-label>
+        <mat-select #whatColor>
+          <mat-option></mat-option>
+          <mat-option value="black">Black</mat-option>
+          <mat-option value="cyan">Cyan</mat-option>
+          <mat-option value="magenta">Magenta</mat-option>
+          <mat-option value="yellow">Yellow</mat-option>
+        </mat-select>
+      </mat-form-field>
       @for (c of fillerContent; track c) {
         <div class="demo-filler-content">Filler Content</div>
       }

src/dev-app/sidenav/sidenav-demo.ts

@@ -10,14 +10,26 @@ import {ChangeDetectionStrategy, Component} from '@angular/core';
 import {FormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
 import {MatCheckboxModule} from '@angular/material/checkbox';
+import {MatFormFieldModule} from '@angular/material/form-field';
+import {MatInputModule} from '@angular/material/input';
+import {MatSelectModule} from '@angular/material/select';
 import {MatDrawerMode, MatSidenavModule} from '@angular/material/sidenav';
 import {MatToolbarModule} from '@angular/material/toolbar';
 
 @Component({
   selector: 'sidenav-demo',
   templateUrl: 'sidenav-demo.html',
   styleUrl: 'sidenav-demo.css',
-  imports: [FormsModule, MatButtonModule, MatCheckboxModule, MatSidenavModule, MatToolbarModule],
+  imports: [
+    FormsModule,
+    MatButtonModule,
+    MatCheckboxModule,
+    MatFormFieldModule,
+    MatInputModule,
+    MatSelectModule,
+    MatSidenavModule,
+    MatToolbarModule,
+  ],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class SidenavDemo {