title: magnificpopup "Maxium call stack size exceeded"
body: <p>I've a stackoverflow!</p>
  
  <p>I've tracked the source up to the setFocus and onFocusIn of the magnificpopup js file, but I cannot figure where I am generating it.</p>
  
  <p>Some relevant lines (in this fragment an active magnificpopup is closed and some JS (generated via AJAX) creates another magnificpopup</p>
  
  <pre><code>var active_magnificPopup = $.magnificPopup.instance;
  $( '#frm' ).ajaxSubmit( { url: '&lt;?php echo get_template_directory_uri(); ?&gt;/handleSubscriberForms.php', type: 'post', target: '#subscriptionSubmisionTarget' } );
  active_magnificPopup.close();
  </code></pre>
  
  <p>Now the 'return' of the form handler</p>
  
  <pre><code>jQuery( document ).ready( function( $ ) {
    $( "#ajax-thankyou" ).magnificPopup( {
      type: "ajax",
      alignTop: false,
      closeOnContentClick: false,
      overflowY: "scroll", // as we know that popup content is tall we set scroll overflow by default to avoid jump
      tError: "&lt;a href=\"%url%\"&gt;The content&lt;/a&gt; could not be loaded." //  Error message, can contain %curr% and %total% tags if gallery is enabled
    } );
    setTimeout(
      function() {
        $( "#ajax-thankyou" ).trigger( "click" );
      },
      125
    );
  } );
  </code></pre>
  
  <p>As I understand, the first popup is closed before the second is born, however, in mobile devices the code generates a stackoverflow and the first popup never closes (the second one is opened behind it).</p>
  
  <p>It would be awesome if someone can clarify this a bit... my brain is painful at this point.</p>
  
  <p>--- Edition after Jai's tip ---</p>
  
  <p>Hey Jai,</p>
  
  <p>Looks like, probably, the source is not where I thought. I've edited the 'return' and now doesn't use the trigger (next code-box).The thingy works as earlier (like a charm in computers, stakoverflow in mobiles).</p>
  
  <pre><code>echo '
      &lt;script&gt;
          jQuery( document ).ready( function( $ ) {
              setTimeout(
                  function() {
                      $.magnificPopup.open( {
                          items: {
                              src: "' . get_template_directory_uri() . '/form-thankyou.php?pi=' . $post_ID . '"
                          },
                          type: "ajax",
                          alignTop: false,
                          closeOnContentClick: false,
                          closeBtnInside: true,
                          overflowY: "scroll",
                          tError: "&lt;a href=\"%url%\"&gt;The content&lt;/a&gt; could not be loaded."
                      } );
                  },
                  125
              );
          } );
      &lt;/script&gt;
  ';
  </code></pre>
  
  <p>Here the console's log (where I understand that the infinite loop is generated between o._setFocus and o._onFocusIn, but I can't figure how to track what element is generating it)</p>
  
  <pre><code>Uncaught RangeError: Maximum call stack size exceeded jquery.tools.min.js:37
  ---From here to the end is repeating---
  f.event.trigger jquery.tools.min.js:37
  (anonymous function) jquery.tools.min.js:37
  e.extend.each jquery.tools.min.js:36
  e.fn.e.each jquery.tools.min.js:36
  f.fn.extend.trigger jquery.tools.min.js:37
  f.fn.(anonymous function) jquery.tools.min.js:37
  e.fn.extend.focus jquery.ui.core.min.js?ver=1.10.4:4
  o._setFocus magnific-popup.min.js:3
  o._onFocusIn magnific-popup.min.js:3
  f.event.dispatch jquery.tools.min.js:37
  h.handle.i jquery.tools.min.js:37
  </code></pre>
  
  <p>Thanks in advance</p>