Prevent renderAd from overwriting the website DOM document

[kasparsd]

By accidentally changing document to w in the suggested ad creative line item, one is able to completely override the DOM of the parent document (the website) with the ad output.

Would it make sense to add a doc !== document check here to prevent that from happening?

That is even suggested in the description of the renderAd() method:

/**
 * This function will render the ad (based on params) in the given iframe document passed through. Note that doc SHOULD NOT be the parent document page as we can't doc.write() asynchrounsly
 * @param  {object} doc document
 * @param  {string} id bid id to locate the ad
 * @alias module:$$PREBID_GLOBAL$$.renderAd
 */
$$PREBID_GLOBAL$$.renderAd = function (doc, id) {

[mkendall07]

Ah, that is a problem is the creative uses window.document
We'll update that right away - thanks.

[mkendall07]

@kasparsd
I'm not sure what you mean by accidentally changing document to w - since these are 2 separate objects. The window object get's assigned to it's parent, which arguably should not be happening, but the creative document passed is in fact the creative document. Are you suggesting that it causes issues when someone alters this code?

[kasparsd]

@mkendall07 I wasn't clear about it, sorry.

The core issue here is that pbjs.renderAd() expects doc to be the creative document and doesn't protect the website document from being written to.

Currently, passing the website document to pbjs.renderAd() will result in the ad replacing the whole website because we're using document.write() to insert either the ad HTML or the iframe! I assume this is not desired and shouldn't be possible.

[brs14ku]

Sorry to reopen, but I'm unsure of what is actually expected for the document parameter now. Anything I pass other than the actual document gives me a ERROR: Error trying to write ad Id :5247b9619e4e776 to the page:e.write is not a function. I've tried this with my iframe id, the dfp slot container div id and more. I did notice the docs say This function is usually used in the ad server’s creative. though I'm unsure of how that could be done outside of using creative templates. Any guidance here would be greatly appreciated. Perhaps we could update the readme to explain what is expected here?

[mkendall07]

@brs14ku
It should be the iframe's document object. 2 different examples are shown here https://github.com/prebid/Prebid.js/blob/master/integrationExamples/gpt/creative_rendering.html

[prebidtappx]

Try this...

var adUnits = [{
  code: 'mrec', //This have to be equal of an id of div in your page
  mediaTypes: {
    banner: {
      sizes: [300,50]
    }
  },
  bids: [{
    bidder: 'bidderName like Tappx',
      params: {
         //the params of the bidder...
      }
   }]
}
//...code...
pbjs.requestBids({
  timeout: 2000,
  bidsBackHandler: function (bids) {
    for (const bid in bids) {
      //This is manual rewrite of renderAd - trick
      let highestCpmBids = pbjs.getHighestCpmBids(bid);
      var placement = document.getElementById(bid)
      placement.write = function(adm) {this.innerHTML=adm}
      placement.close = function() {console.log('closeRender')}
      //This is the renderAd of Prebid
      pbjs.renderAd(placement, highestCpmBids[0].adId)
    }
  }
})