Skip to content

Commit

Permalink
fix: aps integration with regards to size mismatch (#140)
Browse files Browse the repository at this point in the history
## Description

The current APS integration does not work correctly if using the GAM
size mapping feature. This is because while GAM accepts the size mapping
feature, and will request the designated sizes at the designated
breakpoints, the current APS integration simply uses the size array of
the unit, which includes _all_ potential sizes of the unit.

You can see this where the apsSlot is defined in the defineSlots()
function.

This can result in a request for a size that the unit is not currently
set up to display. For example a leaderboard unit may be a 320x100 on
mobile, a 728x90 on tablet, and a 970x250 on desktop. All of the sizes
exist in the "size" array of the unit. That unit may also contain a GAM
size mapping definition that states that the 320x100 can only be
requested on mobile, 728x90 on tablet, and a 970x250 on desktop.

The APS call, however, will simply include all 3 of those sizes for
every request. This can cause breakage on the site as the creative
delivered will likely be larger than the size of the ad unit /
placeholder. This will also hurt viewability metrics (a 728x90 on mobile
won't be fully viewable, etc).

Amazon has a newer method of integration called "simplerGPT" which does
utilize GAM size mapping definitions. In fact you do not need to define
any slot for APS, it will just use the GPT definition.

You can read about this method
[here](https://ams.amazon.com/webpublisher/uam/docs/reference/googletag-sizemapping.html).

I added a simple check for the presence of "simplerGPT" in the config
that if present, will utilize the gpt slot definition for the APS calls,
instead of the APS unit that is defined. I've defaulted to the older
method to avoid any breakage.

Testing this I'm able to verify that APS is being called for the correct
sizes at the configured breakpoints, versus the older method which
requests all listed sizes.

---------

Co-authored-by: Travis Czerw <[email protected]>
  • Loading branch information
Trav84 and Travis Czerw authored Aug 28, 2024
1 parent bc3dc17 commit 0bb7284
Show file tree
Hide file tree
Showing 2 changed files with 6 additions and 3 deletions.
8 changes: 5 additions & 3 deletions src/Advertising.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ export default class Advertising {
this.customEventCallbacks = {};
this.customEventHandlers = {};
this.queue = [];
this.apsSlotType = 'aps';
this.setDefaultConfig();
}

Expand All @@ -35,6 +36,7 @@ export default class Advertising {
typeof this.config.useAPS === 'undefined'
? typeof window.apstag !== 'undefined'
: this.config.useAPS;
this.apsSlotType = this.config.aps && this.config.aps.simplerGPT ? 'gpt' : 'aps';
this.executePlugins('setup');
const { slots, outOfPageSlots, queue, isPrebidUsed, isAPSUsed } = this;
this.setupCustomEvents();
Expand Down Expand Up @@ -96,7 +98,7 @@ export default class Advertising {
try {
window.apstag.fetchBids(
{
slots: queue.map(({ id }) => slots[id].aps),
slots: queue.map(({ id }) => slots[id][this.apsSlotType]),
},
() => {
Advertising.queueForGPT(() => {
Expand Down Expand Up @@ -171,13 +173,13 @@ export default class Advertising {
try {
window.apstag.fetchBids(
{
slots: [slots[id].aps],
slots: [slots[id][this.apsSlotType]],
},
() => {
Advertising.queueForGPT(() => {
window.apstag.setDisplayBids();
requestManager.aps = true; // signals that APS request has completed
this.refreshSlots([slots[id].gpt], requestManager); // checks whether both APS and Prebid have returned
this.refreshSlots([slots[id][this.apsSlotType]], requestManager); // checks whether both APS and Prebid have returned
}, this.onError);
}
);
Expand Down
1 change: 1 addition & 0 deletions src/components/utils/AdvertisingConfigPropType.js
Original file line number Diff line number Diff line change
Expand Up @@ -80,6 +80,7 @@ export default PropTypes.shape({
pubID: PropTypes.string,
bidTimeout: PropTypes.number,
deals: PropTypes.bool,
simplerGPT: PropTypes.bool,
}),
sizeMappings: PropTypes.objectOf(
PropTypes.arrayOf(
Expand Down

0 comments on commit 0bb7284

Please sign in to comment.