👬 👭 Poor intrusive way to make A/B Testing by using an HoC instead of components
Switch branches/tags
Nothing to show
Clone or download
Latest commit e53751a Nov 2, 2017
Permalink
Failed to load latest commit information.
Example Rename Oct 31, 2017
setup Add prettier Oct 26, 2017
src Fixing tests for default props noop Oct 31, 2017
.babelrc First Jun 30, 2017
.buckconfig First Jun 30, 2017
.eslintrc.js Add prettier Oct 26, 2017
.flowconfig First Jun 30, 2017
.gitattributes First Jun 30, 2017
.gitignore Initialize project Jul 3, 2017
.travis.yml Initialize project Jul 3, 2017
.watchmanconfig First Jun 30, 2017
README.md Rename Oct 31, 2017
app.json First Jun 30, 2017
index.js Initialize project Jul 3, 2017
package.json Bump package version Nov 2, 2017
yarn.lock Rename Oct 31, 2017

README.md

Build Status Coverage Status License: MIT

Poor intrusive way to make A/B Testing by using an HoC instead of components.



Usage

Installation

$ npm install --save rn-ab-hoc

Component

/* list.js */

import abConnect from 'rn-ab-hoc';
import FlatList from './flatList.js';
import ListView rom './listView.js';
import OtherList rom './otherList.js';

export default abConnect('ListExperiment',
 { variant: 'FlatList', component: FlatList },
 { variant: 'ListView', component: ListView },
 { variant: 'OtherList', component: OtherList }
);

The previous code defines :

  • An experiment name
  • A list of different variants with their names and associated components

Using a random variant

/* app.js */

import React from 'react';
import List from './list';

export default function App() {
    return (
      <List />
    );
}

This will load one of the three previous components (variants) defined using a randomize function

Forcing a variant

/* app.js */

import React from 'react';
import List from './list';

export default function App() {
    return (
      <List variant="FlatList" />
    );
}

This will force a specific variant (maybe sent by your backend) to be used inside the app.

Note that the forced variant takes over the random one. If you set a variant by forcing it, the previous random one will be erased and replaced by the forced one. Inverse is not true.

Which variant am I using ?

/* app.js */

import React from 'react';
import List from './list';

export default function App() {
    return (
      <List
        variant="FlatList"
        onVariantSelect={(variant) => console.log(variant)}
      />
    );
}

This will print FlatList. It also work with random variants.

Storage

The default storage system is AsyncStorage with a key that follows the pattern :

abhoc-variant-${experiment}

In the previous case, it would have been :

abhoc-variant-ListExperiment