TDDを実践してみて感じたこと

マインドマップのアプリをTDDで作成している。 私にとって、TDD も テストコードを書きながらの開発もこれが初。 実践前に以下動画を参考にした。（今でも見ている）

TODOリスト作成が大事

TDDの最初のステップとして、システムが満たすべき要件を列挙していく

例: マインドマップのノード操作

- [ ] ノードをクリックすることで選択状態になる
- [ ] ノードを選択状態で Tabキー を押下することで、子ノードを追加する
- [ ] ノードを選択状態で Enterキー を押下することで、兄弟ノードを追加する
- [ ] ノードを選択状態で Deleteキー を押下することで、対象ノードを削除する
- [ ] ルートノードを選択状態で Enterキー を押下しても、兄弟ノードが追加されない
...etc

思いつく限りのケースを列挙した後、テスト容易性・重要性を高めるようブラッシュアップする。 具体的にはテストしにくい要素（入出力やUI操作）を切り離した表現に直していく。

すると、以下のように表現できる。

- [ ] ルートノードに対する追加・削除操作
  - [ ] ルートノードを選択状態にできる
  - [ ] ルートノードを解除状態にできる
  - [ ] 選択状態を変更したとき、更新日時はこうしんしない
  - [ ] 子ノードを新規追加できる
  - [ ] 兄弟ノードを新規追加できない
  - [ ] 削除できない
- [ ] 通常ノードに対する追加・削除操作
  - [ ] 選択状態にできる
  - [ ] 解除状態にできる
  - [ ] 対象ノードの子ノードを新規作成できる
  - [ ] 対象ノードの兄弟ノードを新規作成できる
  - [ ] 対象ノードを削除できる
... etc

ドメインロジックじゃん。

Vue.jsを使っているので、ノード操作をuseNodeというComposablesに切り出した。

テスト容易なTODOを作成する過程で、UIとロジックを強制的に切り離さざるを得なくなるのが嬉しい。 AIにコードを書かせてもUIとロジックが混じらないし、1つのTODOごとに開発ないしはレビューができるので、品質が担保しやすい。

プロジェクトをコントロールできている感があって良い。気持ちが良い。最高、楽しすぎる。

ちなみに今は UI側って TDD でどうやるんだよ...ﾄﾎﾎ... というところで立ち往生している。

参考にしている資料

TDD Boot Camp 2020 Online #1 基調講演/ライブコーディング
テスト駆動開発
単体テストの考え方/使い方