Automatic Analytics Trigger

demonstration of how to automatically trigger events and mutations with automatic-analytics-trigger lib

Click event example:

When you click on the button bellow you will see a simulation where data layer object will be incremented by your click. This occurs because the button has the data-analytics-click attribute.


  <button type="button"
	class="btn btn-primary btn-lg btn-block"
	data-analytics-click
	data-analytics-event="page-click"
	data-analytics-event-category="my-application:page"
	data-analytics-event-action="click:trigger-button"
	data-analytics-event-label="success"
	data-analytics-screen-name="demo-page"
	data-analytics-dimension-22="test">
      Click to trigger
  </button>
           

                    

Show mutation example:

When the element with data-analytics-show attribute is displayed the simulated data layer will be incremented. You can use this to know when an alert is added to your page like the example bellow.


  <div id="alert"
	class="alert alert-danger col-8"
	role="alert"
	data-analytics-show
	data-analytics-event="alert-error"
	data-analytics-event-action="click:toggle-button"
	data-analytics-event-label="error"
	style="visibility: visible;">
      Danger alert displayed!
  </div>
                        
[
    {
        "event": "alert-error",
        "eventAction": "click:toggle-button",
        "eventLabel": "error"
    }
]