Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove sendBeacon test for users with no ad blocker #1442

Merged
merged 1 commit into from
Jun 26, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/rude-plants-happen.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@guardian/commercial': patch
---

Remove the sendBeacon for no ad blocker test
2 changes: 0 additions & 2 deletions src/core/messenger/background.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,6 @@ const adSpec: BackgroundSpecs = {
transform: 'translate3d(0,0,0)',
};

navigator.sendBeacon = jest.fn();

describe('Cross-frame messenger: setupBackground', () => {
class IntersectionObserver {
constructor() {
Expand Down
32 changes: 0 additions & 32 deletions src/core/messenger/background.ts
Original file line number Diff line number Diff line change
Expand Up @@ -184,38 +184,6 @@ const setupBackground = async (
specs.scrollType,
);

/* We're sending both sendBeacon and fetch messages here to test if we receive the same numbers of each.
Our hypothesis is that sendBeacon is less reliable because it gets blocked by some ad blockers. This messenger
code only fires if a template ad (eg fabric or interscroller) is present on the page and sends a message. This
means we can control for ad blockers, as there should be no ad blocker present if we reach this code. So if
our hypothesis is true, we should observe parity in the number of messages received using each method */

const endpoint = window.guardian.config.page.isDev
? '//logs.code.dev-guardianapis.com/log'
: '//logs.guardianapis.com/log';

const shouldTestBeacon = Math.random() <= 1 / 100;

if (shouldTestBeacon) {
const beaconEvent = {
label: 'commercial.test_send_beacon',
properties: [{ name: 'userAgent', value: navigator.userAgent }],
};

const fetchEvent = {
label: 'commercial.test_fetch',
properties: [{ name: 'userAgent', value: navigator.userAgent }],
};

window.navigator.sendBeacon(endpoint, JSON.stringify(beaconEvent));

void fetch(endpoint, {
method: 'POST',
body: JSON.stringify(fetchEvent),
keepalive: true,
});
}

return fastdom.mutate(() => {
setBackgroundStyles(specs, background);

Expand Down
Loading