Adding Badges in GitLab Repositories

GitLab:14.7.0

組織在運作一段時間以後,內部專案通常都會多如牛毛,因此在盤點專案時,如果資訊沒辦法一目瞭然,就可能會造成許多溝通的成本。

GitLab 有一個功能叫做 Badges,這個功能可以將你的 Pipeline 狀態 及你的 Code Coverage 直接以標籤的方式顯示在 Repository 的資訊頁,方便相關人士進到這個專案時,就能大概知道這個專案的基本狀態。

Badges Sample

Pipeline Status Badge

在設定 Pipeline 標籤之前,必須先到該 repo 的設定裡面進行 Badge 相關的設定調整:

  1. 在左邊側欄選取 Settings -> General
  2. 展開 Badges
  3. 填入專案的 Pipeline 連結: https://gitlab.your-domain.com/%{project_path}/pipelines
  4. 填入 Badge image URL: https://gitlab.your-domain.com/%{project_path}/badges/%{default_branch}/pipeline.svg
  5. 點選 Add badge,產生新的 Badge。

完成後即可以在專案首頁看到 Pipeline 的標籤。

Code Coverage Badge

要製作 Code Coverage Badge 必須完成兩件事:

  1. 產生 Badge
  2. 抓取 CI 裡 Code Coverage 的 percentage
產生 Badge

這個步驟跟設定 Pipeline Status Badge 類似:

  1. 在左邊側欄選取 Settings -> General
  2. 展開 Badges
  3. 填入專案的連結: https://gitlab.your-domain.com/%{project_path}
  4. 填入 Badge image URL: https://gitlab.your-domain.com/%{project_path}/badges/%{default_branch}/coverage.svg
  5. 點選 Add badge,產生新的 Badge。

成功以後,你就會看到新的標籤,但值卻是 unknown,因此我們要進行第二步,去抓取 coverage 的數字。

抓取 CI 裡 Code Coverage 的 percentage

PHPUnit 為例,我們在 .gitlab-ci.yml 檔裡,只需要直接將結果輸出就可以了。

php ./vendor/bin/phpunit --coverage-text --colors=never

接著再去設定 CI 的 Parser,讓 CI 可以抓到我們輸出的結果:

  1. 在左邊側欄選取 Settings -> CI/CD
  2. 展開 General pipelines
  3. Test coverage parsing 填上:^\s*Lines:\s*\d+.\d+\%

不同語言 or 套件的 Regular Expression 可以參考 官網文件

這樣一來就大功告成了。

Notice: 這邊有一個重點要注意,在 GitLab 14.9 以後,透過設定 Test coverage parsing 以拿到 coverage 資訊的方法會被淘汰,之後會改成直接在 CI 裡產生文件,相關資訊可以參考 Test coverage visualization

Categories: GitLab