GitHub Actionsがリリースされしばらくし、結構使われているレポジトリが増えてきています。
さらに、 README
にバッジを置いておくとそれだけで見栄えがよくなるのでオススメです。
![スクリーンショット 2020-03-25 14.58.31.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F15319%2F75ab33ca-225b-9398-3ce9-62ecf021bf14.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=fb612a4f2c37badca67d559df73739dd)
バッジをどこで取得できるかというと、対象のアクションに飛んで (https://github.com/<user>/<repo>/actions?<workflow>
) Create status badge
をクリックし Copy...
ボタンを押すだけです。便利ですね。
![スクリーンショット 2020-03-25 13.13.55.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F15319%2F7285e64f-477f-ea87-6b5c-e05d69eab03d.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=be752ef578878c0b125687ac63db95f2)
しかしながら、デフォルトでコピーしただけだとちょっと不便なところがあります。下に2つバッジがありますが、違いがわかりますでしょうか?
上がCopyしただけのバッジです。
クリックすると明白ですが、上は対象のアクションへのリンクになっていません。そのため、[<ここにコピーしたバッジ>](対象のアクションへのリンク)
のように書いてリンクにしてあげる必要があります。
毎回これをするのは面倒なので、簡単なユーザースクリプトを用意しました。
UserScriptを実行する拡張が入っていれば、以下のリンクを開いて、Row
を押すだけでインストールできます。
中身としてこれだけです。
// ==UserScript==
// @name add badge for action link
// @namespace https://github.com/akameco
// @version 0.1
// @description add badge for action link
// @author akameco (https://github.com/akameco)
// @match https://github.com/*/*/actions*
// @grant none
// ==/UserScript==
const el = document.querySelector('#badge-markdown')
el.textContent = `[${el.textContent}](${location.href})`
GitHub Actionsのバッジ簡単に設定できて便利なんだけど、そのままコピペするとsvgへのリンクになって不便なので対象のアクションへのリンクにする雑なユーザースクリプト用意したhttps://t.co/z53uo70JLs pic.twitter.com/xLamjw0qPl
— あかめ@無職.js (@akameco) March 25, 2020