Posted at

AtCoder の過去問を解くときに、指定の言語で AC した提出回答一覧を見やすくしたい


はじめに

AtCoder の過去問に取り組んでいると、他の人がどんなコードを書いて AC したのか参考に読みたくなることがあります。特に、自分の使っている言語を他の人がどう書いているのかを確認したくなります。

そこで、他の人の提出を絞る手間を少し減らす方法を考えたので紹介します。


課題

対象の過去問に提出された回答を、指定の言語で AC したものに絞るときは、以下の手順を画面上で実施する必要がありました。


  • AtCoder Problems から過去問リンクを開く

  • [提出一覧] -> [全ての提出] をクリック

  • 検索エリアで、問題、言語、結果を指定して [検索] をクリック

過去問ごとにこの手順を踏んでいたので、少し手間を感じていました。そのため、以下のような手順にショートカットしたいと思っていました。


  • AtCoder Problems から過去問リンクを開く

  • 指定の言語で AC した提出回答一覧ページに遷移する


tl;dr

AtCoder の過去問をまとめているサイト、AtCoder Problems をブラウザで開き、開発者コンソールで以下を実行します。

すると、各問題のリンク先が、指定の言語で AC した提出回答一覧ページになります。

// 利用したい言語によって修正(3013 = Golang)

const language = 3013

Array.from(document.getElementsByTagName('a')).filter(
elem => /https:\/\/atcoder.jp\/contests\/.+\/tasks\/.+/.test(elem.href)
).forEach(
elem => {
let url = elem.href
let contest = url.match(/(?<=https:\/\/atcoder.jp\/contests\/).+(?=\/tasks)/)[0]
let task = url.match(/(?<=\/tasks\/).*/)[0]
let submissions = `https://atcoder.jp/contests/${contest}/submissions?f.Task=${task}&f.Language=${language}&f.Status=AC&f.User=`
elem.href = submissions
}
)

例えば以下ですと、

https://atcoder.jp/contests/abc138/tasks/abc138_a

以下のような URL になります。

https://atcoder.jp/contests/abc138/submissions?f.Task=abc138_a&f.Language=3013&f.Status=AC&f.User=


ざっくり解説

AtCoder の各問題では、以下で提出された回答を絞り込むことができます。


  • 問題

  • 言語

  • 結果

  • ユーザー

例えば ABC138 の A問題ですと、

https://atcoder.jp/contests/abc138/tasks/abc138_a


  • ABC138 のA問題 の

  • Golang で書いてある

  • AC した提出回答のうち

  • ユーザーは任意(=未指定)の回答

と検索した場合、URL は以下のようになります。

https://atcoder.jp/contests/abc138/submissions?f.Task=abc138_a&f.Language=3013&f.Status=AC&f.User=

それぞれのパラメータは以下のようですね。


  • f.Task: 問題

  • f.Language: 言語

  • f.Status: 提出結果

  • f.User: ユーザー

上記の URL に、AtCoder Problems の過去問 URL から変換し、リンク先を書き換えるスクリプトを書きました。


おわりに

こちらで少し手間を省くことができました。例は Golang ですが、言語の数字の部分を切り替えれば他の言語も確認できると思います。

よかったら使ってみてください。またもし気になる点ありましたら教えて下さい。