How to track users time on a site up to the point of them clicking a particular link

[jimb0b]

Hey all,

I would like to know if it is possible to track the amount of time that a user is on a particular page on my site before they interact with a specific link I have on that page. Is there any way to do this?

Please let me know if I can provide more details, and as always, thank you for your time.

Have a great day!

[alexbishop]

There are various examples of how to achieve this with JavaScript but could you explain a bit more about where/how you want to use that information? 

[jimb0b]

So at a high level, the people I am setting this up for want to track if different locations for a button will effect the speed at which a customer clicks the button. I believe I figured out how to get the value I need, as I have written some Javascript code that stores the time at which a user lands on the page and the time at which the user clicks a certain button and then performs a calculation to get the difference, and I have added this code to the activity.
My new problem is that the code works as expected the first time I land on the page with the activity set up on it and I click the button I am tracking. But after the first visit to the activity page (whether I clicked the button or not) the custom code I wrote no longer runs. Do you have any insight as to why that may happen. NOTE: this is running in a SPA Angular app.

Let me know if I can clear anything up or answer any questions.

Thanks!

[alexbishop]

Assuming you're using the at.js v2 Target library, I would guess, based on your description, that it's because the activity was created against the Page Load event. I'm not sure how familiar you are with Target implementation on SPA but I'll assume not at all - for an SPA implementation the best practice is to implement the triggerView() method on each view/state change (see example here) so that Target knows an action has been taken

Basic implementation idea would then be:
i) You land on homepage, Target library handles the Page Load event
ii) You navigate to page 2, at which point your application calls triggerView('page2')
iii) You navigate back to homepage, at which point triggerView('homepage') call is made

In your example, you would have your code running as it is now on the Page Load event and then you would also add a second modification (I'm assuming you're using the Visual Editor) connected to the triggerView('homepage') event. That would then ensure that your code runs again when the page is navigated back to again.

[jimb0b]

Thanks for your continued engagement on this post!

So we are using at.js v2, and I had all the code, and some additional personalization, set up on the page view (for this example we will say the view is for a contact page, with the view being equal to 'Contact').
Currently I have the code for tracking time, and some personalization set up on the 'Contact' view, and I also have a copy of the code modification which is on the Page Load Event. I also have the Activity Location set up to 'https://www.sitename.com/contact or any page that starts with https://www.sitename.com'. And with this current implementation if I first land on the homepage (or any page other than the Activity page) I can see that the code runs, and when I navigate to to Contact page, I can see the personalization I set up, but it seems the code does not run. However, if I refresh the Contact page, I see the code runs. Another scenario showing issues is that when I land directly on the Contact page, I see the code runs and the personalization is present. But when I navigate away from the page, and then back to it, the code does not run when the page loads but the personalization is still there. The code only runs after a page refresh.
I understand that is a lot, but if you have any insights at all as to things that can be attempted to try and resolve this I will be forever grateful.  

[alexbishop · Accepted solution]

If the personalisation works but the code doesn't then how about if you put a simple console log statement in your Custom Code modification, does that execute successfully when you navigate away from the page and then back to it? If that works then it suggests there's something within your time tracking code that's not working, if that doesn't work then it's likely a more fundamental issue with implementation.