AB Tasty Modules CLI
Create AB Tasty module that connects to AB Tasty or third party API’s to enhance AB Tasty platform behavior.
What is a module
Creating your module
You have to install the module CLI made by the innovation team:
npm install -g @abtasty-innovation/module-cli
Then run the following command to initialize the module:
Then follow the instructions of the CLI command to create your module. Once it is created you can go into your module folder and run:
It will provides you with an embedded module interface where you will be able to login to AB Tasty and test multiple module configurations
This interface will not be visible on the published version of your module, it is just an helper to simulate a real user connection.
Developing your module
Once you have created your module, you can develop it as a regular node based frontend repository.
The module system automatically fillout global variables that you can use inside your module to access minimal information about the current AB Tasty account of the user.
See more here : Develop your module
Publishing your module
Once your module is ready to be integrated in the lab tab in the production environment, you have to package it and send the packaged version to the innovation team.
See more here : Publish your module
Create a Module
- Node.js 7 or higher.
- AB Tasty Module CLI. The AB Tasty Module CLI is required to develop and test a module. To install it, enter: npm install -g @abtasty-innovation/module-cli Note: you can also use yarn instead of npm.
2. Create your module
Thanks to the AB Tasty Module CLI, you can easily create a production-ready module right out of the box. It already follows our best practices! Just run the command below and answer the questions:
3. File structure
Once your module is generated, you will find theses files in your project’s folder:
Along with many standard file to make the code running (webpack configuration, eslint, babel, …).
If you chose the Vue or React templates, you will see more files corresponding to the standard boilerplate for these technologies.
Develop a Module
webpack in combination with a transpiler like
Please note that the module generated by the AB Tasty Module CLI uses
babel out of the box. In this case, the bundled file will probably be generated in a folder such as
You can access the
window._ab global variable everywhere in your code.
- accessToken : the current logged user AB Tasty access token to access AB Tasty API
- accountId : the current logged user AB Tasty account ID
- userRole : current logged user AB Tasty Role
- instanceScope : current module instance scope. Can be either :
- testId : current testID if the module is bound to a test view
It also provides a storage object that has the following methods: * storage.get : function (key, callback) - Enables a module to get a stored key/value for the module instance. The callback function will be called with a value argument containing the value object. * storage.set : function (key, value, callback) - Enables a module to set a stored key/value for the module instance. Value must be and object that can be stringified. The callback function will be called without arguments when the value is stored.
And a tracking object that has the following methods: * tracking.track : function (eventName, params) - Track a custom event with custom variables into heap analytics
QA your module
To test your module, simply use this command from the root of your module folder:
An interface will then pop up on your screen, allowing you to test your module with different configurations. Under the hood, this calls the AB Tasty module cli to serve your files with the embedded module interface and injection.
Here are some examples of configuration options:
- Account : this changes the accountId injected into the
- Test : this changes the testId injected into the
- Configuration : this changes value of the module instance storage. It can helped to vizualise what data you stored inside the module
Finally, the webpage view on the right-hand side loads the module code your wrote and inject into it the
window._ab object before loading it. It takes into account the fields of the configuration form that are visible on the left-hand side.
The module ecosystem is just a way to embed independant front end applications into the AB Tasty platform.
You module can call multiple backends in order to add features:
- The AB Tasty API (using the provided access token of the current connected account)
- A third party API (Google AI Apis for instance)
- A custom made API for the module
In the case you have to make a custom API for your module, please implement the following minimal security measures:
- Pass the AB Tasty access_token to your custom API calls
- Inside your API, please validate the access token by calling the AB Tasty API
- Add additional calls to checks if the connected account has the necessary permissions to do the feature your module offers
Publish a Module
To submit your module to AB Tasty and make it available to the AB Tasty customer base, please follow the steps below:
1. Package your module
If you used the module CLI to generate your module source code, you can use the following command:
npm run package
This step will create a zip file with the minified script inside.
2. Send us your module
Once your module is packaged, you can send the zip file to:
In your email, please provide the following information:
- A name and email for the creator of the module
- The display name of the module, that will appear on the lab tab in the module list
- The description of the module, that will appear on the lab tab in the module list
- An url for the icon of the module, that will be display in the module list in the lab tab