跳到主要內容
目錄

尋找 Widget

目錄

若要在測試環境中定位 Widget，請使用 Finder 類別。雖然您可以撰寫自己的 Finder 類別，但通常使用 flutter_test 套件提供的工具來定位 Widget 會更方便。

在 Widget 測試的 flutter run 階段期間，您也可以互動式點擊螢幕上的部分，讓 Flutter 工具印出建議的 Finder。

本食譜著眼於 flutter_test 套件提供的 find 常數，並示範如何使用它所提供的一些 Finder。如需可用 Finder 的完整清單，請參閱 CommonFinders 文件。

如果您不熟悉 Widget 測試和 Finder 類別的作用，請查看「Widget 測試簡介」食譜。

本食譜使用下列步驟

  1. 尋找一個 Text Widget。
  2. 尋找具有特定 Key 的 Widget。
  3. 尋找特定的 Widget 實例。

1. 尋找一個 Text Widget

#

在測試中，您通常需要尋找包含特定文字的 Widget。這正是 find.text() 方法的用途。它會建立一個 Finder，搜尋顯示特定 String 文字的 Widget。

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. 尋找具有特定 Key 的 Widget

#

在某些情況下，您可能需要根據提供給 Widget 的 Key 來尋找 Widget。如果顯示相同 Widget 的多個實例，這會非常方便。例如，ListView 可能會顯示數個包含相同文字的 Text Widget。

在此情況下，請為清單中的每個 Widget 提供一個 Key。這允許應用程式唯一識別特定 Widget，使其更容易在測試環境中找到 Widget。

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. 尋找特定的 Widget 實例

#

最後，您可能會有興趣定位特定的 Widget 實例。例如，當建立採用 child 屬性的 Widget，並且想要確保正在呈現 child Widget 時，這會很有用。

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);
});

總結

#

flutter_test 套件提供的 find 常數提供了多種在測試環境中定位 Widget 的方法。本食譜示範了其中三種方法，並且還有更多方法可用於不同的用途。

如果上述範例不適用於特定用途，請參閱 CommonFinders 文件，以檢閱所有可用的方法。

完整範例

#
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);
  });
}

除非另有說明，否則本網站上的文件反映 Flutter 的最新穩定版本。頁面最後更新於 2024-04-04。 檢視原始碼 或 回報問題。