Creating nice looking Slack bot Messages with Hubot

At Ideal Candidate we finally had enough of HipChat. After several days of messages not being sent, which was really affecting our ability to communicate (even though we sit next to each other – chat is a better interface for keeping everyone involved).

We spent a week evaluating Slack, which many of my friends/colleagues around the world had recommended. Despite their operational status boards looking very similar, we had zero issues with slack messages getting delayed, and the people doing the eval preferred the interface.

We had a few things we needed from Slack which we wanted to keep from the HipChat days:

  • Jira Integration (this is what I’ll talk most about here).
  • Posting to channels a few bits of data from our application (customer signup, customer login).
  • Rainforest messages about running tests.
  • A few other “fun” plugins

Fun plugins were easy. I’ll pass on that here for now.

Rainforest support was a supported plugin. Done.

Posting to channels required a bit of custom code, which we had already written for HipChat, but our experience (below) made us improve what we had.

So let’s get to Jira integration with Slack.

Jira Slack Integration

Let’s be honest about this: The default Jira-Slack integration is total shit.

With HipChat we could control what types of events could generate a message to a channel. The Slack built-in Jira integration only sends a message for the following events:

  • An issue is created or re-opened
  • An issue is closed (unless it was previously resolved)
  • An issue is updated to done or resolved
  • An issue is updated to in progress or to do after previously being marked as done

We wanted much more nuance than that:

  • A bug is created on the current sprint
  • An issue changes status
  • An issue goes from “Ready For Test” back to “ToDo”, we want the last comment (i.e. the reason)
  • An issue is marked “Done”, we want the last comment
  • An issue is mentioned in the channel, we want the summary

We found a number of Hubot Jira plugins on npm that we hoped could work, but none really fit the bill, so we ended up writing our own. The main hubot-jira plugin linked above just dumps plain text into the channel, and we knew we could do better.

So we set about seeing how to create good looking messages with Hubot. The thing to understand about Hubot is it is designed for multiple systems (HipChat, Slack, IRC, etc), so we kind of have to be a bit devious to create a nice looking message. Slack supports a way to do this, calling them attachments (which is a stupid name – but all software has historical shit). First we forked the hubot-jira plugin to get issues in a pretty format. The hubot-jira plugin only responds to mentions of tickets (doing an API query based on the regexp /\b(\w+-\d+)\b/), so first step was to format that nicely.

The code in hubot-jira does a plain msg.send, which just sends a plain text message. To get a nicely formatted message we constructed an attachment object:

              attachment =
                title: "[#{key}] #{json.fields.summary}"
                title_link: jiraUrl + "/browse/#{key}"
                fields: [
                    title: "Status"
                    value: json.fields.status.name
                    short: true
                color: "#003366"
                author_icon: "https://developer.atlassian.com/imgs/jira.png"

And then can post it using the a bit of a hack on hubot directly accessing the Slack object:

                channel: msg.envelope.room
                username: msg.robot.name
                attachments: [attachment]

This created a message in Slack that looks like this:


Note: There are other bits of code to add in certain fields there. See the Slack Attachment docs for more info.

Finally we adding in webhook support, which allowed us to support all sorts of status transitions we wanted:

Screen Shot 2015-11-19 at 21.16.09


We added various other things to our Slack account later, such as posting when new customers sign up, using similar code, but in all it has been a good transition. We haven’t had any times with Slack yet where messages don’t make it through. We hope that continues.



One thought on “Creating nice looking Slack bot Messages with Hubot

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s