{"id":25531945,"url":"https://github.com/evermade/ab-testing-toolkit","last_synced_at":"2025-08-17T14:03:39.769Z","repository":{"id":204870502,"uuid":"712813415","full_name":"evermade/ab-testing-toolkit","owner":"evermade","description":"JavaScript toolkit to create A/B tests that send Data Layer events for analytics","archived":false,"fork":false,"pushed_at":"2023-11-01T11:04:12.000Z","size":120,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-08-08T16:04:15.141Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/evermade.png","metadata":{"files":{"readme":"README.md","changelog":"changelog.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2023-11-01T08:52:43.000Z","updated_at":"2023-11-01T10:45:39.000Z","dependencies_parsed_at":null,"dependency_job_id":"acea45ae-31f3-4a1b-91fc-86ccb4567e98","html_url":"https://github.com/evermade/ab-testing-toolkit","commit_stats":null,"previous_names":["evermade/ab-testing-toolkit"],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/evermade/ab-testing-toolkit","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/evermade%2Fab-testing-toolkit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/evermade%2Fab-testing-toolkit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/evermade%2Fab-testing-toolkit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/evermade%2Fab-testing-toolkit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/evermade","download_url":"https://codeload.github.com/evermade/ab-testing-toolkit/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/evermade%2Fab-testing-toolkit/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":270856775,"owners_count":24657700,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-17T02:00:09.016Z","response_time":129,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-02-20T01:42:29.767Z","updated_at":"2025-08-17T14:03:39.745Z","avatar_url":"https://github.com/evermade.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# A/B Testing Toolkit\n\nThis is a JavaScript tool for A/B testing. You can register tests, split visitors automatically evenly for variants and send events via Data Layer for example to Google Analytics. This library doesn't track data itself and only saves user's showed variants to their browser's local storage.\n\nNote that under GDPR and similar laws running A/B testing might require user's consent. This library doesn't handle consent and you need to handle it yourself before running tests.\n\n## Demos\n\n* [A/B Test on Page Load](https://evermade.github.io/ab-testing-toolkit/)\n* [A/B Test on Custom Trigger](https://evermade.github.io/ab-testing-toolkit/trigger.html)\n\n### Usage\n\nIf you’re using a bundler (such as Webpack or Rollup), you can install through npm:\n\n```bash\nnpm install @evermade/ab-testing-toolkit\n```\n\nImport the `abTestManager`, register and run tests.\n\n```js\nimport { abTestManager } from \"@evermade/ab-testing-toolkit\n\nconst abTest = abTestManager();\n\nabTest.register({\n\tid: '2023-11-new-header-cta',\n\tname: 'Change color of header CTA',\n\tdebug: true, // show console logs\n\tvariants: [\n\t\t{\n\t\t\tslug: 'a-original',\n\t\t\tname: 'A: Original',\n\t\t\tonRun: () =\u003e {},\n\t\t},\n\t\t{\n\t\t\tslug: 'variant-b',\n\t\t\tname: 'B: New CTA button color',\n\t\t\tonRun: () =\u003e {\n\t\t\t\t// apply variant changes for example via CSS classes, JS manipulation etc\n\t\t\t\tdocument.body.classList.add('is-ab-test-new-header-cta');\n\t\t\t},\n\t\t},\n\t]\n});\nabTest.run('2023-11-new-header-cta');\n```\n\n## Previewing your tests\n\nYou can verifify that your tests are working easiest by visiting the URLs that force theses variants to be shown. For example if you have test with ID `2023-11-new-header-cta` and variant with slug `variant-b` you can visit URL `/?ab-test={id}\u0026ab-variant={slug}` to force variant to be shown.\n\nYou don't need to create these URLs manually. When you are running it on debug mode, these URLs are provided console.\n\nYou can run toolkit in debug at any point by registering test with `debug: true` or adding `?ab-test-debug` to your current URL.\n\n## How variant is chosen\n\nThere are three ways to choose variant:\n\n1. Variant is specified in URL `/?ab-test={id}\u0026ab-variant={slug}`\n\n2. Variant is saved in local storage\n\n3. Variant is chosen randomly by splitting visitors evenly\n\n## How variant is saved\n\nShown variant is saved to local storage with key `ab-test-manager`. All tests are saved under this singular key. Items here have expiration of one year so you don't need to write any clean-up code yourself.\n\nIf you want to clear all test data from your browser you can run `localStorage.removeItem('ab-test-manager')` in your browser's console or remove the item via inspector UI under Application.\n\nNote that local storage data is only available at browser level so you cannot use this data for example in server side and will not affect your caching.\n\n## Test data in Google Analytics\n\n[To be added, in testing phase...]\n\n## A/B testing and consent\n\n### Cookie declaration\n\nThis library sets one key to local storage as `ab-test-manager` to save which variants are shown to user to ensure that user sees the same variant on every page load.\n\nThis library doesn't set any cookies itself but if you are using Google Analytics or other services that set cookies you need to declare them in your cookie declaration.\n\n### Data tracking\n\nThis library doesn't track any data itself but if you are using Google Analytics or other services that track data you need to declare them in your cookie declaration and only run those services when user has given consent.\n\n## Options\n\nThere are many settings (in object format) that can be passed as 2nd argument with following types:\n\n```js\nabTestManager.register({\n\tid: '2023-11-new-header-cta',\n\tname: 'Change color of header CTA',\n\tdebug: true, // show console logs\n\tvariants: [\n\t\t{\n\t\t\tslug: 'a-original',\n\t\t\tname: 'A: Original',\n\t\t\tonRun: () =\u003e {},\n\t\t},\n\t\t{\n\t\t\tslug: 'b-variant',\n\t\t\tname: 'B: Variant',\n\t\t\tonRun: () =\u003e {\n\t\t\t\tdocument.body.classList.add('is-ab-test-new-header-cta');\n\t\t\t},\n\t\t\t},\n\t\t},\n\t],\n\tuseDataLayer: true,\n\tdataLayerEventName: 'abTestEvent',\n\tonBeforeRun: (variant) =\u003e {\n\t\tconsole.log('onBeforeRun', variant);\n\t},\n\tonAfterRun: (variant) =\u003e {\n\t\tconsole.log('onAfterRun', variant);\n\t},\n});\n```\n\n### id (string)\n\nURL friendly ID for test. This is used to save test data to local storage. Should be unique for each test and comprised of only letters, numbers and dashes.\n\n### name (string)\n\nName of the test. This is used for example in console logs.\n\n### debug (boolean)\n\nWhether to display debugging console logs. Can be overridden by adding `?ab-test-debug` to current URL.\n\n### variants (array)\n\nThe variants for the test. Each variant object can have following properties:\n\n* `slug` (string) - URL friendly ID for variant. This is used to save variant data to local storage. Should be unique for each variant and comprised of only letters, numbers and dashes.\n* `name` (string) - Name of the variant. This is used for example in console logs.\n* `onRun` (function) - Function to be called when variant is run. This is where you should apply variant changes for example via CSS classes, JS manipulation etc.\nults to wrapping when href is \"#\".\n\n### useDataLayer (boolean)\n\nWhether to send events automatically to Data Layer. If you want to do completely different Data Layer event you can set this false and add your own into onAfterRun hook.\n\n### dataLayerEventName (string)\n\nName of Data Layer event. Defaults to `ABTest`.\n\n### onBeforeRun (function)\n\nFunction to be called before variant is run. Variant object is passed as argument.\n\n```js\nonBeforeRun: (variant) =\u003e {\n\tconsole.log('onBeforeRun', variant);\n},\n```\n\n### onAfterRun (function)\n\nFunction to be called after variant is run. Variant object is passed as argument.\n\n```js\nonBeforeRun: (variant) =\u003e {\n\tconsole.log('onAfterRun', variant);\n},\n```\n\n## Development\n\nInstall tools `npm install` and build `npm run build` or develop with `npm run watch`.\n\nReleasing new version:\n\n* Update version in `package.json`\n* Commit to master\n* Set tag with version number to git\n* Create new release in GitHub\n* NPM package is automatically published from GitHub\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fevermade%2Fab-testing-toolkit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fevermade%2Fab-testing-toolkit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fevermade%2Fab-testing-toolkit/lists"}