Using startTrackPage in Application Insights - javascript

I have recently been messing around with Application Insights and have been having a problem with getting the JavaScript API to work. In the default script that you are supposed to add to your page, they use the function trackPageView(). This seems to works, but I had also wanted to gather information about how long a user stayed on the page. I found the startTrackPage() and stopTrackPage() functions and tried to use those to get the information, but I always receive an error from startTrackPage().
Uncaught TypeError: appInsights.startTrackPage is not a function(anonymous function)
I have stepped through the code and the function does not seem to be created at the point I am calling it. trackPageView() is already defined though. I tried calling the function after the document loaded as well and that still failed. However, I can call it from the developer console once the page loads.
Here is where I found the information about startTrackPage() and stopTrackPage() originally. Other than that I have just been perusing around to see if anyone else has encountered this.
I appreciate the help.
Default code from App Insight:
window.appInsights = appInsights;
appInsights.startPageView();
What I have tried:
window.appInsights = appInsights;
appInsights.startTrackPage();
window.onunload = function () {
appInsights.stopTrackPage();
};

Short answer: unfortunately there's currently no way to use appInsights.startTrackPage() in the way you intend reliably.
Long answer: The reason is that startTrackPage() method is only defined in the JS that is downloaded from CDN, so until it is downloaded it is not defined.
What you could do it something like:
appInsights.queue.push(function(){appInsights.startTrackPage();})
however this would not produce correct measurement, because tracking won't start right away.
So your best approach would be record start time manually, however even that you cannot do reliably. First of all you absolutely don't want to use onunload event as at this point it will be too late for Application Insights SDK to send the data so it will most likely get lost. Using onbeforeunload and flush() will help with this problem a little bit:
var pageStart = +new Date;
window.addEventListener("beforeunload", function () {
appInsights.trackMetric("timeOnPage", (+new Date)-pageStart);
appInsights.flush();
});
However even when using onbeforeunload you are looking at high number of potential data losses - you cannot guarantee that ajax request to send data to Application Insights will complete before page navigates away and connection is interrupted. In my testing with IE was getting about 50% of losses.

Related

JSON Parse error: Unrecognized token '!' - error caught by Sentry

The error in the title is caught by Sentry (an error tracking tool). Below is a screenshot from Sentry - showing the stack trace.
Note: the script /en_US/iab.autofill.payment.js where handleMessage is located is loaded from Facebook (link here), and I couldn't find this script in the javascript bundle, nor anything related to it. I assume it's loaded by a 3rd party script - I'm using Google Tag Manager (which is also loading Facebook Pixel), Segment (loading Hotjar and Mixpanel), and Snapchat. The error started to appear without any changes in these scripts or the services that they're sending data to.
Note 2: It seems that the error is triggered quite often, about 10-15% of the time. I tried to reproduce it but given that it's a handled error, it doesn't show in the dev console.
Any direction on where to look would be much appreciated.
I'm seeing this a lot, and it seems to be coming 100% from users using Facebook browser on iOS (I guess this is the browser you see when you're using the Facebook app).
I tried to debug this with a snippet:
<script>
window.addEventListener('message', function (e) {
console.log(e);
JSON.parse(e.data);
console.log('foo');
}, false);
</script>
This is from the library you linked. Assuming that e.data is JSON string (not e.g. an object?), without any safeguard seems to be breaking things.
The second console.log doesn't fire, so I think this is causing some unexpected behaviours in my case (buttons not reacting to clicks with js listeners etc)
I don't know if there is a workaround or a way to protect from this in Facebook embedded browser (I guess it's loaded there)
Looking forward to hear more info
i have meet that too, its because the one script facebook inject in. will postMessage(Object), but the another script will listen the message and try to JSON.parse an object ,so it will came out a error. u can use 'vconsole' lib, and add a window.addEventListener('message',(e)=>{console.log(e.data)}) and u can see that
Apparently, the issue went away after a couple of weeks without changing anything on my side.

javascript that executes when leaving page - updating legacy code

Just a bit of background - I was updating a legacy feature that is all javascript as there was new functionality being added to our web app that the legacy feature had to interact with.
While testing this update we noticed that there was an issue when moving from page to page within the web app - the legacy feature is supposed to follow you if it has been activated.
Basically the data from the activated feature wasn't being retained. There is some code in there that was supposed to do this. After some investigation it was discovered that it is working as expected in IE/Edge and Firefox but the exit code is not getting executed in Google Chrome and Safari.
This might explain why the business wasn't aware of the issue but it's been confirmed that the issue is also in the live site so hasn't been recently introduced as I believe most of the users would be on IE.
The code that was managing the exit functionality was as follows:
if(window.onpagehide || window.onpagehide === null){
window.addEventListener("pagehide", storeDataFunction, false);
} else {
window.addEventListener("unload", storeDataFunction, false);
}
With the above code the logic within the storeDataFunction doesn't even execute when you attempt to leave the page.
After some browsing on here and other forums I have updated the above to:
window.onbeforeunload = storeDataFunction;
and made storeDataFunction return null.
This appears to be slightly better in that the storeDataFunction is getting executed when moving pages but deep within it there is an ajax POST to a controller in our web app that stores the data necessary to check if the feature is active and what it has done and this ajax request does not get executed.
Again this is only on Chrome and Safari and works fine on IE and Firefox.
So what I'm looking for is a steer. Am I heading down the wrong path using onbeforeunload for what we want to achieve here? Or was the original use of pagehide/unload more appropriate?
Are both of those incorrect and there is a better way of doing it?
This feature was developed about 7 years ago so I'm not even sure if it ever worked on Chrome or if it did at time of development and some more recent updates in Chrome changed they way it handles page termination.
Thanks in advance.
Looks like Google have updated Chrome to stop XHR during page dismissal.
https://www.chromestatus.com/feature/4664843055398912

