Custom Tasks in VSCode

Raj Shekhar Dev — Sun, 10 May 2020 18:29:52 +0000

As a PHP(mostly Laravel) developer, I tend to quickly test my code with phpunit command. The inbuilt terminal in VSCode thus becomes very essential but it takes time and multiple keypresses to open the terminal, run the command and then close it. Here the custom tasks provided by VSCode comes handy. Let's have a look:

Create a .vscode folder in the root directory and tasks.json file in it.

Example: 1

To run the complete test suite we use the following command:



$ vendor/bin/phpunit

Let's put our first task. Open the tasks.json file and add:



{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "Run all tests",
            "type": "shell",
            "command": "vendor/bin/phpunit",
            "group": "test",
            "presentation": {
                "reveal" : "always",
            }
        },
    ]
}

Here's a quick rundown of the properties of the objects inside the tasks array:

label: Name of the command; Keep it according to your needs
type: Type of the command; other options include npm
command: The actual command to be executed
group: Optional; It is good to group similar type to commands
presentation: The state of the task runner(terminal) while and after running the test.

To run the test: ctrl+shift+P, search Run task, press enter, find the task Run all tests and BOOM!!

Example: 2

To run tests from the current or specified filename/class, we use:



$ vendor/bin/phpunit --filter=EmailTest

Here the filename changes and thus we cannot hardcode it. Here vscode predefined variable comes handy. In the same tasks.json file, add the following object in the tasks array



{
    "label": "Run test for current file",
    "type": "shell",
    "command": "vendor/bin/phpunit --filter=${fileBasenameNoExtension}",
    "group": "test",
    "presentation": {
        "reveal": "always",
    }
}

Here ${fileBasenameNoExtension} will take up the current filename without an extension from which you are running the test.

References:

DEV Community: Raj Shekhar Dev

Custom Tasks in VSCode

Example: 1

Example: 2

BONUS: You can assign each of your tasks to a keybinding and further smooth out the workflow.