cloneLinkingFn sometimes gets an empty clone with multiple slots

[Sennahoi]

I'm submitting a ...

• bug report
• feature request
• other

Current behavior:
Since AngularJS 1.7.1 we sometimes see the following behavior in Firefox (Windows, Mac, Release and Nightly), but not in Chrome.

HTML:
<some-component>
  <slota>
  .. Tags and text
  </slota>
  <slotb>
  .. Tags and text
  </slotb>
</some-component>

Component someComponent:
 transclude: {
    'slota': 'slota',
    'slotb': '?slotb'
 },

 and in the template:
 <li  ng-repeat="item in items"
       ng-click... ng-class 
       ng-transclude="slota">

The content of li is sometimes just empty. Approx. one out of 20 tries. When I do the transclusion this way:

 $transclude(scope, function(clone) {
        element.append(clone);
    }, null, 'slota');

clone is sometimes empty, i.e. length===0, which normally means that I did a <slota></slota>.

I tried the AngularJS versions 1.7.2, 1.7.1, 1.7.0 and 1.6.10 and it doesn't work with 1.7.2 and 1.7.1. Every other version is just fine.

I checked the changes between 1.7.0 and 1.7.1 and tried to revert them in the 1.7..1 code. When I revert the change from this commitm, everything works as before.

So far, I was unable to reproduce this in a Plunkr.

AngularJS version: 1.7.1+

Browser: [ Firefox both Release and Nightly on Windows and macOS]

[gkalpak]

I am confused. Are you using $transclude() or ng-transclude.

And what exactly is the problem? Is it that the content is not transcluded sometimes (as if the slot was empty)? But the content is always transcluded correctly (i.e. not empty) with 1.7.0?

BTW, it might be helpful to have a code example, even if you can't reproduce the problem.

[Sennahoi]

I'm using ng-transclude. That's exactly the problem we're facing, the content is sometimes not transcluded as if it was empty. The content is always transcluded with 1.7.0 or with 1.7.1 when I revert the changes from the linked commit.

[gkalpak]

Sounds like a DocumentFragment-related Firefox bug 😞
Does it happen with non-slotted transclusion?

[Sennahoi]

We have a large number of transcluding components and just a few of them use slots. Because it only happens there, chances are it has something to do with slotted transclusion.

But it's hard to reproduce. One hour, I get the error after each reload, next hour, the error is gone for 20 reloads.

[gkalpak]

Any chance you could try the following and let me know if the problem goes away?
Change this line like this:

-slots[slotName] = compilationGenerator(mightHaveMultipleTransclusionError, slots[slotName].childNodes, transcludeFn);
+slots[slotName] = compilationGenerator(mightHaveMultipleTransclusionError, jqLite(slots[slotName].childNodes), transcludeFn);

[Sennahoi]

That's great. Thanks for your quick response. I checked it with and without your change more than 10 times and it really seems let the bug go away. Thank you very much!

[gkalpak]

Awesome! Thx for getting back.
(Feel free to submit a pull request with the fix if you feel like it 😉 - if not I will submit it in the following days.)

[gkalpak]

I submitted #16615.

[Narretz]

I think we should also open a bug report at Firefox about this.

[gkalpak]

TBH, I don't feel we have enough details to create a useful bug report. All I know is that DocumentFragment.childNodes sometimes gets emptied out, but that sounds like those unactionable "It doesn't work" bugs 😁

Maybe if we knew the exact version it started failing, it might be useful.
@Sennahoi, do you know which exact version it started failing with?

[Sennahoi]

Nope, sorry, I also thought about a bug report at Firefox but I understand the bug even less than you.