BDD（振る舞い駆動開発）とTDDの違いと連携 - Given-When-Thenで仕様を明確にする実践ガイド

1
2
3
4
5
6

// TDDスタイル：技術的な視点
@Test
void shouldReturnFizzWhenDivisibleByThree() {
    FizzBuzz fizzBuzz = new FizzBuzz();
    assertEquals("Fizz", fizzBuzz.convert(3));
}

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

# BDDスタイル：ビジネス的な視点
Feature: FizzBuzz Game
  As a player
  I want to know the FizzBuzz result
  So that I can play the game correctly

  Scenario: Number divisible by three
    Given I have the number 3
    When I check the FizzBuzz result
    Then I should see "Fizz"

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16

# 良い例：具体的で読みやすい
Feature: User Authentication
  Users should be able to securely log in to their accounts

  Scenario: Successful login with valid credentials
    Given a registered user with email "alice@example.com"
    And the user's password is "SecurePass123"
    When the user attempts to log in with email "alice@example.com" and password "SecurePass123"
    Then the user should be authenticated successfully
    And the user should be redirected to the dashboard

  Scenario: Failed login with incorrect password
    Given a registered user with email "bob@example.com"
    When the user attempts to log in with email "bob@example.com" and password "WrongPassword"
    Then the user should see an error message "Invalid email or password"
    And the user should remain on the login page

1
2
3
4
5
6
7
8
9

# 悪い例：実装詳細が露出している
Scenario: User login
  Given I open Chrome browser
  And I navigate to "https://example.com/login"
  And I find element with id "email-input"
  When I type "test@example.com" into the email field
  And I click the button with class "submit-btn"
  Then I should see HTTP status 200
  And the database should contain a session record

1
2
3
4
5

# 良い例：振る舞いに焦点を当てている
Scenario: User login
  Given I am on the login page
  When I log in with valid credentials
  Then I should be on the dashboard

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

# language: ja
機能: ショッピングカート管理
  オンラインショップの顧客として
  商品をカートに追加・削除したい
  購入前に注文内容を確認できるように

  背景:
    前提 ログイン済みのユーザーである
    かつ カートが空である

  シナリオ: 商品をカートに追加
    前提 商品「プログラミング入門書」が在庫にある
    もし 「プログラミング入門書」をカートに追加する
    ならば カートに「プログラミング入門書」が1個入っている
    かつ カートの合計金額が表示される

  シナリオアウトライン: 複数商品の追加
    もし 「<商品名>」を<個数>個カートに追加する
    ならば カートに「<商品名>」が<個数>個入っている

    例:
      | 商品名           | 個数 |
      | JavaScript入門   | 2    |
      | React実践ガイド  | 1    |
      | TypeScript応用   | 3    |

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

Feature: Shopping Cart Management
  As an online shop customer
  I want to add and remove items from my cart
  So that I can review my order before purchase

  Background:
    Given I am a logged-in user
    And my cart is empty

  Scenario: Add item to cart
    Given the product "Programming Guide" is in stock
    When I add "Programming Guide" to my cart
    Then my cart should contain 1 "Programming Guide"
    And the cart total should be displayed

  Scenario Outline: Add multiple items
    When I add <quantity> of "<product>" to my cart
    Then my cart should contain <quantity> of "<product>"

    Examples:
      | product              | quantity |
      | JavaScript Basics    | 2        |
      | React Practical Guide| 1        |
      | TypeScript Advanced  | 3        |

1
2
3
4
5
6
7
8

Scenario: Register multiple users
  Given the following users exist:
    | name    | email              | role    |
    | Alice   | alice@example.com  | admin   |
    | Bob     | bob@example.com    | user    |
    | Charlie | charlie@example.com| user    |
  When I view the user list
  Then I should see 3 users

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

// shopping-cart.spec.js
describe('Shopping Cart', () => {
  describe('Feature: Add items to cart', () => {
    let cart
    let product

    describe('Scenario: Add a single item to empty cart', () => {
      // Given
      beforeEach(() => {
        cart = new ShoppingCart()
        product = { id: 1, name: 'JavaScript Guide', price: 2500 }
      })

      test('Given the cart is empty', () => {
        expect(cart.items).toHaveLength(0)
      })

      test('When I add a product to the cart', () => {
        cart.addItem(product)
      })

      test('Then the cart should contain 1 item', () => {
        cart.addItem(product)
        expect(cart.items).toHaveLength(1)
      })

      test('And the cart total should equal the product price', () => {
        cart.addItem(product)
        expect(cart.total).toBe(2500)
      })
    })
  })
})

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

