I have problem with drupal behaviors and context in combination with big pipe. It seems like context variable sometimes contains same part of page. I have tried:

(function ($  , Drupal) {   Drupal.behaviors.myCustomBehavior = {     attach: function (context, settings) {       console.log(context);     }   }; })(jQuery, Drupal); 

When I load page and watch browser console contexts there is div with main menu block but there is also whole #document element which contain menu block also (see screen).

This behaviour is for me real problem because I use zurb foundation and I have to initialize all components and I do it:

(function ($  , Drupal) {   Drupal.behaviors.myCustomBehavior = {     attach: function (context, settings) {       $  (context).foundation();     }   }; })(jQuery, Drupal); 

I think this is correct way how to initialize foundation for all elements and it should be compatible with big pipe. But if I get same html part in context twice (some sub elements in context are same) I initialize some zurb foundation plugin twice (see next image).

This breaks zurb foundation plugins. I’m not sure what to do. I read lot of Drupal documentation about js, behaviours and big pipe and according to documentation there should not be problem.

When I disable big pipe everything works as expected but that’s not solution.

Do anybody knows what am I doing wrong?