【将棋盤 第11回】jestを導入する

コツコツ将棋盤を作ってます。

使用技術

• Vue.js3
• Vite
• SCSS

yushi-dev.hatenablog.com

公開ページ

https://nek0meshi.github.io/shogi-board/

今回はテストフレームワークのjestを導入してみます。

jest

jestとは、JavaScriptのテストフレームワークです。

関連モジュールを導入することで、Vue.jsやTypeScriptのテストも書けるようになります。

jestjs.io

と言いつつ一度もしっかり使ったことないので、少しずつ勉強しながら導入してみようと思います。

Install

こちらのドキュメントを参考に導入していきます。

はじめましょう · Jest

yarn add -D jest

npm scriptsに追加します。これで、yarn testで実行できるようになります。

(package.json)
{
  ...
  "scripts": {
    ...
    "test": "jest"
  }
}

書いてみる

とりあえず、超簡単なテストを書いてみました。

(tests/index.test.js)

function add(a, b) {
  return a + b;
}

test('test', () => {
  // 絶対に成功するテスト
  expect(true).toBe(true);
});

test('add', () => {
  // function `add`のテスト
  expect(add(1, 2)).toBe(3);
  expect(add(10, 20)).toBe(30);
  expect(add(-10, -20)).toBe(-30);
});

実行してみる

yarn test

$ jest
 PASS  tests/index.test.js (6.404 s)
  ✓ test (8 ms)
  ✓ add (1 ms)

Test Suites: 1 passed, 1 total
Tests:       2 passed, 2 total
Snapshots:   0 total
Time:        17.045 s
Ran all test suites.
Done in 28.93s.

PR

https://github.com/nek0meshi/shogi-board/pull/20

まとめ

今回は、jestを追加するところまでです。
今後は、TypeScript・Vue.jsへの対応、そして将棋盤のソースコードのテスト記述に進んで行こうと思っています。

近況ですが、ルービックキューブを引き続き続けていて、ついに7000円の一番人気（？）なやつを買ってしまいました。
2回に1回は1分切れるようになってきました。