fix(upgrade): fix empty transclusion content with AngularJS@>=1.5.8 (#22167)

gkalpak · vicb · commit a9a0e27e94bc · 2018-02-25T10:06:14.000-08:00
The function provided by `ngUpgrade` as `parentBoundTranscludeFn` when upgrading a component with transclusion, will break in AngularJS v1.5.8+ if no transclusion content is provided. The reason is that AngularJS will try to destroy the transclusion scope (which would not be needed any more). But since the transcluded content comes from Angular, not AngularJS, there is no transclusion scope to destroy. This commit fixes it by providing a dummy scope object with a no-op `$destroy()` method. Fixes #22175 PR Close #22167
diff --git a/packages/upgrade/src/common/upgrade_helper.ts b/packages/upgrade/src/common/upgrade_helper.ts
@@ -122,9 +122,15 @@ export class UpgradeHelper {
   prepareTransclusion(): angular.ILinkFn|undefined {
     const transclude = this.directive.transclude;
     const contentChildNodes = this.extractChildNodes();
+    const attachChildrenFn: angular.ILinkFn = (scope, cloneAttachFn) => {
+      // Since AngularJS v1.5.8, `cloneAttachFn` will try to destroy the transclusion scope if
+      // `$template` is empty. Since the transcluded content comes from Angular, not AngularJS,
+      // there will be no transclusion scope here.
+      // Provide a dummy `scope.$destroy()` method to prevent `cloneAttachFn` from throwing.
+      scope = scope || {$destroy: () => undefined};
+      return cloneAttachFn !($template, scope);
+    };
     let $template = contentChildNodes;
-    let attachChildrenFn: angular.ILinkFn|undefined = (scope, cloneAttach) =>
-        cloneAttach !($template, scope);
 
     if (transclude) {
       const slots = Object.create(null);
