ivy fails to compile a template with [ngTemplateOutletContext]=""

🐞 bug report

Affected Package

The issue is caused by package @angular/compiler

Is this a regression?

Nope, ivy only

Description

When trying to compile our app with ivy I was hit with a rather cryptic error message, I managed to track the cause to a [ngTemplateOutletContext]="" on a template. This used to work fine in the view engine, and the workaround is easy to fix in your app once you know where the problem lies, but I think this should be fixed in the interests of backwards compatibility and also it’s not obvious where the problem lies.

🔬 Minimal Reproduction

<!-- component.template.html -->
<ng-template #testTemplate>test</ng-template>
<ng-template
  [ngTemplateOutlet]="testTemplate"
  [ngTemplateOutletContext]=""
></ng-template>

🔥 Exception or Error

ERROR in : TypeError: Cannot read property 'visit' of undefined
    at convertPropertyBinding (/Users/mattlewis/Code/clickup/frontend/node_modules/@angular/compiler/bundles/compiler.umd.js:7724:52)
    at TemplateDefinitionBuilder.convertPropertyBinding (/Users/mattlewis/Code/clickup/frontend/node_modules/@angular/compiler/bundles/compiler.umd.js:16652:44)
    at /Users/mattlewis/Code/clickup/frontend/node_modules/@angular/compiler/bundles/compiler.umd.js:16597:154
    at /Users/mattlewis/Code/clickup/frontend/node_modules/@angular/compiler/bundles/compiler.umd.js:16608:71
    at /Users/mattlewis/Code/clickup/frontend/node_modules/@angular/compiler/bundles/compiler.umd.js:15950:83
    at Array.map (<anonymous>)
    at TemplateDefinitionBuilder.buildTemplateFunction (/Users/mattlewis/Code/clickup/frontend/node_modules/@angular/compiler/bundles/compiler.umd.js:15950:56)
    at Object.compileComponentFromMetadata (/Users/mattlewis/Code/clickup/frontend/node_modules/@angular/compiler/bundles/compiler.umd.js:17494:58)
    at ComponentDecoratorHandler.compile (/Users/mattlewis/Code/clickup/frontend/node_modules/@angular/compiler-cli/src/ngtsc/annotations/src/component.js:439:34)
    at IvyCompilation.compileIvyFieldFor (/Users/mattlewis/Code/clickup/frontend/node_modules/@angular/compiler-cli/src/ngtsc/transform/src/compilation.js:363:57)
    at IvyVisitor.visitClassDeclaration (/Users/mattlewis/Code/clickup/frontend/node_modules/@angular/compiler-cli/src/ngtsc/transform/src/transform.js:51:40)
    at /Users/mattlewis/Code/clickup/frontend/node_modules/@angular/compiler-cli/src/ngtsc/util/src/visitor.js:77:93
    at IvyVisitor.Visitor._visitListEntryNode (/Users/mattlewis/Code/clickup/frontend/node_modules/@angular/compiler-cli/src/ngtsc/util/src/visitor.js:51:26)
    at IvyVisitor.Visitor._visit (/Users/mattlewis/Code/clickup/frontend/node_modules/@angular/compiler-cli/src/ngtsc/util/src/visitor.js:77:36)
    at /Users/mattlewis/Code/clickup/frontend/node_modules/@angular/compiler-cli/src/ngtsc/util/src/visitor.js:75:76
    at visitNodes (/Users/mattlewis/Code/clickup/frontend/node_modules/typescript/lib/typescript.js:64957:48)

🌍 Your Environment

Angular Version:

Angular CLI: 8.0.1
Node: 12.1.0
OS: darwin x64
Angular: 8.1.0-beta.0
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router, service-worker

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.800.1
@angular-devkit/build-angular     0.800.1
@angular-devkit/build-optimizer   0.800.1
@angular-devkit/build-webpack     0.800.1
@angular-devkit/core              8.0.1
@angular-devkit/schematics        8.0.1
@angular/cdk                      8.0.0
@angular/cli                      8.0.1
@ngtools/webpack                  8.0.1
@schematics/angular               8.0.1
@schematics/update                0.800.1
rxjs                              6.5.2
typescript                        3.4.5
webpack                           4.30.0

[JoostK]

@Airblader I agree, however there’s two concerns here: template compilation and template type checking. From the stacktrace, it can be seen that the error occurs during template compilation and the empty expression binding currently crashes the whole compilation effort; that should never happen.

The template compiler is given the template AST to compile. If the parser had produced parse errors, template compilation would not have been attempted. Apparently, the parser is okay with empty binding expressions and produces EmptyExpr nodes, so the template AST in itself is valid meaning that template compilation should be able to process it just fine. Therefore, it is then up to the template type checker phase (currently done independently from template compilation, but still always after template compilation) to create diagnostics for such EmptyExpr nodes.

I am not sure when/if an EmptyExpr is ever a valid thing in an AST. If it is never valid, it could become an error during parsing and the template compiler would never have to deal with it. Otherwise, the template compiler should be able to handle it gracefully (like VE did apparently) and not crash (as Ivy currently does).

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}