refactor(compiler): Support $any in host bindings (angular#53478)

`$any` should be interpreted as a cast, not as a context read of a variable called `$any`. This already worked in template compilations, but the relevant phase was not enabled for host bindings. PR Close angular#53478

Author: dylhunn

packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/GOLDEN_PARTIAL.js

@@ -663,6 +663,35 @@ export declare class MyComponent {
  static ɵcmp: i0.ɵɵComponentDeclaration<MyComponent, "my-comp", never, {}, {}, never, never, false, never>;
 }
 
+/****************************************************************************************************
+ * PARTIAL FILE: host_dollar_any.js
+ ****************************************************************************************************/
+import { Component } from '@angular/core';
+import * as i0 from "@angular/core";
+export class HostBindingDir {
+}
+HostBindingDir.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "0.0.0-PLACEHOLDER", ngImport: i0, type: HostBindingDir, deps: [], target: i0.ɵɵFactoryTarget.Component });
+HostBindingDir.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "0.0.0-PLACEHOLDER", type: HostBindingDir, selector: "[hostBindingDir]", host: { properties: { "style.color": "$any(\"red\")" } }, ngImport: i0, template: ``, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "0.0.0-PLACEHOLDER", ngImport: i0, type: HostBindingDir, decorators: [{
+ type: Component,
+ args: [{
+ selector: '[hostBindingDir]',
+ host: {
+ '[style.color]': '$any("red")',
+ },
+ template: ``
+ }]
+ }] });
+
+/****************************************************************************************************
+ * PARTIAL FILE: host_dollar_any.d.ts
+ ****************************************************************************************************/
+import * as i0 from "@angular/core";
+export declare class HostBindingDir {
+ static ɵfac: i0.ɵɵFactoryDeclaration<HostBindingDir, never>;
+ static ɵcmp: i0.ɵɵComponentDeclaration<HostBindingDir, "[hostBindingDir]", never, {}, {}, never, never, false, never>;
+}
+
 /****************************************************************************************************
  * PARTIAL FILE: host_bindings_primitive_names.js
  ****************************************************************************************************/

packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/TEST_CASES.json

@@ -253,6 +253,20 @@
  }
  ]
  },
+ {
+ "description": "should allow $any in host binding expressions",
+ "inputFiles": [
+ "host_dollar_any.ts"
+ ],
+ "expectations": [
+ {
+ "failureMessage": "Invalid host binding code",
+ "files": [
+ "host_dollar_any.js"
+ ]
+ }
+ ]
+ },
  {
  "description": "should handle host bindings with the same name as a primitive value",
  "inputFiles": [

packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/host_dollar_any.js

@@ -0,0 +1,6 @@
+function HostBindingDir_HostBindings(rf, ctx) {
+if (rf & 2) {
+i0.ɵɵstyleProp("color", "red");
+}
+}
+ 

packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/host_dollar_any.ts

@@ -0,0 +1,11 @@
+import {Component} from '@angular/core';
+
+@Component({
+ selector: '[hostBindingDir]',
+ host: {
+ '[style.color]': '$any("red")',
+ },
+ template: ``
+})
+export class HostBindingDir {
+}

packages/compiler/src/template/pipeline/src/emit.ts

@@ -113,7 +113,7 @@ const phases: Phase[] = [
  {kind: Kind.Tmpl, fn: generateProjectionDefs},
  {kind: Kind.Tmpl, fn: generateVariables},
  {kind: Kind.Tmpl, fn: saveAndRestoreView},
- {kind: Kind.Tmpl, fn: deleteAnyCasts},
+ {kind: Kind.Both, fn: deleteAnyCasts},
  {kind: Kind.Both, fn: resolveDollarEvent},
  {kind: Kind.Tmpl, fn: generateRepeaterDerivedVars},
  {kind: Kind.Tmpl, fn: generateTrackVariables},