---
title: 音声トリガーのアクションをDIでE2Eテストする
tags: 
author: [tai2](https://docswell.com/user/tai2)
site: [Docswell](https://www.docswell.com/)
thumbnail: https://bcdn.docswell.com/page/47ZLWMWMJ3.jpg?width=480
description: 音声入力(マイクのdBレベル)をトリガーに録音・再生を自動制御するReact Nativeアプリ「VoiceMirror」の開発を題材に、マイク入力という「コードから直接コントロールできない」対象をどうE2Eテストするかを解説します。  ポイントは、音声入力を「サービス」として抽象化し、DI(依存性注入)でE2Eテスト用のスタブサービス(WebSocket経由で任意の波形データを注入できる E2EAudioRecordingService)に差し替えるアーキテクチャ。ReactのContext Providerがそのまま便利なDI機構として機能することも紹介し、この設計はNative/Flutterなど他プラットフォームでも応用可能という気づきで締めくくります。
published: August 20, 26
canonical: https://docswell.com/s/tai2/KY87JE-2026-08-20-200115
---
# Page. 1

![Page Image](https://bcdn.docswell.com/page/47ZLWMWMJ3.jpg)

音声トリガーのアクションをDIで
E2Eテストする
武藤大樹 potatotips #96 2026.8.20


# Page. 2

![Page Image](https://bcdn.docswell.com/page/YJ6WGNG5JV.jpg)

自己紹介
https://tai2.net
2010〜 フリーランス / モバイルアプリいろいろ作った (ポテチでも一回LT)
2020〜 Autify / モバイルアプリ用のE2EテストSaaSめちゃくちゃ作った
2026.8〜 CELLORB / eスポーツの会社でライブ配信のアプリ作っていく


# Page. 3

![Page Image](https://bcdn.docswell.com/page/GJ5MV5VGJ4.jpg)

音声をエコーバックするだけのアプリを作った
• 趣味開発 (React Native)
• https://github.com/tai2/VoiceMirror
• 演技とか声マネの練習に使う
• マイクのdBが閾値を上回ったら自動録音
• マイクのdBが閾値を下回ったら自動再生


# Page. 4

![Page Image](https://bcdn.docswell.com/page/LE3WDNDPE5.jpg)

余談: みんなE2Eテストあまり興味ない…?
• モバイルのE2Eテスト自動化してないやついる!?
• potatotipsのwikiを&quot;appium&quot;で検索→ ヒット0件


# Page. 5

![Page Image](https://bcdn.docswell.com/page/8EDKPWP37G.jpg)

テストすべき仕様(波形に応じたアクション)


# Page. 6

![Page Image](https://bcdn.docswell.com/page/V7PKN9NPJ8.jpg)

E2Eテストどうする?
テストできない!?
アーキテクチャレベルで対応
1. 音声入力をサービスとして抽象化
2. DIでスタブサービスに差し替え


# Page. 7

![Page Image](https://bcdn.docswell.com/page/2JVVKMKVJQ.jpg)

音声入力サービス
• E2EAudioRecordingService ← WebSocketサーバー
• 任意の波形データをメッセージとして送信、イベントをテストする


# Page. 8

![Page Image](https://bcdn.docswell.com/page/5EGLQGQ1JL.jpg)

テストコード


# Page. 9

![Page Image](https://bcdn.docswell.com/page/4JQYKXKN7P.jpg)

発見
• 発見: ReactのContext Providerは、DI機構としてめちゃくちゃ便利
• Native,Flutter等でも同じアイデアでテストできるはず


