title: Is there a safe way to use eventCallback with GTM DataLayer?
body: <p>When somebody clicks the "buy" button on my website, I'm trying to track this event with Google Tag Manager using dataLayer and the dataLayer.push.</p>
  
  <p>There's what it looks like:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>dataLayer.push({
    'event': 'service',
    'category': 'purchase',
    'action': 'product selected',
    'label': product
  });</code></pre>
  </div>
  </div>
  </p>
  
  <p>The problem is, every time the user clicks the button,  the service immediately redirects to the shopping cart, so in some cases the event doesn't have enough time to fire and the data in Google Analytics is incomplete. </p>
  
  <p>I know there's an "eventCallback" option you can use with dataLayer, which looks like this</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>dataLayer.push({
    'event': 'service',
    'category': 'purchase',
    'action': 'product selected',
    'label': product,
    'eventCallback': function () {
      //redirect to the shopping cart
    }
  });
  
  });</code></pre>
  </div>
  </div>
  </p>
  
  <p>But the problem with this option, it makes a dependency and there have been cases when the user wasn't redirected to the shopping cart because of some hickup of Google Tag Manger (it's a huge issue for us).</p>
  
  <p>Is there a more smooth and efficient way to handle this problem, so that we could collect as much data as possible without breaking our service (say, when the tracking protection is enabled in the user's browser)</p>