build: fix compilation errors in scenes

crisbeto · Splaktar · commit 4447c37044e2 · 2021-04-18T00:59:06.000-04:00
The `yarn build:scenes` task was failing, because there were some `strictPropertyInitialization` errors.
diff --git a/scenes/src/app/scene-viewer/scene-viewer.ts b/scenes/src/app/scene-viewer/scene-viewer.ts
@@ -20,8 +20,7 @@ import {DomSanitizer, SafeStyle} from '@angular/platform-browser';
   styleUrls: ['./scene-viewer.scss'],
 })
 export class SceneViewer implements OnInit {
-
-  @HostBinding('style.filter') filter: SafeStyle;
+  @HostBinding('style.filter') filter: SafeStyle | undefined;
 
   /**
    * Degree to change hue of scene by. All scenes default to a reddish hue.
@@ -38,8 +37,7 @@ export class SceneViewer implements OnInit {
     // Furthermore these checks will soon be removed.
     this.filter = this.sanitizer.bypassSecurityTrustStyle(`hue-rotate(${this.hueRotation}deg)`);
   }
-
-  private _hueRotation: number;
+  private _hueRotation = 0;
 
   /** Scale of scene (1 is unscaled) */
   @Input() scale = 1;
@@ -48,7 +46,7 @@ export class SceneViewer implements OnInit {
   @Input() component: any;
 
   @ViewChild('scene', {read: ViewContainerRef, static: true})
-  scene: ViewContainerRef;
+  scene!: ViewContainerRef;
 
   constructor(private readonly componentFactoryResolver: ComponentFactoryResolver,
               private route: ActivatedRoute,
diff --git a/scenes/src/app/scenes/autocomplete/autocomplete-scene.ts b/scenes/src/app/scenes/autocomplete/autocomplete-scene.ts
@@ -22,7 +22,7 @@ export class AutocompleteScene implements AfterViewInit {
   myControl = new FormControl();
   options: string[] = ['hello', 'hello world'];
 
-  @ViewChild(MatInput) input: MatInput;
+  @ViewChild(MatInput) input!: MatInput;
 
   ngAfterViewInit() {
     this.input.focus();
diff --git a/scenes/src/app/scenes/menu/menu-scene.ts b/scenes/src/app/scenes/menu/menu-scene.ts
@@ -10,7 +10,7 @@ import {MatMenuModule, MatMenuTrigger} from '@angular/material/menu';
   styleUrls: ['./menu-scene.scss']
 })
 export class MenuScene implements AfterViewInit {
-  @ViewChild('menuTrigger') trigger: MatMenuTrigger;
+  @ViewChild('menuTrigger') trigger!: MatMenuTrigger;
 
   ngAfterViewInit() {
     this.trigger.openMenu();
diff --git a/scenes/src/app/scenes/ripples/ripples-scene.ts b/scenes/src/app/scenes/ripples/ripples-scene.ts
@@ -9,8 +9,8 @@ import {MatRipple, MatRippleModule} from '@angular/material/core';
   styleUrls: ['./ripples-scene.scss']
 })
 export class RipplesScene implements AfterViewInit {
-  @ViewChild('button', {read: MatRipple}) buttonRipple: MatRipple;
-  @ViewChild('wrapper', {read: MatRipple}) wrapperRipple: MatRipple;
+  @ViewChild('button', {read: MatRipple}) buttonRipple!: MatRipple;
+  @ViewChild('wrapper', {read: MatRipple}) wrapperRipple!: MatRipple;
 
   ngAfterViewInit() {
     this.buttonRipple.launch(140, 100, {
diff --git a/scenes/src/app/scenes/select/select-scene.ts b/scenes/src/app/scenes/select/select-scene.ts
@@ -9,7 +9,7 @@ import {MatSelect, MatSelectModule} from '@angular/material/select';
   styleUrls: ['./select-scene.scss']
 })
 export class SelectScene implements AfterViewInit {
-  @ViewChild(MatSelect) select: MatSelect;
+  @ViewChild(MatSelect) select!: MatSelect;
 
   ngAfterViewInit() {
     this.select.open();
diff --git a/scenes/src/app/scenes/slider/slider-scene.ts b/scenes/src/app/scenes/slider/slider-scene.ts
@@ -10,7 +10,7 @@ import {MatSlider, MatSliderModule} from '@angular/material/slider';
   styleUrls: ['./slider-scene.scss']
 })
 export class SliderScene implements AfterViewInit {
-  @ViewChild('volume') volume: MatSlider;
+  @ViewChild('volume') volume!: MatSlider;
 
   ngAfterViewInit() {
     this.volume.focus();
diff --git a/scenes/src/app/scenes/tooltip/tooltip-scene.ts b/scenes/src/app/scenes/tooltip/tooltip-scene.ts
@@ -10,7 +10,7 @@ import {MatIconModule} from '@angular/material/icon';
   styleUrls: ['./tooltip-scene.scss'],
 })
 export class TooltipScene implements AfterViewInit {
-  @ViewChild(MatTooltip) tooltip: MatTooltip;
+  @ViewChild(MatTooltip) tooltip!: MatTooltip;
 
   ngAfterViewInit() {
     this.tooltip.toggle();
