打刻をよく忘れてしまう上司のために TeamSpirit の自動打刻アプリを作った話

作ったものはこちら

ここではソースコードの詳しい解説はしません．

背景

弊社では打刻システムに TeamSpirit (Salesforce 上で動いているアプリ) を使用していますが，朝来て打刻する際は PC の電源を入れてログインページにアクセスしてから打刻ボタンを押さないとログインできない というのが現状です．
上司がよく出勤の打刻を忘れていたこともあり，もっと楽に打刻できる方法はないだろうか，と思って今回の打刻アプリを作りました．

自動化の方針

TeamSpirit の API が公開されていなかったので，ブラウザでやっていたことを Selenium にやらせる方針で進めました．

必要な作業

大きく分けて，次の 2 点です．

• 今まで手動のときにやっていた動きを下記のように一つ一つかみ砕く
• その動きにあたるモジュールの関数を探す

今まで手動のときにやっていた動きを下記のように一つ一つかみ砕く

ログイン方法は次のようになります．

1. ブラウザを開く
2. ログインページにアクセスする
3. ID / PW を入力する
4. ログインボタンを押す
5. 打刻ボタンを押す

その動きにあたるモジュールの関数を探す

Selenium のドキュメントを見たり，ググったり，いろいろな方法で探しました．

自動化してみて感じたこと

モジュールの関数を学習できる

Selenium 自体は弊社の自動テストを通して存在を知ったのですが，実際に Selenium を使って何か作ったことはなかったので，いい経験になったと思います．

画面で見えていても，ブラウザのドライバには見えていないものがある

ログイン後の打刻ボタンが iframe の中に配置されていて，それがページにアクセスしたばかりの Selenium では見えず，最初に iframe にフォーカスを当てる必要がありました．それに気づくのに 1 日くらい時間がかかった気がします．

• 例

frame = driver.find_element(:css, 'iframe[sample-area]')
driver.switch_to.frame(frame)

人にわかりやすく説明するスキルが間接的に身につく

手動でやっていた作業をかみ砕く上で必ず生じる作業が， 言語化 です．
言語化することで自分のやりたいことが明確になるので，人への説明をわかりやすくできたり，自分の考えを正確に人に伝えることができるようになります．
今回はそのトレーニングとしても良かったと感じています．

自動で動いているのを見るのがとても楽しい

独りでに動いているのを見たときの達成感は半端ないですね．

ハッキングしている気分？

ハッキングは悪いこと，のイメージがありますが，今回 API がない状態でログインページの html や js ファイルを探りながら地道にコードを書いていっただけに，達成感は非常に大きかったです．

最後に

みなさんも身の回りの作業，自動化してみませんか？

P.S. 先輩社員がこのアプリを気に入って全社的に紹介したところ，人事部と情報システム室で軽く物議を醸して炎上案件になりました．めでたしめでたし．