SpringBoot アプリ開発 7.テスト・動作確認

連載記事「SpringBoot アプリ開発」を読み進めると、サンプルの Webアプリを制作することができます。

今回は、テストと手動での動作確認をしていきます。

連載記事

SpringBoot アプリ開発の連載記事は以下の通りです。

1. 概要・使用プロダクト
2. プロジェクト作成・SQL作成
3. モデル・リポジトリの作成
4. コントローラー・メインの作成
5. HTML・JavaScriptの作成
6. CSS・画像の作成
7. テスト・動作確認（今回の記事）

目次

1. 単体テスト
2. 自動UIテスト
3. 動作確認
4. 課題
5. 最後に

1. 単体テスト

JUnit と Mockito を使って、コントローラーのUTを1つだけ実装しました。

src/test/java/sample/controller/TweetControllerTest.java

package sample.controller;

import static org.junit.jupiter.api.Assertions.assertEquals;
import static org.mockito.Mockito.mock;
import static org.mockito.Mockito.when;

import java.util.Map;

import org.junit.jupiter.api.Test;

import sample.model.Tweet;
import sample.repository.TweetRepository;

public class TweetControllerTest {

  @Test
  public void testCreate() {

    // 準備：テストデータ
    Tweet data = new Tweet();
    data.txt = "メッセージ";

    // 準備：モック（リポジトリ）
    TweetRepository mock = mock(TweetRepository.class);
    when(mock.save(data)).thenReturn(data);

    // 準備：テスト対象クラス
    TweetController target = new TweetController();
    target.repo = mock;

    // 実行：テスト対象メソッド
    Map<String, Tweet> result = target.create(data);

    // 検証：ツイートが等しいこと
    Tweet tweet = result.get("tweet");
    assertEquals("メッセージ", tweet.txt);
  }
}

2. 自動UIテスト

JUnit と Selenide を使って、UIテストを1つだけ実装しました。

src/test/java/it/TweetTest.java

package it;

import static com.codeborne.selenide.Condition.*;
import static com.codeborne.selenide.Selenide.*;

import org.junit.jupiter.api.Test;

public class TweetTest {

  @Test
  public void userCanPostTweet() {
    // つぶやき投稿
    open("/");
    $("#txt").setValue("こんにちは。");
    $("#create").click();
    
    // 検証
    var $p = $$(".tweet .txt p").get(0);
    $p.should(appear);
    $p.shouldHave(text("こんにちは。"));
    
    // 投稿を削除
    $$(".tweet").get(0).$(".delete").click();
    switchTo().alert().accept();
  }
}

テストを実行する前に、アプリを起動しておく必要があります。アプリを起動する方法は、次のセクションに記載しています。

3. 動作確認

アプリを起動して、手動での動作確認を行いました。

3.1. アプリの起動

Eclipse などの IDE で App.java を実行するか、プロジェクトのルートディレクトリで以下のコマンドを実行します。

> mvn spring-boot:run

3.2. アプリの表示

ブラウザで以下のURLを開きます。

http://localhost:8080/

3.3. ツイートの投稿

メッセージを入力して「ツイート」を押すと、入力エリアの下にツイートが表示されます。

3.4. ツイートの編集

ツイートの「編集」を押すと、モーダルが表示されて内容を更新することができます。

3.5. ツイートの編集

ツイートの「削除」をクリックして、ダイアログで「OK」を押すと削除することができます。

4. 課題

今回はサンプルアプリでしたが、本格的なアプリにするには以下の点などが課題になると思います。

• バリデーション（長いツイートなどに対応）
• ツイートの表示方法（量が多い場合に対応）
• 認証機能の実装（ログインやユーザー管理）
• 等々

5. 最後に

ここまでお読みいただきありがとうございます。

ご不明な点や不具合などがあれば、コメント等でご連絡をいただけると嬉しいです。

GitHubリポジトリ

アプリのコードは、以下のリポジトリにもあります。

spring-boot-tweet - GitHub