Skip to content

Commit

Permalink
CORE: check if the body is available before adding the locator iframe (
Browse files Browse the repository at this point in the history
…#11926)

* check if the body is available

* fix linter errors

* Add integ test

* Re-check if frame is already present

* But do it better

---------

Co-authored-by: Demetrio Girardi <[email protected]>
  • Loading branch information
olafbuitelaar and dgirardi committed Jul 9, 2024
1 parent 8c447c3 commit 159d108
Show file tree
Hide file tree
Showing 3 changed files with 124 additions and 17 deletions.
10 changes: 7 additions & 3 deletions src/adRendering.js
Original file line number Diff line number Diff line change
Expand Up @@ -253,8 +253,12 @@ export function renderAdDirect(doc, adId, options) {
*/
export function insertLocatorFrame() {
if (!window.frames[PB_LOCATOR]) {
const frame = createInvisibleIframe();
frame.name = PB_LOCATOR;
document.body.appendChild(frame);
if (!document.body) {
window.requestAnimationFrame(insertLocatorFrame);
} else {
const frame = createInvisibleIframe();
frame.name = PB_LOCATOR;
document.body.appendChild(frame);
}
}
}
97 changes: 97 additions & 0 deletions test/pages/banner_sync.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,97 @@
<!-- This is a Test Page for a Banner End-to-End test -->
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<title>Prebid.js Banner Example</title>

<!-- Prebid.js -->
<script src="http://localhost:4444/bundle?modules=appnexusBidAdapter"></script>

<!-- Google Publisher Tag -->
<script async src="https://www.googletagservices.com/tag/js/gpt.js"></script>

<script>
var pbjs = pbjs || {};
pbjs.que = pbjs.que || [];

// Prebid Banner Ad Unit
const adUnits = [{
code: 'div-gpt-ad-1460505748561-0',
mediaTypes: {
banner: {
sizes: [[300, 250], [300, 600]],
}
},
bids: [{
bidder: 'appnexus',
params: {
placementId: 13144370
}
}]
}
,{
code: 'div-gpt-ad-1460505748561-1',
mediaTypes: {
banner: {
sizes: [[300, 250], [300, 600]],
}
},
bids: [{
bidder: "appnexus",
params: {
placementId: 13144370
}
}]
}
];
</script>

<script>
var googletag = googletag || {};
googletag.cmd = googletag.cmd || [];

googletag.cmd.push(function() {
googletag.pubads().disableInitialLoad();
});

pbjs.que.push(function () {
pbjs.setConfig({enableTIDs: true});
pbjs.addAdUnits(adUnits);
pbjs.requestBids({ bidsBackHandler: sendAdServerRequest });
});

function sendAdServerRequest() {
googletag.cmd.push(function () {
pbjs.que.push(function () {
pbjs.setTargetingForGPTAsync('div-gpt-ad-1460505748561-0');
googletag.pubads().refresh();
});
});
}
</script>

<script>
googletag.cmd.push(function () {
googletag
.defineSlot('/19968336/header-bid-tag-0', [[300, 250], [300, 600]], 'div-gpt-ad-1460505748561-0')
.addService(googletag.pubads());

googletag.pubads().enableSingleRequest();
googletag.enableServices();
});
</script>
</head>

<body>
<h2>Prebid.js Banner Ad Unit Test</h2>
<div id='div-gpt-ad-1460505748561-0'>
<script>
googletag.cmd.push(function () { googletag.display('div-gpt-ad-1460505748561-0'); });
</script>
</div>
<div id="targeting-keys"></div>
</body>

</html>
34 changes: 20 additions & 14 deletions test/spec/e2e/banner/basic_banner_ad.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ const expect = require('chai').expect;
const {setupTest, testPageURL} = require('../../../helpers/testing-utils');

const TEST_PAGE_URL = testPageURL('banner.html?pbjs_debug=true');
const SYNC_PAGE_URL = testPageURL('banner_sync.html?pbjs_debug=true');
const CREATIVE_IFRAME_ID = 'google_ads_iframe_/19968336/header-bid-tag-0_0';
const CREATIVE_IFRAME_CSS_SELECTOR = 'iframe[id="' + CREATIVE_IFRAME_ID + '"]';

Expand All @@ -14,20 +15,25 @@ const EXPECTED_TARGETING_KEYS = {
'hb_bidder_appnexus': 'appnexus'
};

setupTest({
url: TEST_PAGE_URL,
waitFor: CREATIVE_IFRAME_CSS_SELECTOR,
expectGAMCreative: true
}, 'Prebid.js Banner Ad Unit Test', function () {
it('should load the targeting keys with correct values', async function () {
const result = await browser.execute(function () {
return window.pbjs.getAdserverTargeting('div-gpt-ad-1460505748561-1');
});
const targetingKeys = result['div-gpt-ad-1460505748561-1'];
Object.entries({
'synchronously': SYNC_PAGE_URL,
'asynchronously': TEST_PAGE_URL,
}).forEach(([t, testPage]) => {
setupTest({
url: testPage,
waitFor: CREATIVE_IFRAME_CSS_SELECTOR,
expectGAMCreative: true
}, `Prebid.js Banner Ad Unit Test (loading ${t})`, function () {
it('should load the targeting keys with correct values', async function () {
const result = await browser.execute(function () {
return window.pbjs.getAdserverTargeting('div-gpt-ad-1460505748561-1');
});
const targetingKeys = result['div-gpt-ad-1460505748561-1'];

expect(targetingKeys).to.include(EXPECTED_TARGETING_KEYS);
expect(targetingKeys.hb_adid).to.be.a('string');
expect(targetingKeys.hb_adid_appnexus).to.be.a('string');
expect(targetingKeys.hb_size).to.satisfy((size) => size === '300x250' || '300x600');
expect(targetingKeys).to.include(EXPECTED_TARGETING_KEYS);
expect(targetingKeys.hb_adid).to.be.a('string');
expect(targetingKeys.hb_adid_appnexus).to.be.a('string');
expect(targetingKeys.hb_size).to.satisfy((size) => size === '300x250' || '300x600');
});
});
});

0 comments on commit 159d108

Please sign in to comment.