Closes #31: Add a check if page is scrolled down. (#32)

* Closes #31: Add a check if page is scrolled down. * move isPageScrolled method to Utils class --------- Co-authored-by: WordPressFan <[email protected]>
wp-media · Oct 16, 2024 · 9fee2d8 · 9fee2d8
1 parent b612364
commit 9fee2d8
Show file tree

Hide file tree

Showing 3 changed files with 65 additions and 1 deletion.
diff --git a/src/BeaconManager.js b/src/BeaconManager.js
@@ -22,6 +22,12 @@ class BeaconManager {
             return;
         }
 
+        if (BeaconUtils.isPageScrolled()) {
+            this.logger.logMessage('Bailing out because the page has been scrolled');
+            this._finalize();
+            return;
+        }
+
         this.infiniteLoopId = setTimeout(() => {
             this._handleInfiniteLoop();
         }, 10000);

diff --git a/src/Utils.js b/src/Utils.js
@@ -35,6 +35,10 @@ class BeaconUtils {
         );
     }
 
+    static isPageScrolled() {
+        return window.pageYOffset > 0 || document.documentElement.scrollTop > 0;
+    }
+
 }
 
 export default BeaconUtils;
diff --git a/test/BeaconManager.test.js b/test/BeaconManager.test.js
@@ -10,8 +10,21 @@ describe('BeaconManager', function() {
     let beacon;
     const config = { nonce: 'test', url: 'http://example.com', is_mobile: false, status: {atf: true}, width_threshold: 100, height_threshold: 100 };
     beforeEach(function() {
-        //Deep copy of config
+        // Deep copy of config
         beacon = new BeaconManager(JSON.parse(JSON.stringify(config)));
+
+        // Mock window and document objects
+        global.window = {
+            pageYOffset: 0
+        };
+        global.document = {
+            documentElement: {
+                scrollTop: 0
+            },
+            querySelector: sinon.stub().returns({
+                setAttribute: sinon.spy()
+            })
+        };
     });
 
     describe('#constructor()', function() {
@@ -109,6 +122,47 @@ describe('BeaconManager', function() {
         });
     });
 
+    describe('#init()', function() {
+        let fetchStub;
+        let _isValidPreconditionsStub;
+        let isPageCachedStub;
+        let _finalizeStub;
+
+        beforeEach(function() {
+            // Stub the global fetch method
+            _isValidPreconditionsStub = sinon.stub(beacon, '_isValidPreconditions');
+            isPageCachedStub = sinon.stub(BeaconUtils, 'isPageCached');
+            _finalizeStub = sinon.stub(beacon, '_finalize');
+            fetchStub = sinon.stub(global, 'fetch').resolves({
+                json: () => Promise.resolve({ data: false })
+            });
+        });
+
+        afterEach(function() {
+            // Restore the original fetch method
+            _isValidPreconditionsStub.restore();
+            isPageCachedStub.restore();
+            _finalizeStub.restore();
+            fetchStub.restore();
+        });
+
+        it('should bail out if the page is scrolled', async function() {
+            // Mock _isValidPreconditions
+            _isValidPreconditionsStub.resolves(true);
+            isPageCachedStub.returns(false);
+
+            // Simulate page being scrolled
+            global.window.pageYOffset = 100;
+            global.document.documentElement.scrollTop = 100;
+
+            await beacon.init();
+
+            assert.strictEqual(_isValidPreconditionsStub.calledOnce, true);
+            assert.strictEqual(_finalizeStub.calledOnce, true);
+            assert.strictEqual(fetchStub.notCalled, true);
+        });
+    });
+
     describe('#_isValidPreconditions()', function() {
         it('should return true for desktop screensize larger than threshold', async function() {
             // Mocking window properties and methods since they are used in _isValidPreconditions