/test-flutter
Flutter App のテスト実行・静的解析・フォーマット・テスト記述ガイド
$ npx -y skills add K9i-0/ccpocket --skill test-flutter --agent claude-codeHow it fires
How this skill gets triggered: by you, by Claude, or both.
- Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
- You can call itInvoke it directly when you want it.
- Slash command
/test-flutter
Context preview
The summary Claude sees to decide when to auto-load this skill.
Flutter App のテスト実行・静的解析・フォーマット・テスト記述ガイド
SKILL.md
test-flutter.SKILL.mdname: test-flutter
description: Flutter App のテスト実行・静的解析・フォーマット・テスト記述ガイド
disable-model-invocation: true
allowed-tools: Bash(flutter:*), Bash(dart:*), Read, Glob, Grep
Flutter App テスト
実行手順
以下を順番に実行し、全てパスすることを確認する。
1. 静的解析
dart analyze apps/mobile
warning 以上は修正する。info レベルは必要に応じて対応。
**MCP代替:** `mcp__dart-mcp__analyze_files` でも実行可能だが、CLI推奨。
2. フォーマット
dart format apps/mobile
3. ユニットテスト
cd apps/mobile && flutter test
特定ファイルのみ:
cd apps/mobile && flutter test test/<filename>_test.dart
**MCP代替:** `mcp__dart-mcp__run_tests` でも実行可能だが、CLI推奨。 MCP版はDTD接続不要な操作のため、CLIの方が効率的。
テスト記述規約
ファイル配置・命名
- テストファイルは `apps/mobile/test/` に配置
- 命名: `<対象の概念>_test.dart`
- ウィジェットテスト例: `approval_bar_test.dart`, `chat_input_bar_test.dart`
- ロジックテスト例: `chat_message_handler_test.dart`
import
import 'package:flutter_test/flutter_test.dart';
import 'package:ccpocket/...';
テスト構造
void main() {
group('対象クラスまたは機能', () {
test('動作の説明', () {
// ロジックテスト
expect(actual, expected);
});
testWidgets('UI動作の説明', (tester) async {
// ウィジェットテスト
await tester.pumpWidget(MaterialApp(home: TargetWidget()));
expect(find.text('expected'), findsOneWidget);
});
});
}- `group` で対象機能ごとにグルーピング
- ロジックテストは `test()`、UI テストは `testWidgets()` を使い分ける
- `setUp()` でテスト前の共通初期化を行う
テスト対象の方針
- **ウィジェットテスト**: 画面の表示・インタラクション検証
- `pumpWidget` でウィジェット構築 → `find` で要素確認 → `tap`/`enterText` で操作
- **ロジックテスト**: サービス・ハンドラーの振る舞い検証
- 純粋なDartクラスのメソッド呼び出しと結果確認
- WebSocket通信やBridge接続のモックが必要なテストは避ける (E2E領域)
既存テストファイル一覧
- `approval_bar_test.dart` — 承認バーUI
- `ask_user_question_widget_test.dart` — AskUserQuestion UI
- `chat_input_bar_test.dart` — チャット入力バーUI
- `chat_message_handler_test.dart` — メッセージハンドラーロジック
- `gallery_screen_test.dart` — ギャラリー画面
- `home_screen_test.dart` — ホーム画面
- `plan_mode_test.dart` — プランモードUI
- `session_card_test.dart` — セッションカードUI
- `slash_command_test.dart` — スラッシュコマンドUI
- `tool_result_bubble_test.dart` — ツール結果表示
- `tool_use_tile_test.dart` — ツール使用タイル表示
Read more
name: test-flutter description: Flutter App のテスト実行・静的解析・フォーマット・テスト記述ガイド disable-model-invocation: true allowed-tools: Bash(flutter:*), Bash(dart:*), Read, Glob, Grep
Flutter App テスト
実行手順
以下を順番に実行し、全てパスすることを確認する。
1. 静的解析
dart analyze apps/mobile
warning 以上は修正する。info レベルは必要に応じて対応。
**MCP代替:** `mcp__dart-mcp__analyze_files` でも実行可能だが、CLI推奨。
2. フォーマット
dart format apps/mobile
3. ユニットテスト
cd apps/mobile && flutter test
特定ファイルのみ:
cd apps/mobile && flutter test test/<filename>_test.dart
**MCP代替:** `mcp__dart-mcp__run_tests` でも実行可能だが、CLI推奨。 MCP版はDTD接続不要な操作のため、CLIの方が効率的。
テスト記述規約
ファイル配置・命名
- テストファイルは `apps/mobile/test/` に配置
- 命名: `<対象の概念>_test.dart`
- ウィジェットテスト例: `approval_bar_test.dart`, `chat_input_bar_test.dart`
- ロジックテスト例: `chat_message_handler_test.dart`
import
import 'package:flutter_test/flutter_test.dart'; import 'package:ccpocket/...';
テスト構造
void main() {
group('対象クラスまたは機能', () {
test('動作の説明', () {
// ロジックテスト
expect(actual, expected);
});
testWidgets('UI動作の説明', (tester) async {
// ウィジェットテスト
await tester.pumpWidget(MaterialApp(home: TargetWidget()));
expect(find.text('expected'), findsOneWidget);
});
});
}- `group` で対象機能ごとにグルーピング
- ロジックテストは `test()`、UI テストは `testWidgets()` を使い分ける
- `setUp()` でテスト前の共通初期化を行う
テスト対象の方針
- **ウィジェットテスト**: 画面の表示・インタラクション検証
- `pumpWidget` でウィジェット構築 → `find` で要素確認 → `tap`/`enterText` で操作
- **ロジックテスト**: サービス・ハンドラーの振る舞い検証
- 純粋なDartクラスのメソッド呼び出しと結果確認
- WebSocket通信やBridge接続のモックが必要なテストは避ける (E2E領域)
既存テストファイル一覧
- `approval_bar_test.dart` — 承認バーUI
- `ask_user_question_widget_test.dart` — AskUserQuestion UI
- `chat_input_bar_test.dart` — チャット入力バーUI
- `chat_message_handler_test.dart` — メッセージハンドラーロジック
- `gallery_screen_test.dart` — ギャラリー画面
- `home_screen_test.dart` — ホーム画面
- `plan_mode_test.dart` — プランモードUI
- `session_card_test.dart` — セッションカードUI
- `slash_command_test.dart` — スラッシュコマンドUI
- `tool_result_bubble_test.dart` — ツール結果表示
- `tool_use_tile_test.dart` — ツール使用タイル表示
CC Pocket is a mobile and desktop app for controlling Codex and Claude coding-agent sessions.
Other skills on ccpocket.
- /codex-guide
Codex の使い方、CLI/app/IDE、rules・hooks・AGENTS.md・skills・subagents・config などを案内する。Codex や OpenAI 製品の仕様を答える前に必ず公式ドキュメントを確認し、rules/approval は `codex execpolicy check` で実検証すること。
Open skill - /flutter-ui-design
Flutter UI実装のアーキテクチャ規約・コンポーネント分割・状態管理ガイド(Bloc/Cubit版)
Open skill - /flutter-upgrade
Flutter SDKバージョンアップグレード対応。新バージョンのリリースノート・Breaking Changes調査、コードベース影響分析、mise/CI/Shorebird含むプロジェクト全体の対応タスクリスト作成と実行。「Flutterアップグレード」「Flutter X.Y.Zがリリースされた」「Flutter最新化」「Flutter更新」と言われたとき、またはFlutterの新バージョンについて言及されたときに使用する。
Open skill - /merge
ブランチをメインにマージしてお掃除する
Open skill - /mobile-automation
MCP (dart-mcp + Marionette) を使ったFlutterアプリのE2E自動化・UI検証ガイド。シミュレーターでのUI動作確認、モックプレビュー検証、Bridge経由のE2Eテスト、スクリーンショット撮影など、アプリの動作検証が必要なときに使う。「動作確認して」「UIを検証して」「E2Eテスト」「シミュレーターで確認」「モックで確認」と言われたときや、UI変更後の検証フェーズで使用すること。
Open skill - /playwright-cli
Automates browser interactions for web testing, form filling, screenshots, and data extraction. Use when the user needs to navigate websites, interact with web pages, fill forms, take screenshots, test web applications, or extract information from web pages.
Open skill

