あのぞんブログ

【ボツネタ】GitHub Actions の URL 1 つからバッジを生成するツール作った

2020-02-03

この記事では GitHub Actions の URL 1 つからバッジを生成するツールを作ったので紹介します。

するつもりだったのですが、気づいたら公式で発行するするボタンができてました。

github-actions-qawolf-badge.png

なので、「作っちゃったもの」の技術解説をします。

バッジの仕様

ワークフローを設定する - GitHub ヘルプ (公式ドキュメント)

URL の形式。 https://github.com/<OWNER>/<REPOSITORY>/workflows/<WORKFLOW_FILE_PATH>/badge.svg

成果物

gha-badge-maker.gif

コード: tools/gha-badge-maker.tsx at master · elzup/tools

以下は変換する関数部分です。

export function convertUrlToBadge(url: string, action?: string): ParseResult {
  const parseReg = '(https://github.com/.*/.*)/actions\\?query=workflow%3A(.*)'
  const m = new RegExp(parseReg).exec(url)

  if (!m) return null

  const [_, repoUrl, actionPath] = m
  const actionName = action || actionPath
  const badgeUrl = `${repoUrl}/workflows/${actionName}/badge.svg`

  return { actionName, badgeUrl, badgeText: `![${actionName}](${badgeUrl})` }
}

// test

test('convertUrlToBadge', () => {
  const url = 'https://github.com/elzup/tools/actions?query=workflow%3Aqawolf'

  expect(convertUrlToBadge(url)).toMatchObject({
    badgeText:
      '![qawolf](https://github.com/elzup/tools/workflows/qawolf/badge.svg)',
    actionName: 'qawolf',
    badgeUrl: 'https://github.com/elzup/tools/workflows/qawolf/badge.svg',
  })
})

まとめ

もちろん既存ツールがないかは調べていたのですが、いつの間にか公式にできてることに書いている途中で気づきました。

毎回どんな URL だっけ?となっていたし需要はあったですね。


anozon JavaScript とアニメ好き Web エンジニア。Twitter

© 2020 あのぞんびより All Rights Reserved