A lightweight A/B Testing library for use with MixPanel
<script type="text/javascript" src="mixpanel.js"></script>
<script type="text/javascript" src="scenario.js"></script>var test = new Scenario('My Test Name')
.test('Test A')
.test('Test B')
.go();
test.complete();Scenario( String testName ): Initializes a new test and returns two functions,test, andgo.test( String name[, function fn] ): Adds a test variant.nameis the name of the variant, and an optional function may be passed in the second parameter that will execute if the test case is chosen. In addition, thebodyhas the test cases name added to it in the form of a slug, so"Test Case A"will be added to the body as"test-case-a"go(): Rolls the dice and calls one of the variants. Returns the instance based method(s)complete.complete(): Finishes the test sequence.
MixPanel is required with Scenario.
Once the go() function has been called, the initial tracking event occurs:
mixpanel.track( "My Test Name Start" );Shortly after a test is chosen, another tracking event occurs. This one records the test case used:
mixpanel.track("My Test Name Mid", {
test: "Test A"
});Once the complete() function has been called, the final tracking occurs:
mixpanel.track( "My Test Name Finish" );Navigate to MixPanel and click Funnels. Create a funnel that includes the testName Load, testName, and testName Finish, then click Save.
var test = new Scenario( 'Homepage Signup Conversions' )
.test( 'Home V1' )
.test( 'Home V2' )
.go();
signup.on('click', function(){
test.complete();
});This results in the body tag being appended with a css class like the following:
<body class="home-v1">Alternatively, you can handle your test differences with JavaScript:
var test = new Scenario( 'Homepage Signup Conversions' )
.test( 'Home V1', function(){
// Do something optional
})
.test( 'Home V2', function(){
// Do something optional
})
.go();
signup.on('click', function(){
test.complete();
});MIT
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent