How to perform Google Add-on automated unit testing and publishing with Circle CI — Part 1
Introduction
For Effilab business needs, we recently developped an add-on for google spreadsheet. The add-on role is to enable the visualization and update of Effilab product data through a spreadsheet. While the development part with google apps script language is straightforward and well documented, we found it was lacking documentation on how to test and automate the deployment of the add-on.
In this three parts series we will first develop a simple spreadsheet add-on and publish it on the chrome web store, then in part 2 we will write some tests and setup an automated test system using Gast and CircleCI, and in part 3 automatize the publishing of updates using the chrome web store API.
The final version of the application can be found on our github public repository : https://github.com/Effilab/HelloAddon.
Part 2 : https://medium.com/@marhic.jerome/how-to-perform-google-add-on-automated-unit-testing-and-publishing-with-circle-ci-part-2-636c7589350e
part 3 : https://medium.com/@marhic.jerome/how-to-perform-google-add-on-automated-unit-testing-and-publishing-with-circle-ci-part-3-2662c3e7637d
A simple spreadsheet add-on
In this first part, we will create and publish an add-on that writes “Hello” in a cell of a spreadsheet when the user clicks on a menu button. You may skip this part if you already have a working add-on and you are only interested in automated testing or publishing.
Prerequisite: We will make use of Node 8 and Clasp (https://github.com/google/clasp). Install the clasp command line utilitary and login. This is not a tutorial about apps script development, we assume you have some experience creating add-ons already. If it is not the case you can follow the “5 minute quickstart” tutorial first : https://developers.google.com/apps-script/
Create a new script project with clasp create HelloAddon. Pull the newly created files locally with clasp pulland edit Code.js with the following code :
Create a .claspignore file with the following:
Push the code to your drive with clasp push and view it on script.google.com with clasp open. Let's first try the script : Menu Run, Test as add-on. Configure a new test version (installed and enabled) on a spreadsheet document.
The script will ask for spreadsheet management rights : View and manage your spreadsheets in Google Drive.
Try it, it displays the “Hello” string in the top-left cell.
Now that the add-on is working, let’s deploy it on the chrome web store so that others can use it.
In the google script tab, menu Publish, Deploy as web add-on. You may need to turn on the Google App Scripts API first, at https://script.google.com/u/1/home/usersettings
Don’t forget to set the add-on type to Sheets. You can read more about publishing an add-on here : https://developers.google.com/apps-script/add-ons/publish
You should be redirected to the chrome web store dashboard. Publish the add-on (you will need to upload a couple of icons and screenshots). Allow some time (from experiences it takes 10 to 15 minutes for the changes to propagate) and you will be able to install your add-on from any spreadsheet !
Lastly, in the url of the addon (for example ours is https://chrome.google.com/webstore/detail/helloaddon/eeflcodmgkpcbpcofdilmelbgdhiiaaf?authuser=0) notice the application id (here eeflcodmgkpcbpcofdilmelbgdhiiaaf), we will need it again in Part 3.
Now that we have a working add-on published, let’s head over to part 2 : automated testing.
