@affiliateo/web 2.3.0 → 2.4.0

package/README.md

@@ -171,12 +171,12 @@ attributes become metadata (kebab-case → snake_case, up to 10 params).
 </section>
 ```
 
-Fires once when 10% of the section enters the viewport (combined with a
-small bottom-edge rootMargin so it doesn't fire on sections barely peeking
-up from the bottom of the screen). The lower threshold catches tall
-sections like pricing pages with comparison tables that would otherwise
-top out under 50% intersection and never fire. Great for landing pages
-where you want to know which sections convert.
+Fires the first time any pixel of the section overlaps the viewport.
+Maximum permissiveness — if the user scrolled enough to see even a sliver,
+it counts. Earlier versions required 50% visibility, which was unreachable
+for tall sections (a pricing page with comparison tables silently dropped
+out of every funnel). Great for landing pages where you want to know
+which sections convert.
 
 ### Goal naming rules
 

package/dist/provider.js

@@ -248,13 +248,33 @@ export function AffiliateoProvider({ campaignId, apiUrl, children, }) {
             ended = true;
             beacon({ type: 'session_end', campaign_id: campaignIdRef.current, visitor_id: vid, ref: ref || lsGet(LS_REF) || '' });
         }
+        // Server-side session window. Matches STALE_VISITOR_MS in the
+        // tracking Durable Object — after this much idle time the server
+        // treats the visitor as a new session, rotates session_id, and
+        // expects a fresh pageview to anchor the new visit in
+        // campaign_events. Without that anchor, funnel steps starting on
+        // `page` matches (e.g. the homepage `/`) silently get skipped for
+        // visitors who keep a tab open and come back.
+        const SESSION_REFIRE_MS = 10 * 60 * 1000;
         function onVisibilityChange() {
             if (document.visibilityState === 'hidden') {
                 sendEnd();
             }
             else {
+                // Tab becomes visible again.
                 ended = false;
-            } // reset if they come back (tab switch)
+                // If the SDK's last pageview was longer ago than the server's
+                // 10-min session window, the server has already rolled the
+                // visitor over to a new session_id. Refire pageview so the new
+                // session has a proper anchor — otherwise the next scroll /
+                // click / custom event arrives orphaned and the funnel overlay
+                // sees the visitor enter "mid-funnel" (e.g. on a scroll step)
+                // without ever passing through the page-step that should
+                // bracket the visit.
+                if (Date.now() - lastSendTime > SESSION_REFIRE_MS) {
+                    sendPageview();
+                }
+            }
         }
         // Send pageview on mount
         if (!sentRef.current) {
@@ -332,22 +352,16 @@ export function AffiliateoProvider({ campaignId, apiUrl, children, }) {
         // path) and unobserve after the first fire so the same element can't
         // double-count if the user scrolls back up.
         //
-        // Threshold: 0.1 (was 0.5). 50% visibility is unreachable for tall
-        // sections — a 1600px pricing section in an 800px viewport tops out
-        // at ~50% intersection ratio, so the observer's threshold was either
-        // a bare miss (section maxes at 49%) or a brittle hit. Funnel steps
-        // tied to those sections silently dropped from every merchant's
-        // conversion count without anyone noticing the section was even
-        // being rendered. 0.1 fires when 10% of the section is visible,
-        // which on a typical laptop is "the user has scrolled enough that
-        // the section is meaningfully on screen" without firing on sections
-        // that barely peek up from the bottom edge.
-        //
-        // rootMargin: trim the bottom 10% of the viewport from the trigger
-        // zone so a section creeping up from the very bottom of the screen
-        // doesn't fire instantly. The user has to scroll enough that the
-        // section is starting to settle into the main visible area, which
-        // matches a human's intuitive sense of "I've reached that section."
+        // No options object → IntersectionObserver defaults to
+        // { threshold: 0, rootMargin: '0px 0px 0px 0px' }, which fires the
+        // instant ANY pixel of the section overlaps the viewport. That's
+        // exactly the semantic merchants want for "did the visitor reach
+        // this section": if they scrolled enough to see even a sliver of
+        // it, count it. Earlier versions used { threshold: 0.5 }, which
+        // was unreachable for tall sections (a 1600px pricing section in
+        // an 800px viewport tops out at ~50% intersection ratio and never
+        // crossed the threshold) — funnel steps tied to those sections
+        // silently dropped from every merchant's conversion count.
         const scrollFired = new WeakSet();
         let scrollObserver = null;
         let scrollMo = null;
@@ -364,7 +378,7 @@ export function AffiliateoProvider({ campaignId, apiUrl, children, }) {
                         track(goal);
                     scrollObserver?.unobserve(entry.target);
                 }
-            }, { threshold: 0.1, rootMargin: '0px 0px -10% 0px' });
+            });
             // Observe everything that exists at mount time.
             document.querySelectorAll('[data-affiliateo-scroll]').forEach((el) => {
                 scrollObserver?.observe(el);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@affiliateo/web",
-  "version": "2.3.0",
+  "version": "2.4.0",
   "description": "Affiliateo web SDK — affiliate attribution and tracking for web apps",
   "main": "dist/index.js",
   "module": "dist/index.js",