Using ES6 proxies to keep historic data layer state for debug purposes

datalayer-proxy.js

let dataLayerHistory = []

// this would come from GA
let dataLayer = {
  push(obj) {
    console.log("pushed to dataLayer", obj)
  }
}

// here's our clever little trick...
window.dataLayer = new Proxy(window.dataLayer, {
  get(obj, prop) {
    if (prop === 'push') {
      return function(v) {
        dataLayerHistory.push({...v})
        return obj.push.apply(obj, arguments)
      }
    } else {
      return Reflect.get(...arguments)
    }
  }
})

// ... and now to test it

window.dataLayer.push({"foo": "bar"})
window.dataLayer.push({"bah": "fuzz"})
window.dataLayer.push({"foo":"baz"})

console.log(dataLayerHistory)