Has anyone set up successfully the content experiments api on single page apps?
I have a single page app, where I want to run a/b tests. So I decided to try and integrate google experiments.
How it is set up
For each page I want to test, I have a couple of views.
In the ViewModel for these routes, I have the views in an array:
const variations = ['login/original-login.html', 'v1-login.html'];
Before my view is rendered, I create a new script tag with the appropriate src and write it to document.
//www.google-analytics.com/cx/api.js?experiment=${experimentId}
When the script is loaded, I choose the variation by calling
cxApi.chooseVariation() and based on the returned value a view is rendered.
variations[cxApi.chooseVariation()];
At this point, I'm sending an event hit to GA (as per documentation). Because the pageview event is sent before cxApi has loaded.
The problem
As this is a single page app, the window doesn't refresh after I navigate from one route to another. And this means that the last loaded experiment's data is sent to every GA hit.
Do you guys have any solution for this problem? I will be grateful if you can suggest another approach or technology for running experiments in your single page apps.