Status Badges for Repositories Registered to Yaydoc
Yaydoc, our automatic documentation generation and deployment project, generates and deploys documentation for each of its registered repository at every commit. It is possible that due to any misconfiguration in users’ project the build process may fail. Hence, it is vital for an improved user experience to store the build status for at least the most recent build process.
There are different ways with which a user can be notified about the build status after a commit. At Yaydoc, we chose to notify the user by emailing a status report. Since sending an email at each at every commit can be quite annoying, we chose to limit it to specific scenarios. We decided that we will send the mail
- On the first build after the repository is registered to Yaydoc, irrespective of the status
- On every failed build
- On the change of build status (Success to Failed or vice versa)
- To the user who registered the repository to Yaydoc
exports.updateBuildStatus = function (name, buildStatus) { async.waterfall([ function (callback) { Repository.setBuildStatusToRepository(name, buildStatus, function (error, repository) { callback(error, repository); }); }, function (repository, callback) { if (repository.mailService === true && (repository.buildStatus === false || buildStatus === false || repository.buildStatus === undefined)) { User.getUserByUsername(repository.registrant.login, function (error, user)) { callback(null, user, repository); } } } ], function (error, user, repository) { mailer.sendMailOnBuild(buildStatus, user.email, repository); }); };
Considering the fact that the user may not wish to receive build emails and hence made them configurable by adding a mailService: Boolean
key in repository’s collection.
Taking this forward, we then decided to generate status badges similar to how Travis and other Continuous Integration platform do. Since we now store a `buildStatus` for each repository, we can use it to generate an svg image to be added to README files of repositories. We generated the status badges using Shields.io and added them to the route /<owner>/<reponame>.svg
. The dynamicity of image generated is achieved by retrieving the value of buildStatus and render the images with different constructs based on its value.
router.get(‘/:owner/:reponame.svg’, function (req, res, next) { var fullName = req.params.owner + ‘/’ + req.params.reponame; Repository.getBuildStatusByRepositoryName(fullName, function(error, result)) { var buildStatus = ‘invalid’; var width = ‘94’; var color = ‘#9f9f9f’; var x = ‘70.5’; if (result.buildStatus) { buildStatus = ‘success’; width = ‘102’; color = ‘#97CA00’; x = ‘74.5’; } else { buildStatus = ‘failed’; width = ‘88’; color = ‘#E05d44’; x = ‘67.5’; } res.set(‘Content-Type’, ‘image/svg+xml’); res.render(“badge”, { status: buildStatus, width: width, color: color, x: x, }); } });
The status tags generated can then be added as:
[![Yaydoc Status] (https://yaydoc.herokuapp.com/imujjwal96/prelimQuiz.svg)] (https://yaydoc.herokuapp.com/imujjwal96/prelimQuiz)
Resources:
- Shields.io: Quality metadata badges for open source projects – https://shields.io
- Async utilities for node and browser – https://caolan.github.io/async/