Saltar al contenido principal

Encontrar widgets

Cómo usar las clases Finder para probar widgets.

Para localizar widgets en un entorno de pruebas, utiliza las clases Finder. Aunque es posible escribir tus propias clases Finder, generalmente es más conveniente localizar widgets utilizando las herramientas proporcionadas por el paquete flutter_test.

Durante una sesión de flutter run en una prueba de widget, también puedes tocar interactivamente partes de la pantalla para que la herramienta de Flutter imprima el Finder sugerido.

Esta receta analiza la constante find proporcionada por el paquete flutter_test y demuestra cómo trabajar con algunos de los Finders que proporciona. Para obtener una lista completa de los finders disponibles, consulta la documentación de CommonFinders.

Si no estás familiarizado con las pruebas de widgets y el rol de las clases Finder, consulta la receta Introducción a las pruebas de widgets.

Esta receta utiliza los siguientes pasos:

  1. Busca un widget Text.
  2. Busca un widget con una Key específica.
  3. Busca una instancia de widget específica.

1. Buscar un widget Text

#

En las pruebas, a menudo necesitas buscar widgets que contengan texto específico. Esto es exactamente lo que hace el método find.text(). Crea un Finder que busca widgets que muestren una cadena de texto (String) específica.

dart
testWidgets('finds a Text widget', (tester) async {
  // Build an App with a Text widget that displays the letter 'H'.
  await tester.pumpWidget(const MaterialApp(home: Scaffold(body: Text('H'))));

  // Find a widget that displays the letter 'H'.
  expect(find.text('H'), findsOneWidget);
});

2. Buscar un widget con una Key específica

#

En algunos casos, es posible que desees buscar un widget basándote en la Key que se le ha proporcionado. Esto puede ser útil si se muestran múltiples instancias del mismo widget. Por ejemplo, un ListView podría mostrar varios widgets Text que contienen el mismo texto.

En este caso, proporciona una Key a cada widget en la lista. Esto permite que una aplicación identifique de manera única un widget específico, lo que facilita encontrar el widget en el entorno de pruebas.

dart
testWidgets('finds a widget using a Key', (tester) async {
  // Define the test key.
  const testKey = Key('K');

  // Build a MaterialApp with the testKey.
  await tester.pumpWidget(MaterialApp(key: testKey, home: Container()));

  // Find the MaterialApp widget using the testKey.
  expect(find.byKey(testKey), findsOneWidget);
});

3. Busca una instancia de widget específica

#

Por último, podría interesarte localizar una instancia específica de un widget. Por ejemplo, esto puede ser útil al crear widgets que toman una propiedad child y quieres asegurarte de que estás renderizando el widget child.

dart
testWidgets('finds a specific instance', (tester) async {
  const childWidget = Padding(padding: EdgeInsets.zero);

  // Provide the childWidget to the Container.
  await tester.pumpWidget(Container(child: childWidget));

  // Search for the childWidget in the tree and verify it exists.
  expect(find.byWidget(childWidget), findsOneWidget);
});

Resumen

#

La constante find proporcionada por el paquete flutter_test ofrece varias formas de localizar widgets en el entorno de pruebas. Esta receta demostró tres de estos métodos, y existen varios métodos más para diferentes propósitos.

Si los ejemplos anteriores no funcionan para un caso de uso particular, consulta la documentación de CommonFinders para revisar todos los métodos disponibles.

Ejemplo completo

#
dart
import 'package:flutter/material.dart';
import 'package:flutter_test/flutter_test.dart';

void main() {
  testWidgets('finds a Text widget', (tester) async {
    // Build an App with a Text widget that displays the letter 'H'.
    await tester.pumpWidget(const MaterialApp(home: Scaffold(body: Text('H'))));

    // Find a widget that displays the letter 'H'.
    expect(find.text('H'), findsOneWidget);
  });

  testWidgets('finds a widget using a Key', (tester) async {
    // Define the test key.
    const testKey = Key('K');

    // Build a MaterialApp with the testKey.
    await tester.pumpWidget(MaterialApp(key: testKey, home: Container()));

    // Find the MaterialApp widget using the testKey.
    expect(find.byKey(testKey), findsOneWidget);
  });

  testWidgets('finds a specific instance', (tester) async {
    const childWidget = Padding(padding: EdgeInsets.zero);

    // Provide the childWidget to the Container.
    await tester.pumpWidget(Container(child: childWidget));

    // Search for the childWidget in the tree and verify it exists.
    expect(find.byWidget(childWidget), findsOneWidget);
  });
}