From 038d2fc580e139124ef0554fab115f019f56113a Mon Sep 17 00:00:00 2001 From: Chi Chova Date: Tue, 30 Jan 2024 21:37:39 +0000 Subject: [PATCH] Fix page view firing logic for path changes only --- dist/mixpanel.amd.js | 2 +- dist/mixpanel.cjs.js | 2 +- dist/mixpanel.globals.js | 2 +- dist/mixpanel.min.js | 48 +++++++++++++------------- dist/mixpanel.umd.js | 2 +- examples/commonjs-browserify/bundle.js | 2 +- examples/es2015-babelify/bundle.js | 2 +- examples/umd-webpack/bundle.js | 2 +- src/mixpanel-core.js | 2 +- tests/test.js | 33 ++++++++++++++++-- 10 files changed, 63 insertions(+), 34 deletions(-) diff --git a/dist/mixpanel.amd.js b/dist/mixpanel.amd.js index cf98c007..e2e6eb82 100644 --- a/dist/mixpanel.amd.js +++ b/dist/mixpanel.amd.js @@ -4511,7 +4511,7 @@ define(function () { 'use strict'; } else if (track_pageview_option === 'url-with-path-and-query-string') { should_track = current_url.split('#')[0] !== previous_tracked_url.split('#')[0]; } else if (track_pageview_option === 'url-with-path') { - should_track = current_url.split('?')[0] !== previous_tracked_url.split('?')[0]; + should_track = current_url.split('#')[0].split('?')[0] !== previous_tracked_url.split('#')[0].split('?')[0]; } if (should_track) { diff --git a/dist/mixpanel.cjs.js b/dist/mixpanel.cjs.js index 71f59bd4..47f5d9be 100644 --- a/dist/mixpanel.cjs.js +++ b/dist/mixpanel.cjs.js @@ -4511,7 +4511,7 @@ MixpanelLib.prototype._init_url_change_tracking = function(track_pageview_option } else if (track_pageview_option === 'url-with-path-and-query-string') { should_track = current_url.split('#')[0] !== previous_tracked_url.split('#')[0]; } else if (track_pageview_option === 'url-with-path') { - should_track = current_url.split('?')[0] !== previous_tracked_url.split('?')[0]; + should_track = current_url.split('#')[0].split('?')[0] !== previous_tracked_url.split('#')[0].split('?')[0]; } if (should_track) { diff --git a/dist/mixpanel.globals.js b/dist/mixpanel.globals.js index 61c37f44..6f72fd16 100644 --- a/dist/mixpanel.globals.js +++ b/dist/mixpanel.globals.js @@ -4512,7 +4512,7 @@ } else if (track_pageview_option === 'url-with-path-and-query-string') { should_track = current_url.split('#')[0] !== previous_tracked_url.split('#')[0]; } else if (track_pageview_option === 'url-with-path') { - should_track = current_url.split('?')[0] !== previous_tracked_url.split('?')[0]; + should_track = current_url.split('#')[0].split('?')[0] !== previous_tracked_url.split('#')[0].split('?')[0]; } if (should_track) { diff --git a/dist/mixpanel.min.js b/dist/mixpanel.min.js index c0aa13d6..62f7dd7f 100644 --- a/dist/mixpanel.min.js +++ b/dist/mixpanel.min.js @@ -82,29 +82,29 @@ o.addEventListener){var h=c.bind(function(){this.u.J.ua||this.u.J.flush({fc:m})} if(this.c("store_google")&&this.c("stop_utm_persistence")){var a=c.info.X(q);c.a(a,function(a,c){this.P(c)}.bind(this))}};e.prototype.pb=function(){this.persistence.ic(w.referrer);this.c("store_google")&&!this.c("stop_utm_persistence")&&this.m(c.info.X());this.c("save_referrer")&&this.persistence.fb(w.referrer)};e.prototype.nc=function(){c.a(this.xa,function(a){this.Da.apply(this,a)},this);this.Y()||c.a(this.ya,function(a){this.k.apply(this,a)},this);delete this.xa;delete this.ya};e.prototype.Da= function(a,b){if(this.c("img"))return this.l("You can't use DOM tracking functions with img = true."),D;if(!la)return this.xa.push([a,b]),D;var c=(new a).Ta(this);return c.o.apply(c,b)};e.prototype.rc=function(a){var b="";this.cb()&&(b=c.info.Ka());if(c.Sa(["full-url","url-with-path-and-query-string","url-with-path"],a)){o.addEventListener("popstate",function(){o.dispatchEvent(new Event("mp_locationchange"))});o.addEventListener("hashchange",function(){o.dispatchEvent(new Event("mp_locationchange"))}); var d=o.history.pushState;if("function"===typeof d)o.history.pushState=function(a,b,c){d.call(o.history,a,b,c);o.dispatchEvent(new Event("mp_locationchange"))};var e=o.history.replaceState;if("function"===typeof e)o.history.replaceState=function(a,b,c){e.call(o.history,a,b,c);o.dispatchEvent(new Event("mp_locationchange"))};o.addEventListener("mp_locationchange",function(){var d=c.info.Ka(),e=D;"full-url"===a?e=d!==b:"url-with-path-and-query-string"===a?e=d.split("#")[0]!==b.split("#")[0]:"url-with-path"=== -a&&(e=d.split("?")[0]!==b.split("?")[0]);e&&this.cb()&&(b=d)}.bind(this))}};e.prototype.mb=function(a,b){if(c.g(a))return q;if(O)return function(c){a(c,b)};var d=this._jsc,e=""+Math.floor(1E8*Math.random()),h=this.c("callback_fn")+"["+e+"]";d[e]=function(c){delete d[e];a(c,b)};return h};e.prototype.k=function(a,b,d,e){var h=m;if(ma)return this.ya.push(arguments),h;var g={method:this.c("api_method"),eb:this.c("api_transport"),jc:this.c("verbose")},j=q;if(!e&&(c.Ua(d)||"string"===typeof d))e=d,d=q; -d=c.extend(g,d||{});if(!O)d.method="GET";var g="POST"===d.method,i=ba&&g&&"sendbeacon"===d.eb.toLowerCase(),k=d.jc;b.verbose&&(k=m);this.c("test")&&(b.test=1);k&&(b.verbose=1);this.c("img")&&(b.img=1);if(!O)if(e)b.callback=e;else if(k||this.c("test"))b.callback="(function(){})";b.ip=this.c("ip")?1:0;b._=(new Date).getTime().toString();g&&(j="data="+encodeURIComponent(b.data),delete b.data);var a=a+("?"+c.kc(b)),n=this;if("img"in b)j=w.createElement("img"),j.src=a,w.body.appendChild(j);else if(i){try{h= -ba(a,j)}catch(o){n.l(o),h=D}try{e&&e(h?1:0)}catch(s){n.l(s)}}else if(O)try{var u=new XMLHttpRequest;u.open(d.method,a,m);var v=this.c("xhr_headers");g&&(v["Content-Type"]="application/x-www-form-urlencoded");c.a(v,function(a,b){u.setRequestHeader(b,a)});if(d.cc&&"undefined"!==typeof u.timeout){u.timeout=d.cc;var y=(new Date).getTime()}u.withCredentials=m;u.onreadystatechange=function(){if(4===u.readyState)if(200===u.status){if(e)if(k){var a;try{a=c.R(u.responseText)}catch(b){if(n.l(b),d.Gc)a=u.responseText; -else return}e(a)}else e(Number(u.responseText))}else a=u.timeout&&!u.status&&(new Date).getTime()-y>=u.timeout?"timeout":"Bad HTTP status: "+u.status+" "+u.statusText,n.l(a),e&&(k?e({status:0,error:a,Q:u}):e(0))};u.send(j)}catch(z){n.l(z),h=D}else j=w.createElement("script"),j.type="text/javascript",j.async=m,j.defer=m,j.src=a,v=w.getElementsByTagName("script")[0],v.parentNode.insertBefore(j,v);return h};e.prototype.za=function(a){function b(a,b){c.a(a,function(a){if(c.isArray(a[0])){var d=b;c.a(a, -function(a){d=d[a[0]].apply(d,a.slice(1))})}else this[a[0]].apply(this,a.slice(1))},b)}var d,e=[],h=[],g=[];c.a(a,function(a){a&&(d=a[0],c.isArray(d)?g.push(a):"function"===typeof a?a.call(this):c.isArray(a)&&"alias"===d?e.push(a):c.isArray(a)&&-1!==d.indexOf("track")&&"function"===typeof this[d]?g.push(a):h.push(a))},this);b(e,this);b(h,this);b(g,this)};e.prototype.qb=function(){return!!this.u.J};e.prototype.Bb=function(){var a="__mpq_"+this.c("token"),b=this.c("api_routes");return this.ib=this.ib|| -{J:{type:"events",D:"/"+b.track,ba:a+"_ev"},Ya:{type:"people",D:"/"+b.engage,ba:a+"_pp"},Qa:{type:"groups",D:"/"+b.groups,ba:a+"_gr"}}};e.prototype.Hc=function(){if(!this.qb()){var a=c.bind(function(a){return new C(a.ba,{A:this.config,Xc:c.bind(function(b,c,e){this.k(this.c("api_host")+a.D,this.kb(b),c,this.mb(e,b))},this),ka:c.bind(function(b){return this.ob("before_send_"+a.type,b)},this),I:this.c("error_reporter"),gd:c.bind(this.ab,this)})},this),b=this.Bb();this.u={J:a(b.J),Ya:a(b.Ya),Qa:a(b.Qa)}}this.c("batch_autostart")&& -this.$a()};e.prototype.$a=function(){this.lc=m;if(this.qb())this.S=m,c.a(this.u,function(a){a.start()})};e.prototype.ab=function(){this.S=D;c.a(this.u,function(a){a.stop();a.clear()})};e.prototype.push=function(a){this.za([a])};e.prototype.disable=function(a){"undefined"===typeof a?this.T.yc=m:this.wa=this.wa.concat(a)};e.prototype.kb=function(a){a=c.ga(a);"base64"===this.c("api_payload_format")&&(a=c.vc(a));return{data:a}};e.prototype.Ea=function(a,b){var d=c.truncate(a.data,255),e=a.D,h=a.Ga,g= -a.ed,j=a.Yc||{},b=b||P,i=m,k=c.bind(function(){j.ac||(d=this.ob("before_send_"+a.type,d));return d?(s.log("MIXPANEL REQUEST:"),s.log(d),this.k(e,this.kb(d),j,this.mb(b,d))):q},this);this.S&&!g?h.Ma(d,function(a){a?b(1,d):k()}):i=k();return i&&d};e.prototype.o=M(function(a,b,d,e){!e&&"function"===typeof d&&(e=d,d=q);var d=d||{},h=d.transport;if(h)d.eb=h;h=d.send_immediately;"function"!==typeof e&&(e=P);if(c.g(a))this.l("No event name provided to mixpanel.track");else if(this.lb(a))e(0);else{b=c.extend({}, -b);b.token=this.c("token");var g=this.persistence.Rc(a);c.g(g)||(b.$duration=parseFloat((((new Date).getTime()-g)/1E3).toFixed(3)));this.pb();g=this.c("track_marketing")?c.info.Lc():{};b=c.extend({},c.info.$({mp_loader:this.c("mp_loader")}),g,this.persistence.$(),this.O,b);g=this.c("property_blacklist");c.isArray(g)?c.a(g,function(a){delete b[a]}):this.l("Invalid value for property_blacklist config: "+g);return this.Ea({type:"events",data:{event:a,properties:b},D:this.c("api_host")+"/"+this.c("api_routes").track, -Ga:this.u.J,ed:h,Yc:d},e)}});e.prototype.cd=M(function(a,b,d){c.isArray(b)||(b=[b]);var e={};e[a]=b;this.m(e);return this.people.set(a,b,d)});e.prototype.sc=M(function(a,b,c){var e=this.s(a),h={};e===l?(h[a]=[b],this.m(h)):-1===e.indexOf(b)&&(e.push(b),h[a]=e,this.m(h));return this.people.fa(a,b,c)});e.prototype.Sc=M(function(a,b,c){var e=this.s(a);if(e!==l){var h=e.indexOf(b);-1=u.timeout?"timeout":"Bad HTTP status: "+u.status+" "+u.statusText,n.l(a),e&&(k?e({status:0,error:a,Q:u}):e(0))};u.send(j)}catch(z){n.l(z),h=D}else j=w.createElement("script"),j.type="text/javascript",j.async=m,j.defer=m,j.src=a,v=w.getElementsByTagName("script")[0],v.parentNode.insertBefore(j,v);return h};e.prototype.za=function(a){function b(a,b){c.a(a,function(a){if(c.isArray(a[0])){var d= +b;c.a(a,function(a){d=d[a[0]].apply(d,a.slice(1))})}else this[a[0]].apply(this,a.slice(1))},b)}var d,e=[],h=[],g=[];c.a(a,function(a){a&&(d=a[0],c.isArray(d)?g.push(a):"function"===typeof a?a.call(this):c.isArray(a)&&"alias"===d?e.push(a):c.isArray(a)&&-1!==d.indexOf("track")&&"function"===typeof this[d]?g.push(a):h.push(a))},this);b(e,this);b(h,this);b(g,this)};e.prototype.qb=function(){return!!this.u.J};e.prototype.Bb=function(){var a="__mpq_"+this.c("token"),b=this.c("api_routes");return this.ib= +this.ib||{J:{type:"events",D:"/"+b.track,ba:a+"_ev"},Ya:{type:"people",D:"/"+b.engage,ba:a+"_pp"},Qa:{type:"groups",D:"/"+b.groups,ba:a+"_gr"}}};e.prototype.Hc=function(){if(!this.qb()){var a=c.bind(function(a){return new C(a.ba,{A:this.config,Xc:c.bind(function(b,c,e){this.k(this.c("api_host")+a.D,this.kb(b),c,this.mb(e,b))},this),ka:c.bind(function(b){return this.ob("before_send_"+a.type,b)},this),I:this.c("error_reporter"),gd:c.bind(this.ab,this)})},this),b=this.Bb();this.u={J:a(b.J),Ya:a(b.Ya), +Qa:a(b.Qa)}}this.c("batch_autostart")&&this.$a()};e.prototype.$a=function(){this.lc=m;if(this.qb())this.S=m,c.a(this.u,function(a){a.start()})};e.prototype.ab=function(){this.S=D;c.a(this.u,function(a){a.stop();a.clear()})};e.prototype.push=function(a){this.za([a])};e.prototype.disable=function(a){"undefined"===typeof a?this.T.yc=m:this.wa=this.wa.concat(a)};e.prototype.kb=function(a){a=c.ga(a);"base64"===this.c("api_payload_format")&&(a=c.vc(a));return{data:a}};e.prototype.Ea=function(a,b){var d= +c.truncate(a.data,255),e=a.D,h=a.Ga,g=a.ed,j=a.Yc||{},b=b||P,i=m,k=c.bind(function(){j.ac||(d=this.ob("before_send_"+a.type,d));return d?(s.log("MIXPANEL REQUEST:"),s.log(d),this.k(e,this.kb(d),j,this.mb(b,d))):q},this);this.S&&!g?h.Ma(d,function(a){a?b(1,d):k()}):i=k();return i&&d};e.prototype.o=M(function(a,b,d,e){!e&&"function"===typeof d&&(e=d,d=q);var d=d||{},h=d.transport;if(h)d.eb=h;h=d.send_immediately;"function"!==typeof e&&(e=P);if(c.g(a))this.l("No event name provided to mixpanel.track"); +else if(this.lb(a))e(0);else{b=c.extend({},b);b.token=this.c("token");var g=this.persistence.Rc(a);c.g(g)||(b.$duration=parseFloat((((new Date).getTime()-g)/1E3).toFixed(3)));this.pb();g=this.c("track_marketing")?c.info.Lc():{};b=c.extend({},c.info.$({mp_loader:this.c("mp_loader")}),g,this.persistence.$(),this.O,b);g=this.c("property_blacklist");c.isArray(g)?c.a(g,function(a){delete b[a]}):this.l("Invalid value for property_blacklist config: "+g);return this.Ea({type:"events",data:{event:a,properties:b}, +D:this.c("api_host")+"/"+this.c("api_routes").track,Ga:this.u.J,ed:h,Yc:d},e)}});e.prototype.cd=M(function(a,b,d){c.isArray(b)||(b=[b]);var e={};e[a]=b;this.m(e);return this.people.set(a,b,d)});e.prototype.sc=M(function(a,b,c){var e=this.s(a),h={};e===l?(h[a]=[b],this.m(h)):-1===e.indexOf(b)&&(e.push(b),h[a]=e,this.m(h));return this.people.fa(a,b,c)});e.prototype.Sc=M(function(a,b,c){var e=this.s(a);if(e!==l){var h=e.indexOf(b);-1(y.__SV||0)?s.H("Version mismatch; please ensure you're using the latest version of the Mixpanel code snippet."):(c.a(y._i,function(a){a&&c.isArray(a)&&(F[a[a.length-1]]=S.apply(this,a))}),Ba(),y.init(),c.a(F,function(a){a.ja()}),Aa())})()})(); })(); diff --git a/dist/mixpanel.umd.js b/dist/mixpanel.umd.js index 1ea16847..dbbea75f 100644 --- a/dist/mixpanel.umd.js +++ b/dist/mixpanel.umd.js @@ -4515,7 +4515,7 @@ } else if (track_pageview_option === 'url-with-path-and-query-string') { should_track = current_url.split('#')[0] !== previous_tracked_url.split('#')[0]; } else if (track_pageview_option === 'url-with-path') { - should_track = current_url.split('?')[0] !== previous_tracked_url.split('?')[0]; + should_track = current_url.split('#')[0].split('?')[0] !== previous_tracked_url.split('#')[0].split('?')[0]; } if (should_track) { diff --git a/examples/commonjs-browserify/bundle.js b/examples/commonjs-browserify/bundle.js index fee648fb..9f02e043 100644 --- a/examples/commonjs-browserify/bundle.js +++ b/examples/commonjs-browserify/bundle.js @@ -4525,7 +4525,7 @@ MixpanelLib.prototype._init_url_change_tracking = function(track_pageview_option } else if (track_pageview_option === 'url-with-path-and-query-string') { should_track = current_url.split('#')[0] !== previous_tracked_url.split('#')[0]; } else if (track_pageview_option === 'url-with-path') { - should_track = current_url.split('?')[0] !== previous_tracked_url.split('?')[0]; + should_track = current_url.split('#')[0].split('?')[0] !== previous_tracked_url.split('#')[0].split('?')[0]; } if (should_track) { diff --git a/examples/es2015-babelify/bundle.js b/examples/es2015-babelify/bundle.js index 97987f71..e2688795 100644 --- a/examples/es2015-babelify/bundle.js +++ b/examples/es2015-babelify/bundle.js @@ -1119,7 +1119,7 @@ MixpanelLib.prototype._init_url_change_tracking = function (track_pageview_optio } else if (track_pageview_option === 'url-with-path-and-query-string') { should_track = current_url.split('#')[0] !== previous_tracked_url.split('#')[0]; } else if (track_pageview_option === 'url-with-path') { - should_track = current_url.split('?')[0] !== previous_tracked_url.split('?')[0]; + should_track = current_url.split('#')[0].split('?')[0] !== previous_tracked_url.split('#')[0].split('?')[0]; } if (should_track) { diff --git a/examples/umd-webpack/bundle.js b/examples/umd-webpack/bundle.js index dee49bb3..f80d4e0a 100644 --- a/examples/umd-webpack/bundle.js +++ b/examples/umd-webpack/bundle.js @@ -4578,7 +4578,7 @@ } else if (track_pageview_option === 'url-with-path-and-query-string') { should_track = current_url.split('#')[0] !== previous_tracked_url.split('#')[0]; } else if (track_pageview_option === 'url-with-path') { - should_track = current_url.split('?')[0] !== previous_tracked_url.split('?')[0]; + should_track = current_url.split('#')[0].split('?')[0] !== previous_tracked_url.split('#')[0].split('?')[0]; } if (should_track) { diff --git a/src/mixpanel-core.js b/src/mixpanel-core.js index 6aed87ce..c536064e 100644 --- a/src/mixpanel-core.js +++ b/src/mixpanel-core.js @@ -448,7 +448,7 @@ MixpanelLib.prototype._init_url_change_tracking = function(track_pageview_option } else if (track_pageview_option === 'url-with-path-and-query-string') { should_track = current_url.split('#')[0] !== previous_tracked_url.split('#')[0]; } else if (track_pageview_option === 'url-with-path') { - should_track = current_url.split('?')[0] !== previous_tracked_url.split('?')[0]; + should_track = current_url.split('#')[0].split('?')[0] !== previous_tracked_url.split('#')[0].split('?')[0]; } if (should_track) { diff --git a/tests/test.js b/tests/test.js index b61bf6c4..736bffec 100644 --- a/tests/test.js +++ b/tests/test.js @@ -3811,6 +3811,9 @@ }); test("init with track_pageview=true fires page view event", 2, function() { + var next_url = window.location.protocol + "//" + window.location.host + window.location.pathname + window.history.pushState({ path: next_url }, '', next_url); + mixpanel.init("track_pageview_test_token", { track_pageview: true, batch_requests: false, @@ -3820,7 +3823,33 @@ same(last_event.event, "$mp_web_page_view", "last request should be $mp_web_page_view event"); }); + test("init with track_pageview='url-with-path' tracks page views correctly", 5, function() { + var next_url = window.location.protocol + "//" + window.location.host + window.location.pathname + window.history.pushState({ path: next_url }, '', next_url); + + mixpanel.init("track_pageview_test_token", { + track_pageview: "url-with-path", + batch_requests: false, + }, 'pageviews_pathonly'); + same(this.requests.length, 1, "init with track_pageview='url-with-path' should fire single request on load"); + var last_event = getRequestData(this.requests[0]); + same(last_event.event, "$mp_web_page_view", "last request should be $mp_web_page_view event"); + + window.dispatchEvent(new Event("mp_locationchange")); + same(this.requests.length, 1, "mp_locationchange event should not fire page view event on no URL change"); + + window.location.href = window.location.href.split('#') + '#anchor' + same(this.requests.length, 1, "init with track_pageview='url-with-path' should not fire additional request on hash change"); + + var next_url = window.location.protocol + "//" + window.location.host + window.location.pathname + '?hello=world'; + window.history.pushState({ path: next_url }, '', next_url); + same(this.requests.length, 1, "init with track_pageview='url-with-path' should not fire request on query string change"); + }); + test("init with track_pageview='url-with-path-and-query-string' tracks page views correctly", 6, function() { + var next_url = window.location.protocol + "//" + window.location.host + window.location.pathname + window.history.pushState({ path: next_url }, '', next_url); + mixpanel.init("track_pageview_test_token", { track_pageview: "url-with-path-and-query-string", batch_requests: false, @@ -3832,13 +3861,13 @@ window.dispatchEvent(new Event("mp_locationchange")); same(this.requests.length, 1, "mp_locationchange event should not fire page view event on no URL change"); - var next_url = window.location.protocol + "//" + window.location.host + window.location.pathname + '?hello=world'; + var next_url = window.location.protocol + "//" + window.location.host + window.location.pathname + '?next=query'; window.history.pushState({ path: next_url }, '', next_url); same(this.requests.length, 2, "init with track_pageview='url-with-path-and-query-string' should fire request on query string change"); var last_event = getRequestData(this.requests[1]); same(last_event.event, "$mp_web_page_view", "last request should be $mp_web_page_view event"); - window.location.href = window.location.href.split('#')[0] + '#anchor' + window.location.href = window.location.href.split('#')[0] + '#anotheranchor' same(this.requests.length, 2, "init with track_pageview='url-with-path-and-query-string' should not fire additional request on hash change"); }); }