Feature: Shopping Cart
  As a customer
  I want to manage items in my shopping cart
  So that I can purchase products I need

  Scenario: Add item to empty cart
    Given I have an empty shopping cart
    When I add a product "JavaScript Guide" priced at 2500 yen
    Then my cart should contain 1 item
    And the cart total should be 2500 yen

  Scenario: Add multiple quantities of same item
    Given I have an empty shopping cart
    When I add 3 of product "React Tutorial" priced at 3000 yen each
    Then my cart should contain 3 items
    And the cart total should be 9000 yen

  Scenario: Remove item from cart
    Given I have a cart with the following items:
      | name            | price | quantity |
      | JavaScript Guide| 2500  | 1        |
      | React Tutorial  | 3000  | 2        |
    When I remove "React Tutorial" from the cart
    Then my cart should contain 1 item
    And the cart total should be 2500 yen

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45

const { Given, When, Then } = require('@cucumber/cucumber')
const { expect } = require('chai')
const ShoppingCart = require('../../src/shopping-cart')

let cart

Given('I have an empty shopping cart', function () {
  cart = new ShoppingCart()
})

Given('I have a cart with the following items:', function (dataTable) {
  cart = new ShoppingCart()
  const items = dataTable.hashes()
  items.forEach(item => {
    const product = {
      name: item.name,
      price: parseInt(item.price)
    }
    for (let i = 0; i < parseInt(item.quantity); i++) {
      cart.addItem(product)
    }
  })
})

When('I add a product {string} priced at {int} yen', function (name, price) {
  cart.addItem({ name, price })
})

When('I add {int} of product {string} priced at {int} yen each', function (quantity, name, price) {
  for (let i = 0; i < quantity; i++) {
    cart.addItem({ name, price })
  }
})

When('I remove {string} from the cart', function (productName) {
  cart.removeItem(productName)
})

Then('my cart should contain {int} item(s)', function (expectedCount) {
  expect(cart.itemCount).to.equal(expectedCount)
})

Then('the cart total should be {int} yen', function (expectedTotal) {
  expect(cart.total).to.equal(expectedTotal)
})

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

class ShoppingCart {
  constructor() {
    this.items = []
  }

  addItem(product) {
    this.items.push(product)
  }

  removeItem(productName) {
    this.items = this.items.filter(item => item.name !== productName)
  }

  get itemCount() {
    return this.items.length
  }

  get total() {
    return this.items.reduce((sum, item) => sum + item.price, 0)
  }
}

module.exports = ShoppingCart

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

<dependencies>
    <!-- Cucumber -->
    <dependency>
        <groupId>io.cucumber</groupId>
        <artifactId>cucumber-java</artifactId>
        <version>7.18.0</version>
        <scope>test</scope>
    </dependency>
    <dependency>
        <groupId>io.cucumber</groupId>
        <artifactId>cucumber-junit-platform-engine</artifactId>
        <version>7.18.0</version>
        <scope>test</scope>
    </dependency>
    
    <!-- JUnit 5 -->
    <dependency>
        <groupId>org.junit.platform</groupId>
        <artifactId>junit-platform-suite</artifactId>
        <version>1.10.3</version>
        <scope>test</scope>
    </dependency>
    
    <!-- Assertions -->
    <dependency>
        <groupId>org.assertj</groupId>
        <artifactId>assertj-core</artifactId>
        <version>3.26.0</version>
        <scope>test</scope>
    </dependency>
</dependencies>

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

Feature: Shopping Cart Management
  As an online shop customer
  I want to manage my shopping cart
  So that I can purchase the products I need

  Background:
    Given the following products are available:
      | id  | name             | price |
      | 101 | Java入門         | 3500  |
      | 102 | Spring Boot実践  | 4200  |
      | 103 | JUnit完全ガイド  | 2800  |

  Scenario: Add single item to empty cart
    Given I have an empty cart
    When I add product with id 101 to my cart
    Then my cart should have 1 item
    And the cart total should be 3500 yen

  Scenario: Calculate total for multiple items
    Given I have an empty cart
    When I add product with id 101 to my cart
    And I add product with id 102 to my cart
    Then my cart should have 2 items
    And the cart total should be 7700 yen

  Scenario Outline: Apply discount based on total
    Given I have items totaling <subtotal> yen in my cart
    When I apply the discount rules
    Then the discount should be <discount> percent
    And the final total should be <final> yen

    Examples:
      | subtotal | discount | final |
      | 5000     | 0        | 5000  |
      | 10000    | 5        | 9500  |
      | 20000    | 10       | 18000 |

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77

package com.example.steps;

import com.example.Product;
import com.example.ShoppingCart;
import io.cucumber.datatable.DataTable;
import io.cucumber.java.en.Given;
import io.cucumber.java.en.When;
import io.cucumber.java.en.Then;
import io.cucumber.java.en.And;

import java.util.HashMap;
import java.util.List;
import java.util.Map;

import static org.assertj.core.api.Assertions.assertThat;

public class ShoppingCartSteps {

    private Map<Integer, Product> availableProducts = new HashMap<>();
    private ShoppingCart cart;
    private int appliedDiscount;

    @Given("the following products are available:")
    public void theFollowingProductsAreAvailable(DataTable dataTable) {
        List<Map<String, String>> rows = dataTable.asMaps();
        for (Map<String, String> row : rows) {
            int id = Integer.parseInt(row.get("id"));
            String name = row.get("name");
            int price = Integer.parseInt(row.get("price"));
            availableProducts.put(id, new Product(id, name, price));
        }
    }

