Paste into console to view current gtm data layer state

view gtm data layer state .js

/*

SIMPLEST USAGE:
Copy all this code and paste it in the console to see all the data layer's available data
  in different formats, and learn about the data layer queue vs data layer state.

USAGE:

// See data layer state as nested objects.
datalayerGetAll( dataLayer );

// See data layer state flattened (dot-notation keys).
datalayerGetAll( dataLayer, true );

// See data layer state flattened in a table.
console.table( tabularizeObj( datalayerGetAll( dataLayer, true ) ) );


*/

// See data in the data layer in different views, with explanations.
function explainDataLayer( dataLayer ){
	var l = console.log.bind(console), h = function(h,s){l("\n\n\n%c"+h+'%c'+(s?"\n"+s:''),'font-weight:bold','font-style:italic');};
	dataLayer = dataLayer || window.dataLayer;
	h( 'Data Layer Queue', "This shows the history of data layer pushes, or data layer 'queue'. Earlier pushes are on the left. This does NOT reflect the data layer's 'state' (the data that is accessible in GTM)." );
	l( dataLayer );
	h( 'Data Layer State: Data Model', "This shows all the data accessible to GTM, as nested data objects. Anything with a triangle next to it is an object and can be clicked to toggle display of its contents." );
	l( datalayerGetAll( dataLayer ) );
	h( 'Data Layer State: Data for GTM', "This shows all the data accessible to GTM. Each line can be it's own GTM Variable, with the value on the left used as the key." );
	console.table( tabularizeObj( datalayerGetAll( dataLayer, true ) ) );
}

// Get obj representing the data layer's data model.
function datalayerGetAll( dataLayer, flat ){
	var i, j, k, dd, ddo,  all = {}, dl = dataLayer || window.dataLayer;
	for( i=0; i<dl.length; i++ ){
		if( dl[i] && dl[i].hasOwnProperty ){
			for( k in dl[i] ){
				if( dl[i].hasOwnProperty( k ) ){
					dd = k.split('.');
					ddo = all;
					for( j=0; j<dd.length; j++ ){
						if( !( dd[j] in ddo ) || 'undefined' != typeof ddo[dd[j]] && !ddo[dd[j]].hasOwnProperty ){
							ddo[ dd[j] ] = {};
						}
						if( j+1 == dd.length ){
							ddo[ dd[j] ] = dl[i][k];
						} else {
							ddo = ddo[ dd[j] ];
						}
					}
				}
			}
		}
	}
	if( flat ){
		var flatten = function( obj ){
			var k, l, o, breadcrumbKey = '__seerGtmGetAll', r = {};
			for( k in obj ){
				try{
					if( breadcrumbKey in obj[k] ){
						r[k] = 'ERROR: Recursion detected';
					} else if( obj[k].toString() == '[object Object]' ) {
						obj[k][breadcrumbKey] = true;
						o = flatten( obj[k] );
						delete obj[k][breadcrumbKey];
						for( l in o ){
							if( l != breadcrumbKey ){
								r[k + '.' + l] = o[l];
								//if( o[l].hasOwnProperty ){ r[k + '.' + l] = o[l]; }
							}
						}
					} else {
						r[k] = obj[k];
					}
				}catch(ex){
					r[k] = obj[k];
				}
			}
			return r;
		};
		all = flatten(all);
	}
	return all;
};


function objSortKeys( obj ){
	var k, i, keys = [], r = {};
	for( k in obj ){
		keys.push( k );
	}
	keys.sort();
	for( i=0; i< keys.length; i++ ){
		r[keys[i]]=obj[keys[i]];
	}
	return r;
};

// Prepare single object for display using `console.table()`
function tabularizeObj( obj, sortKeys ){
	var k, valueColName = '(value)', objTabular = {};
	for( k in obj ){
		objTabular[k] = {};
		objTabular[k][valueColName] = obj[k];
	}
	if( arguments.length == 1 || sortKeys ){
		objTabular = objSortKeys( objTabular );
	}
	return objTabular;
}

explainDataLayer();