Objective
This article will give you an example of how to capture custom metrics from the Kaspersky homepage with the help of Catchpoint'sinsight feature and store the captured data to analyze it in the portal.
Prerequisites
- Access to the Catchpoint portal with create/modify test permission.
- Basic understanding of Navigation Timing API.
- Working knowledge of runScript, storeScriptVariable, and setIndicator script commands.
Process
-
Login to the portal
-
Set up Insight indicator (Guide for Insight Settings).
-
Create a transaction test or run an instant transaction test using the script given below.
-
Hit Save and your Transaction test to capture custom metrics are ready!
Script
// Step - 1
open("https://www.kaspersky.co.za/about")
waitForUrl("https://www.kaspersky.co.za/resources/template/html/modules/_shared/components/site-header/templates/search-bar_main-nav.html")
setStepName("1. Africa About Us Page")
// Get the custom metric using JavaScript.
runScript("var timingObj = timing.getTimes(); var firstPaintTimeVal=timingObj.firstPaintTime;")
runScript("var totalLoadTimeVal = performance.timing.loadEventEnd - performance.timing.fetchStart;")
runScript("var totalbackendTimeVal = performance.timing.responseEnd - performance.timing.fetchStart;")
runScript("var totalfrontendTimeVal = (performance.timing.domComplete - performance.timing.domInteractive) + (performance.timing.domInteractive - performance.timing.responseEnd)")
runScript("var backendNetworkTimeVal = performance.timing.connectEnd - performance.timing.connectStart;")
// Store the values in script variable. storeScriptVariable("firstPaintTime", "firstPaintTimeVal;")
storeScriptVariable("totalLoadTime", "totalLoadTimeVal;")
storeScriptVariable("totalbackendTime", "totalbackendTimeVal;")
storeScriptVariable("totalfrontendTime", "totalfrontendTimeVal;")
storeScriptVariable("backendNetworkTime", "backendNetworkTimeVal;")
// store the value in indicator. setIndicator("token_here", "${var(firstPaintTime)}")
setIndicator("token_here", "${var(totalLoadTime)}")
setIndicator("token_here", "${var(totalbackendTime)}")
setIndicator("token_here", "${var(totalfrontendTime)}")
setIndicator("token_here", "${var(backendNetworkTime)}")