    @Given("I have an empty cart")
    public void iHaveAnEmptyCart() {
        cart = new ShoppingCart();
    }

    @Given("I have items totaling {int} yen in my cart")
    public void iHaveItemsTotalingYenInMyCart(int total) {
        cart = new ShoppingCart();
        // ダミー商品を追加して合計金額を設定
        cart.addItem(new Product(999, "Dummy", total));
    }

    @When("I add product with id {int} to my cart")
    public void iAddProductWithIdToMyCart(int productId) {
        Product product = availableProducts.get(productId);
        cart.addItem(product);
    }

    @When("I apply the discount rules")
    public void iApplyTheDiscountRules() {
        appliedDiscount = cart.calculateDiscountPercent();
    }

    @Then("my cart should have {int} item(s)")
    public void myCartShouldHaveItems(int expectedCount) {
        assertThat(cart.getItemCount()).isEqualTo(expectedCount);
    }

    @Then("the cart total should be {int} yen")
    public void theCartTotalShouldBeYen(int expectedTotal) {
        assertThat(cart.getSubtotal()).isEqualTo(expectedTotal);
    }

    @Then("the discount should be {int} percent")
    public void theDiscountShouldBePercent(int expectedDiscount) {
        assertThat(appliedDiscount).isEqualTo(expectedDiscount);
    }

    @And("the final total should be {int} yen")
    public void theFinalTotalShouldBeYen(int expectedFinal) {
        int finalTotal = cart.calculateFinalTotal();
        assertThat(finalTotal).isEqualTo(expectedFinal);
    }
}

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17

package com.example;

import org.junit.platform.suite.api.ConfigurationParameter;
import org.junit.platform.suite.api.IncludeEngines;
import org.junit.platform.suite.api.SelectClasspathResource;
import org.junit.platform.suite.api.Suite;

import static io.cucumber.junit.platform.engine.Constants.GLUE_PROPERTY_NAME;
import static io.cucumber.junit.platform.engine.Constants.PLUGIN_PROPERTY_NAME;

@Suite
@IncludeEngines("cucumber")
@SelectClasspathResource("features")
@ConfigurationParameter(key = GLUE_PROPERTY_NAME, value = "com.example.steps")
@ConfigurationParameter(key = PLUGIN_PROPERTY_NAME, value = "pretty, html:target/cucumber-reports.html")
public class RunCucumberTest {
}

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13

Feature: User Registration
  As a new user
  I want to register an account
  So that I can access the application

  Scenario: Successful registration with valid data
    Given I am on the registration page
    When I register with the following details:
      | email            | password      | name    |
      | test@example.com | SecurePass123 | Taro    |
    Then my account should be created
    And I should receive a welcome email
    And I should be logged in automatically

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22

@Given("I am on the registration page")
public void iAmOnTheRegistrationPage() {
    registrationPage = new RegistrationPage(driver);
    registrationPage.navigate();
}

@When("I register with the following details:")
public void iRegisterWithTheFollowingDetails(DataTable dataTable) {
    Map<String, String> data = dataTable.asMaps().get(0);
    registrationPage.fillForm(
        data.get("email"),
        data.get("password"),
        data.get("name")
    );
    registrationPage.submit();
}

@Then("my account should be created")
public void myAccountShouldBeCreated() {
    // この時点ではUserServiceが存在しないため失敗
    assertThat(userService.findByEmail("test@example.com")).isPresent();
}

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

// TDDサイクル1: ユーザー保存機能
@Test
void shouldSaveNewUser() {
    // Red: テストを書く
    UserService service = new UserService(userRepository);
    User user = new User("test@example.com", "SecurePass123", "Taro");
    
    service.register(user);
    
    verify(userRepository).save(user);
}

// TDDサイクル2: メール送信機能
@Test
void shouldSendWelcomeEmailAfterRegistration() {
    UserService service = new UserService(userRepository, emailService);
    User user = new User("test@example.com", "SecurePass123", "Taro");
    
    service.register(user);
    
    verify(emailService).sendWelcomeEmail("test@example.com", "Taro");
}

// TDDサイクル3: 重複チェック
@Test
void shouldRejectDuplicateEmail() {
    when(userRepository.existsByEmail("existing@example.com")).thenReturn(true);
    UserService service = new UserService(userRepository, emailService);
    User user = new User("existing@example.com", "Pass123", "User");
    
    assertThrows(DuplicateEmailException.class, () -> service.register(user));
}

1
2
3
4
5
6
7
8

# HTML形式レポート
cucumber-js --format html:reports/cucumber-report.html

# JSON形式レポート（CI/CD連携用）
cucumber-js --format json:reports/cucumber-report.json

# JUnit XML形式（CI/CDツール連携）
cucumber-js --format junit:reports/cucumber-junit.xml