appMobi / phonegap setting/deleting cookie click action required 2 times before working?

I can't figure out for the life of me whats up with this. I dunno if this is appMobi/phonegap centric, cause they have there own special ways of setting cookies, and handling them. But I have what seems to be a unique problem overall, and it only occurs in the process of actually writing a cookie for the first time. Or removing it if it exists which is kind of like writing it.
Anyway I have 2 functions that worked perfectly up til the point of introducing the cookies to them. But I need the cookies also as its part of a login check, and a handful of other things. So this is my issue.
I type my user/pass, hit login. get nothing. hit login again, works.
I hit logout after being logged in, nothing works. hit it again.. works..
These are ajax driven functions as well. Dunno if that has anything to do with it or not, but in both cases cookies are being written in one shape form or another and thats when the functions seem to break in respect to the fact that I need to click the buttons that trigger them twice to get the desired effect despite them being a single click action.
If I remove the cookie lines from my functions everything works normally again without problem, with exception that the cookies are required to actually use half the stuff I am building. Also its a lone cookie being written with a numeric value.
Ideas?
AppMobi.cache.setCookie('AutoRemember', uid, 90);
This one line if its there, i have to double click for my functions to work, if its not there my functions work as expected..
a sample of one of my function would be (quickly typing one out here for example sake)
$('#buttonX').click(function(){
url = 'http://www.domain.com';
$.post(url, function(data)
{
if(data.status == "good")
{
AppMobi.cache.setCookie('AutoRemember', uid, 90);
window.location = 'dashboard.html';
}
}, 'json')
});
Ah yes, I ran into the same thing. You'll need to download and init the local_bootstrap.js lib and something from "Develop In Eclipse For Android " (I downloaded the .zip "appMobi Cloud Services library for PhoneGap Android development"). I'm doing the Android app with Eclipse, and I assume you are too, your post didn't mention what IDE you were using.
The .zip file has a great readme.txt on where & what to copy (.java files, jar file, etc.)
found here: http://www.appmobi.com/?q=node/85
Well, come to find out or as far as I can figure at least. This appears to be a glitch between browser and emulator more so than it is my coding. When I run the app in the sandboxed appMobi application from "Test Anywhere" things work as expected all around.
I will be opening up a bug ticked on appMobi where every they take bug reports and I will come back here with a link later so others may follow it as well when and if they come across a similar issue.

page area not refreshing using jquery and setinterval

i am trying to refresh a particular area of my php page, which will load the updated information from database. My code are working on localhost. But, when the same code i'm trying to execute on my domain. Then, it is not refreshing and not showing updated information, and i don't why... Anybody have any idea..
setInterval(updateShouts, 10000 );
function updateShouts(){
$('#refresh').load('ajax/check.php');
};
this is the code, which i'm using for refreshing the
.
I'd check that the URL is correct:
You can use Firebug (or another Javascript debugger) to watch the request going out, and you can see if it was a 404 error or if it worked.
Also, in the Console, just type in $('#refresh') and make sure it returns an actual object.
if it just displays [] or undefined, then the selector is wrong.
Try:
function updateShouts()
{
$('#refresh').load('ajax/check.php');
};
setInterval(function(){updateShouts();}, 10000 );
Problem is with most localhost dev servers the configuration, security, etc.. is usually at the load end of the scale vs a host else where. So that may or may not be part of the issue, I couldn't say for sure though
Edit I agree with the notion of checking to make sure the path ajax/check.php is valid also. And that Firebug is a very handy tool to have when developing with jquery (or javascript stand alone)

Crm 2011 with no javascript customizations gives onload errors

we are getting the following error in almost all create or edit entity forms. the systems is not customized at all and it works perfectly:
There was an error in the fields customized event.
field:window
event:onload
error:object doesn't support this property or method
after debugging the error I found out that it is happening in FormScript.js.aspx page in the following code block:
var eContext=Mscrm.FormUtility.constructExecutionObject(eventObj,0,null,null);
eContext=Mscrm.FormUtility.constructExecutionObject(eventObj,0,null,eContext)
Mscrm.Form_onload();
Mscrm.Form_onload() is what causing the error to happen.
do you have any idea why is this happening?
It was a server side problem. I don't know exactly why it happens. we also tried to do an installation repair but that didn't solve it. Finally, we installed a fresh CRM 2011 copy on a new server, imported the database and ran Data migration manager. and the error disappeared.
Are you absolutely positive there is no script attached to run on load of any of the entities that are having issues? That particular function should just run any custom script you have on the entity, so I don't see any other cause.
Odd, there is certainly some garbage in there somewhere
function crmForm_window_onload_handler(eventObj,eventArgs){
try{
var eContext=Mscrm.FormUtility.constructExecutionObject(eventObj,0,null,null);
eContext=Mscrm.FormUtility.constructExecutionObject(eventObj,0,null,eContext)
loadInsideView();
eContext=Mscrm.FormUtility.constructExecutionObject(eventObj,1,null,eContext)
CEI.Initialize();
} catch(e) {
displayError('window', 'onload', e.description);
}
}
Here is one from our system on the account form. I have no idea how this could have happened, but I would check the events for the page (not just the onload). I would also try adding a JavaScript web resource with a generic event to the onload to see if by toggling it on, the system might clean itself up. You may have to call Microsoft or find the issue in your 4.0 and fix it to do another re-install. I feel for you on this one!

Categories

Resources