flutter 測試未找到小部件

Question

我有這段代碼可以測試按鈕是否在屏幕上：

void main() {
  testWidgets('Search for button', (WidgetTester tester) async {
    await tester.pumpWidget(MaterialApp(
      home: HomeView(),
    ));
    final button = find.byType(BotaoRedirecionamentoInterno);
    expect(button, findsWidgets);
  });
}

按我的預期工作，但是當我嘗試使用此代碼在同一視圖中搜索另一種類型的按鈕時，它確實起作用了：

void main() {
  testWidgets('Search for button', (WidgetTester tester) async {
    await tester.pumpWidget(MaterialApp(
      home: HomeView(),
    ));
    final button = find.byType(BotaoRedirecionamentoExterno);
    expect(button, findsWidgets);
  });
}

我不明白為什么，因為它們恰好位於 HomeView 下方的一行：

      Expanded(
        child: GridView.count(
          childAspectRatio: 6,
          padding: EdgeInsets.only(left: screenWidth * .05, right: screenWidth * .05),
          mainAxisSpacing: screenHeight * 0.02,
          crossAxisCount: 1,
          children: const [
            BotaoRedirecionamentoInterno(texto: "aaa", rota: '/bbbb'),
            BotaoRedirecionamentoExterno(texto: 'aaa', url: "bbb"),
            BotaoRedirecionamentoExterno(texto: "aaa", url: "bbb"),
            BotaoRedirecionamentoExterno(texto: "aaa", url: "bbb"),
            BotaoRedirecionamentoExterno(texto: "aaa", url: 'bbb'),
            BotaoRedirecionamentoExterno(texto: "aaa", url: "bbb"),
          ],
        ),
      )

這是錯誤信息：

══╡ EXCEPTION CAUGHT BY FLUTTER TEST FRAMEWORK ╞════════════════════════════════════════════════════
The following TestFailure object was thrown running a test:
  Expected: at least one matching node in the widget tree
  Actual: _WidgetTypeFinder:<zero widgets with type "BotaoRedirecionamentoExterno" (ignoring
offstage widgets)>

我發現，如果我將 GridView 中的 position 更改為：

 Expanded(
            child: GridView.count(
              childAspectRatio: 6,
              padding: EdgeInsets.only(left: screenWidth * .05, right: screenWidth * .05),
              mainAxisSpacing: screenHeight * 0.02,
              crossAxisCount: 1,
              children: const [
                BotaoRedirecionamentoExterno(texto: 'aaa', url: "bbb"),
                BotaoRedirecionamentoInterno(texto: "aaa", rota: '/bbbb'),

                BotaoRedirecionamentoExterno(texto: "aaa", url: "bbb"),
                BotaoRedirecionamentoExterno(texto: "aaa", url: "bbb"),
                BotaoRedirecionamentoExterno(texto: "aaa", url: 'bbb'),
                BotaoRedirecionamentoExterno(texto: "aaa", url: "bbb"),
              ],
            ),
          )

測試找到了 BotaoRedirecionamentoInterno 但找不到 BotaoRedirecionamentoExterno，所以我的猜測是只找到 GridView 中的第一個小部件。

任何人都可以幫我弄清楚發生了什么？

Answer 1

使用 dragUntilVisible 向右滾動 GridView，看下面一個它會滾動到BotaoRedirecionamentoExterno小部件，你可以用任何Key或Text替換它..

await tester.dragUntilVisible(
    find.byType(BotaoRedirecionamentoExterno), // what you want to find
    find.byType(GridView), // widget you want to scroll
    const Offset(-250, -0), // delta to move
);

Answer 2

該測試實際上可能按預期工作： Exanded中的第二個子小部件在屏幕上不可見，因此無法找到。 find方法只會返回已創建的 Widget，如果不可見， Gridview不會創建所有的 Widget。 如果您交換訂單，它確實顯示的事實表明第一個Interno小部件很大。