Christian Heilmann

Code brushes for GitHub Copilot

Tuesday, December 13th, 2022 at 4:45 pm

Github Next now showed a new feature in GitHub Copilot labs that allows you to change code you write to make it cleaner, more robust and document it automatically.

GitHub Copilot is incredible, and if you check what’s happening in the preview released as the Copilot Labs extension it will only get more amazing.

Check this out:

Code brushes applied to a simple JavaScript

Let’s start with a basic JavaScript that checks a string length and reports when it is empty. One with an obvious mistake, as we use a single `=` instead of the type safe `===`. This will always report the string as empty.

if (str.length = 0) {
    console.error('String is empty');
}

Using the `Fix bugs` brush, this is rectified.

if (str.length === 0) {
    console.error('String is empty');
}

Using the `Clean` brush also adds reporting when the string is not empty.

if (str.length === 0) {
    console.error('String is empty');
} else {
    console.log('String is not empty');
}

Using the `List steps` brush adds comments for step (sure, this is redundant, but it also works for much more complex code).

// check the length of the string
if (str.length === 0) {
    // if length is 0, print 'String is empty' 
    console.error('String is empty');
} else {
    // if length is not 0, print 'String is not empty'
    console.log('String is not empty');
}

Using `Make robust` adds error reporting instead of logging and an extra check to make sure that `str` is really a String and not an empty Array.

function test(str) {
    if (str.length === 0) {
        throw new Error('String is empty');
    } else if (typeof str !== 'string') {
        throw new Error('It is not a string');
    } else {
        console.log('String is not empty');
    }
}

The `Add types` brush does exactly that.

/**
 * @param {string} str
 * @returns {string}
 */
function test(str) {
    if (str.length === 0) {
        throw new Error('String is empty');
    } else if (typeof str !== 'string') {
        throw new Error('It is not a string');
    } else {
        console.log('String is not empty');
    }
}

You can also define custom brushes and there are more to come.

Share on Mastodon (needs instance)

Share on Twitter

Newsletter

Check out the Dev Digest Newsletter I write every week for WeAreDevelopers. Latest issues:

Dev Digest 146: 🥱 React fatigue 📊 Query anything with SQL 🧠 AI News

Why it may not be needed to learn React, why Deepfake masks will be a big problem and your spirit animal in body fat! 

Dev Digest 147: Free Copilot! Panel: AI and devs! RTO is bad! Pi plays!

Free Copilot! Experts discuss what AI means for devs. Don't trust containers. Mandated RTO means brain drain. And Pi plays Pokemon!

Dev Digest 148: Behind the scenes of Dev Digest & end of the year reports.

In 50 editions of Dev Digest we gave you 2081 resources. Join us in looking back and learn about all the trends this year.

Dev Digest 149: Wordpress break, VW tracking leak, ChatGPT vs Google.

Slowly starting 2025 we look at ChatGPT vs Google, Copilot vs. Cursor and the state of AI crawlers to replace web search…

Dev Digest 150: Shifting manually to AI.

Manual coding is becoming less of a skill. How can we ensure the quality of generated code? Also, unpacking an APK can get you an AI model.

My other work: