Angular 1.0.3 breaks directives using ng-transclude

[Addeventure]

ng-translude for directives is broken in angular 1.0.3. It seems to be related with the fix for issue #1313

Changing view using $location from a view that uses a directive with transcluded content throws:
TypeError: Cannot read property '$$childHead' of null

Take a look at this simple snippet:
http://jsfiddle.net/JJt3u/

Snippet fails in Chrome 23.0.1271.64, and Firefox 17.0

[petebacondarwin]

This issue is not caused by that change, since the changed line does not get called before the exception is thrown.

The compiler is creating an extra scope (005 on my machine) that is not attached to a parent, it is the destruction of this that is failing. This extra scope is the one that is created if your directive template has more than one top level DOM node. (In the case of your fiddle it is the sneaky bit of whitespace between the div and the button.)

Here is a Plunker http://plnkr.co/edit/aSN1H4?p=preview. If you change which template is being used you will get different success or exception.

[petebacondarwin]

Possibly due to this commit?
4e45a2f#L0L709

[Addeventure]

Ouch, yes that was a sneaky whitespace. Thank you for looking in to this! Just to clarify, it is not the directive template but the transcluded DOM which have more than one top node.

I'm surprised that I am the only one that have reported this issue (although 1.0.3 was released quite recently) as it feels like a very normal use case of directives.

One more clarification/question: Having more than one top node in transcluded dom is supposed to be supported right? (Otherwise I have a lot of templates to rewrite ;))

[petebacondarwin]

Yes, sorry, top level nodes in the transcluded DOM. Multi top level nodes
are supported - AngularJS just wraps them in a to make a single top
level node.

On 29 November 2012 13:31, Andreas Duchen notifications@github.com wrote:

Ouch, yes that was a sneaky whitespace. Thank you for looking in to this!
Just to clarify, it is not the directive template but the transcluded DOM
which have more than one top node.

I'm surprised that I am the only one that have reported this issue
(although 1.0.3 was released quite recently) as it feels like a very normal
use case of directives.

One more clarification/question: Having more than one top node in
transcluded dom is supposed to be supported right? (Otherwise I have a
lot of templates to rewrite ;))

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/1627#issuecomment-10847094.

[qualidafial]

I'm having this issue as well.

[murilobr]

Fast solution commenting lines 7808 and 7809

Comment this:
this.$parent = this.$$nextSibling = this.$$prevSibling = this.$$childHead =
this.$$childTail = null;

Add this:
this.$$nextSibling = null;

[pkozlowski-opensource]

Happens also without jQuery: http://jsfiddle.net/JJt3u/3/

[ggoodman]

Also broken in 1.1.1

/edited from 1.1.0 (thanks @pkozlowski-opensource)

[pkozlowski-opensource]

@ggoodman 1.1.0 or 1.1.1?

[petebacondarwin]

@murilobr - You are right - commenting out those lines does fix the problem: http://plnkr.co/edit/IOeW5Q?p=preview

[dbinit]

I'm seeing this too.

From what I can tell, it looks like every top level element in transcluded content (including whitespace) is being assigned the same scope (stored in data()).

This causes $destroy to be fired more than once on the scope when the elements are removed.

It's possible that this is an existing bug with $compile that just surfaced because of the change to null out $parent on $destroy.

[dbinit]

Changing that line from:

this.$parent = this.$$nextSibling = this.$$prevSibling = this.$$childHead =
this.$$childTail = null;

to:

this.$$nextSibling = this.$$prevSibling = this.$$childHead = this.$$childTail = null;

Also seems to fix the problem.

Or, perhaps a better solution, you can add:

if (!parent) return;

right below this in that same function:

var parent = this.$parent;

[petebacondarwin]

One for Igor, I think!

[IgorMinar]

ok, I'm on this. The problem is due to bd524fc which surfaced a bug in destruction of a multi-rooted DOM with a single scope associated with all of the roots. we mistakinly destroy the shared scope onces for each root, which is wrong. once a scope is destroyed, it's destroyed. I'll work on a fix for this.