propeller icon indicating copy to clipboard operation
propeller copied to clipboard

Uncaught RangeError: Maximum call stack size exceeded

Open SeraVault opened this issue 6 years ago • 5 comments

I have a Bootstrap "row" that contains 40+ PMD "cards". The cards have a DIV with the "pmd-card-title" class and a DIV with the "pmd-card-body" class. If I render the info without the "pmd-card" DIV, it works fine. Rendering the cards are throwing a "Maximum call stack size exceeded". Any ideas?

SeraVault avatar Mar 06 '18 03:03 SeraVault

@SeraVault: Can you please share a screenshot of the issue you are facing. Also, if possible please share the code snippet for our better understanding.

monika-digicorp avatar Mar 07 '18 14:03 monika-digicorp

The following HTML code (a card repeated 100 times) is causing a "RangeError: Maximum call stack size exceeded" error.


TITLE
TEXT - BODY
BUTTONS
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
        
      </div>
      
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
  
  <div class="col-lg-2 col-md-3 col-sm-6">
    <div class="pmd-card pmd-card-default pmd-z-depth-1">
      <div class="pmd-card-title" style="overflow:hidden;">
        TITLE
      </div>
      <div class="pmd-card-body">
        
        <div id="content">
          <!--Text-->
          TEXT - BODY
        </div>
      </div>
      <div class="media-right bottom">
        BUTTONS
      </div>
    </div>
  </div>
</div>

SeraVault avatar Mar 09 '18 17:03 SeraVault

We did try your code and are unable to find any error.

Can you please share the step by step procedure you are doing and the list of technologies you are using with their versions?

Also if possible please share a link to your page for our better understanding.

monika-digicorp avatar Mar 14 '18 14:03 monika-digicorp

It's possible to fix by surrounding the content of the else branch in the processNode() function:

try {
    var childNodes = node.childNodes;
    processNodes(childNodes, function () {
        processNode(nodes, index + 1, function () {
            callback();
        });
    });
} catch (e) {
    // Do whatever
}

micschwarz avatar Apr 11 '18 12:04 micschwarz

I've gone over the code again... the problem is recursion. Simply exchange the whole observer code starting in line 87 with my version:

$(document).ready(function () {
	observeDOM(document.querySelector('body'), function (mutations) {
		mutations.forEach(function (mutation) {
			if (typeof mutation.addedNodes === "object" && mutation.addedNodes.length > 0) {
				var jqueryTree = $(mutation.addedNodes);
				var handleableObjects = Object.keys(propellerControlMapping);
				handleableObjects.forEach(function (selector) {
					propellerControlMapping[selector](jqueryTree.find('.' + selector));
				});
			}
		});
	});
});

micschwarz avatar May 06 '19 15:05 micschwarz