flutter-add-widget-test Skill for Claude Code: Write Flutter Widget Tests

Makes Claude write Flutter widget tests with WidgetTester: render a widget, tap, scroll or type, then check what is on screen.

Installs: 40.3K; on skills.sh
Stars: 3.1K; on GitHub
Updated: Nov 2026; last repo commit

flutter-add-widget-test gives Claude a nine-step checklist for a widget test. Claude defines the test with testWidgets, builds the widget with pumpWidget, finds elements with a Finder, checks them with expect and a Matcher, simulates input, rebuilds the tree and checks again. Then it runs flutter test and loops until the test passes.

The skill also says which rebuild call to use. A single pump() fits a tap, pumpAndSettle() fits animations, and scrollUntilVisible fits long lists. It is one SKILL.md with a worked to-do list example, and it adds the flutter_test dev dependency if it is missing.

Good for

Flutter developers who want a test for a custom widget
Teams covering taps, text entry, scrolling and animations in widget tests
Anyone new to flutter_test who wants a step-by-step pattern

Install flutter-add-widget-test

Claude Code

Copy this prompt.

Install the flutter-add-widget-test skill in Claude Code. Run this command:

npx skills add https://github.com/flutter/agent-plugins --skill flutter-add-widget-test

Then check that it loaded and tell me how to use it.

2
Paste it into Claude Code. It shows the change and asks before running it.

Requires Node.js.

From its listing on skills.sh. Source.

What's in the skill

When it loads

Implement a component-level test using `WidgetTester` to verify UI rendering and user interactions (tapping, scrolling, entering text). Use when validating that a specific widget displays correct data and responds to events as expected.

Sections in SKILL.md

Contents
Setup & Configuration
Core Components
Workflow: Implementing a Widget Test
Task Progress
Interaction & State Management
Examples
High-Fidelity Widget Test Implementation

Key facts

Author: The Flutter team (README: "maintained by the Flutter team")
License: BSD-3-Clause
Installs on skills.sh: 40,266 as of 2026-11-02
GitHub stars: 3,136 for the whole flutter/agent-plugins repo, 2026-11-02
Last repo commit: 2026-11-01
What is inside: 1 file: SKILL.md. No scripts.
Part of: The dart-flutter plugin in flutter/agent-plugins, which bundles skills, MCP server configuration and rules
Needs: A Flutter project with flutter_test in dev_dependencies

What it includes

Add flutter_test, put tests in test/, end file names with _test.dart
Three setup rules before the first test.
Write · Setup and configuration
WidgetTester, Finder and Matcher
WidgetTester builds and drives the widget, Finder locates it (find.text, find.byType, find.byKey) and Matcher checks it (findsOneWidget, findsNothing, matchesGoldenFile).
Read · Core components
Define, build, find, verify, interact, rebuild, verify again, run, fix
The checklist ends with a feedback loop: read the output, fix the failing matcher or widget logic, and re-run.
Try: “Add a widget test for the CustomButton to verify the onTap callback is called”
Runs code · Nine-step workflow
Which call fits each kind of change
Static render: pumpWidget once. Tap: tap then pump. Animation: drag then pumpAndSettle. Text: enterText. Long list: scrollUntilVisible.
Read · Interaction rules
A full widget and its test
Shows enterText, tap on a floating action button, pump, then drag to dismiss and pumpAndSettle.
Read · Example: add and remove a to-do

From the official docs

Permissions

Low risk

Claude edits test files and pubspec.yaml and runs flutter test. Work on a branch and read the diff before you commit.

What it can do

Read your data
Create and change things
Delete things
Read-only mode

Watch out for

It edits your project and runs flutter test
Claude adds the flutter_test dependency if needed, writes test files and runs the test command. Work on a branch and read the diff before you commit. github.com

Technical details

Sign-in and keys	SKILL.md names no account or API key.
Scopes	Edits pubspec.yaml and files under test/ Runs flutter test

Questions

What does flutter-add-widget-test do?

It makes Claude write a Flutter widget test with WidgetTester. Claude builds the widget in a test, interacts with it, checks the result and runs the test until it passes.

How do I install flutter-add-widget-test?

Use the install box at the top of this page for this one skill. The Flutter README also points to Flutter's AI setup guide for installing the plugins for your agent.

What does it need in my project?

A Flutter project with flutter_test under dev_dependencies in pubspec.yaml and tests in the test/ folder. SKILL.md has Claude add the dependency if it is missing. It names no API key.

When do I use pump and when pumpAndSettle?

Use pump() after a normal state change such as a tap. Use pumpAndSettle() for animations and other async UI updates, since it keeps pumping frames until none are scheduled.

How is it different from flutter-add-integration-test?

This skill tests one widget in isolation. The README lists flutter-add-integration-test as a separate skill that sets up Flutter Driver and the integration_test package for whole-app flows.

Is flutter-add-widget-test safe?

It is one instruction file with no scripts. Claude edits files in your project and runs flutter test, so work on a branch and read the diff.

Does it work in Codex, Cursor or the Claude app?

The Flutter README describes installing the plugins for "your preferred agent" through Flutter's docs and names no specific agents. It does not document the Claude app.

Information

updated Nov 2, 2026

Repository: flutter/agent-plugins
Folder: skills/flutter-add-widget-test

flutter/agent-plugins skills.sh

Sources

Docs, issue trackers and discussions this page is built from.

Show all 2

flutter-add-widget-test SKILL.md · github.com
flutter/agent-plugins README · github.com