miyohideの日記

技術的なメモなどを記しています

2020年4月14日（火）

WEB+DB PRESS Vol.115に載っていたJavaScriptプログラムにテストを書いてみた

WEB+DB PRESS Vol.115には「特集3 小一時間でゲームを作る」という特集があり、JavaScriptで簡単なゲームを実装する方法が掲載されています。

WEB+DB PRESS Vol.115

WEB+DB PRESS Vol.115

このサンプルにはテストが書かれていなかったので、勉強ついでにテストを書くことにしました。

リポジトリは以下のもの。

github.com

カバレッジが95%を超えたのでまあ、大抵のテストを書くことはできたかなという感じ。

戦略は、

  • ひとつのJavaScriptファイルで作られていたのを細かい単位に分割
    • その分割した単位でテストを細々と書いていく
  • ある程度分割できたら、実際にブラウザで行う操作と同じ処理をテストで実装するようにする

と言った感じで王道中の王道です。

テスティングフレームワークはJestを使いました。

jestjs.io

ブラウザで行う操作と同じ処理をテストで実装する方法については、JestのDOM Manipulationの説明を参考に。

jestjs.io

document.body.innerHTML = '<div></div>'

でJavaScriptを動かすHTMLページを作っておいて

main = require('../lib/main')

と書くとlib/main.jsに書かれた処理が実行されるので、後は

const wDown = new window.KeyboardEvent('keydown', { key: 'w' })
main.onKeyDown(wDown)

としてキーボードイベントをlib/main.jsに書いたonKeyDown関数に流しています。これでいいかどうかはよく分かりませんが、まあ動いているのでOKかなと。

2020年4月5日（日）

Jestでカバレッジを取得する

Jestでカバレッジを取得するには--coverageオプションを指定してあげればよい。

jestjs.io

こんな感じで出力されます。

/usr/local/bin/node /usr/local/Cellar/yarn/1.22.1/libexec/bin/yarn.js test
yarn run v1.22.1
$ jest --coverage
 PASS  __tests__/board.test.js
 PASS  __tests__/game.test.js
----------|---------|----------|---------|---------|-------------------
File      | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s 
----------|---------|----------|---------|---------|-------------------
All files |   99.04 |    97.83 |     100 |   98.92 |                   
 board.js |   98.53 |    96.88 |     100 |   98.31 | 60                
 const.js |     100 |      100 |     100 |     100 |                   
 game.js  |     100 |      100 |     100 |     100 |                   
 vec2.js  |     100 |      100 |     100 |     100 |                   
----------|---------|----------|---------|---------|-------------------

Test Suites: 2 passed, 2 total
Tests:       25 passed, 25 total
Snapshots:   0 total
Time:        1.605s
Ran all test suites.
✨  Done in 2.70s.

Process finished with exit code 0

あとはこれをGitHub Actionsと組み合わせていい感じに表示されるようにしたいなあ。

2020年4月4日（土）

GitToolBox

Twitterでお勧めされていたので、インストールしてみた。JetBrains製IDE向け（IntelliJ IDEAとかRubyMineとか）のプラグインであるGitToolBox。

plugins.jetbrains.com

とりあえず各行にコミットメッセージが出るようになった。

f:id:miyohide:20200404181158p:plain

ゆっくり試していこう。

2020年4月3日（金）

在宅勤務、なんとなく辛い。

Easy Bash PS1 Generator

端末のシェルはなんとなくbashにしているのですが、時たまプロンプトのカスタマイズをやりたい病が出てきます。マニュアルを見ればできるというのは分かっているのですが、色のセッティングとかGitのステータスを出すとなるとちょっと面倒くさいのでbash itを使っています。ですが、細かいところが気に食わない...

で、今日またプロンプトのカスタマイズをやりたい病が発症したのでちょっと調べると簡単にBashのプロンプトのカスタマイズができるサイトを見つけました。それがEash Bash PS1 Generator。

ezprompt.net

何も生産性を上げないのは分かっているですが、また色々と凝って時間を浪費しちゃいそう。

2020年4月2日（木）

英語力測定テスト2020

今年度のNHKの英語教材は何にしようかなと思っていたところ見つけたサイト。英語力測定テスト2020。

eigoryoku.nhk-book.co.jp

やってみました。

なんと満点。

やったね。