TestVagrant

How to set up a build pipeline on JetBrains TeamCity?

How to set up a build pipeline on JetBrains TeamCity?

Blog

How to Set Up a Build Pipeline on JetBrains TeamCity?

This article will mostly be about TeamCity(in detail) and PlayWright(in short).

The playWright is an automation framework that enables reliable end-to-end testing for modern web apps. More details about Playwright is available here

Now to TeamCity, TeamCity is a general-purpose CI/CD solution that allows the most flexibility for all sorts of workflows and development practices.

Let’s talk about TeamCity’s key features in detail:

Set up CI/CD Tools & Configuration

Traditionally when we think about a CI/CD tool like Jenkins we think about a lot of administration, so admins have to set up the tools and configure it with a bunch of plugins so the devs can start using it.
In Jenkins specifically, we have a vast ecosystem of plugins like for example:

  • If you want to use Gradle you need to install a plugin for it.
  • Using a specific version of NodeJS, again you need to configure it.

This is where TeamCity can help as it gets all these plugins out of the box, you don’t need to install and configure any of those plugins.

Configuration as Code

TeamCity offers two solutions for configuration, via the UI and via the code.
Let’s talk about config as code first,

  • It is easier for more complex projects which need lots of steps.
  • Configurations can be written in Kotlin DSL, Since Kotlin is a full-fledged programming language we can write powerful logic, use all tools and libraries which Kotlin can offer when compared with the YML.
  • It makes it easier for developers to script their CI/CD pipelines.

Build Chains a.k.a Pipelines

  • Create build chains with your builds by defining dependencies between them meaning you can configure which builds depend on which one in a chain, so whenever you build TC will check all the dependent builds and run the first incorrect order.
  • Pass artefacts or the outputs from one build to another.
  • Runs build in parallel, for example, run the same test in a different browser or different OS, etc.

Personal builds

  • You can run builds directly from your code editor.
  • Useful to test your changes before committing and integrating them into the existing codebase.
  • It is available on all the popular code editors, i.e: Intellij, VS Code, Eclipse.

TeamCity Architecture

  • When we talk about TC’s Architecture, we mainly deal with two concepts

    1. TeamCity Server
    2. TeamCity Build Agents

    TeamCity Server: It provides the UI for managing build configurations.
    Build Information and result. Think of this as Gitlab or Jenkins UI.

    Once the build is configured, they need to run somewhere, for that matter we have build agents.

Build Agents:

  1. Executes build configuration or build jobs
  2. Connect as many as you want
  3. They Can be installed anywhere from on-premise, cloud providers or docker containers
  4. Different tools can be installed on different agents, like node, Gradle, Docker, etc.
  5. TC automatically detects, which build agent can execute which build based on the build configuration. For example, if you want to run JS tests you need an agent which will have npm installed/configured on that agent.
Execution logs

Now to the Demo part

The process would be:

1. Install TeamCity Server with Docker

				
					docker run -it --name teamcity-server-instance \
-v team_city_data:/data/teamcity/datadir \
-v team_city_logs:/opt/teamcity_server/logs \
-p 8111:8111 \
-d jetbrains/teamcity-server

				
			

2. Configure CI Pipeline

Once you navigate to the URL (https://localhost:8111), you will see a one-time setup, follow the on-screen instructions and you will be done

The home page will look like this.

Mismatch in the latest execution and previous execution

3. Connect to Git repository

Navigate to the admin section and add a new project.

After adding the project TC will try to auto-detect the build-steps from the project.

You may use them or create or own new build steps manually. I’ll be creating a manual step here.

Note the Runner Type is Node.js and uses a docker image for the playwright test.

4. Configure build agents

When we initially start with TC we will have 0 agents as we didn’t configure any. We will again use the docker image to configure our Agent

				
					docker run -it -e SERVER_URL=""  --name teancity-agent \
-v team_city_agent_config_two:/data/teamcity_agent/conf \
-u 0 -v docker_volumes:/var/lib/docker \
--privileged -e DOCKER_IN_DOCKER=start \
jetbrains/teamcity-agent
				
			

PS: We are using -u 0 so that we can perform root actions too. Since we need to run our test in a docker container, we need to start docker inside docker, that is why we using docker_volumes with root access.

How to launch docker inside docker → navigate to the inside of the container and run dockerd

				
					docker exec -it teamcity-agent bash
root@fecb9be0454f:/# dockerd
				
			

Once you have started docker inside docker, you would be able to see an agent, which is unauthorised at this moment. Authorise it by clicking on the button.

Once the above step is done, you are ready to run your test. It should look something like this

5. Setting up the Artifacts

Once you have run the build you may want to generate the artefacts for the same.
navigate to project setting → General setting and you should be able to do the same. Choose the file whatever you need to have in your artefacts and you do.

6. Setting up the Reports

For any kind of automation testing be it unit or functional, reporting is a must as it will educate you with the test result, screenshot etc.

for setting up: Navigate to Root project setting → Report Tabs

There are two tabs available for reporting:
Build Report Tab → This will have to report for every build you are building.
Project Report Tab → This will have a report for the project itself.

You can have either of them as per your preferences.

Once we have everything in place, this is how the result of the build will look like.

From a code perspective it will look something like this:

				
					package _Self.buildTypes

import jetbrains.buildServer.configs.kotlin.v2019_2.*
import jetbrains.buildServer.configs.kotlin.v2019_2.buildSteps.NodeJSBuildStep
import jetbrains.buildServer.configs.kotlin.v2019_2.buildSteps.nodeJS
import jetbrains.buildServer.configs.kotlin.v2019_2.triggers.vcs

object Build : BuildType({
    name = "Test"

    artifactRules = """
        jest-html-reporters-attach => jest-html-reporters-attach
        report.html
        src/html-report => src/html-report
    """.trimIndent()
    publishArtifacts = PublishMode.ALWAYS
vcs {
    root(HttpsGithubComThenishantPlaywrightTeamcityRefsHeadsMain)
}
    steps {
        nodeJS {
            name = "test"
            shellScript = """
                npm install
                npm test
            """.trimIndent()
            dockerImagePlatform = NodeJSBuildStep.ImagePlatform.Any
            dockerImage = "mcr.microsoft.com/playwright"
        }
    }

    triggers {
        vcs {
        }
    }
})
				
			

The project is available on Github

That’s all for now. Let us know your thoughts. 

Share This Article

Other Related Articles

Scroll to Top