popup.js

<!-- IFRAME IMPLEMENTATION -->
<script>
  function ready (fn) {
    if (document.readyState !== 'loading') {
      fn()
    } else {
      document.addEventListener('DOMContentLoaded', fn)
    }
  }
  ready(function () {
    parent.postMessage('{ "status": "OK" }', '*')
  })

  function propertyToField (property) {
    var config = {
      variantId: 'variant_letter',
      utm_source: 'utm_source',
      utm_medium: 'utm_medium',
      utm_campaign: 'utm_campaign'
    }
    return config[property]
  }

  function fillData (data) {
    for (var i in data) {
      var field = propertyToField(i)
      var element = document.getElementById(field)
      if (element) {
        element.value = data[i]
      }
    }
  }

  window.addEventListener('message', function (event) {
    fillData(event.data)
  }, false)
</script>

unbounce-lp.js

<!-- PARENT IMPLEMENTATION -->
<script>
  function queryStringToJSON () {
    var pairs = window.location.search.slice(1).split('&')
    var result = {}
    pairs.forEach(function (pair) {
      pair = pair.split('=')
      if (pair.length === 2)
        result[pair[0]] = decodeURIComponent(pair[1] || '')
    })
    return result
  }

  var query = queryStringToJSON()
  var preparedData = Object.assign({}, query, window.ub && window.ub.page)

  window.addEventListener('message', function (event) {
    var data = JSON.parse(event.data)
    if (data && data.status === 'OK') {
      var iframe = document.querySelector('iframe').contentWindow
      iframe.postMessage(preparedData, '*')
    }
  }, false)
</script>