Cannot access a widget by its key during integration test flutter

Question

class LandingScreen extends StatefulWidget {
  const LandingScreen({super.key});

  @override
  _LandingScreenState createState() => _LandingScreenState();
}

class _LandingScreenState extends State<LandingScreen> {
  String marqueeText = Constants.DUMMY_TEXT;

  @override
  Widget build(BuildContext context) {
    var deviceWidth = MediaQuery.of(context).size.width;
    var deviceHeight = MediaQuery.of(context).size.height;
    Widget individualGridItem(
        {required Key? key,
        required String img,
        required String name,
        String? url}) {
      return GestureDetector(
        onTap: () async {
          selectedIcon.value = name;
          print('ss: ${AuthPrefs.userLoggedIn(null, name)}++++$name');
          if (url != null) {
            Navigator.of(context).push(MaterialPageRoute(
                builder: (BuildContext context) => CustomWebView(
                      title: name,
                      url: url,
                    )));
          } else {
            AuthPrefs.userLoggedIn(null, name) == true
                ? Navigator.pushNamed(context, HomeScreen.routeName)
                : Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) =>
                          LoginScreen(imageAsset: img, pageName: name),
                    ),
                  );
          }
        },
        child: Card(
          elevation: 8.0,
          borderOnForeground: true,
          child: Column(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
              Hero(
                tag: img,
                child: Image.asset(
                  img,
                  width: 75,
                  height: 75,
                ),
              ),
              Text(
                name,
                style: const TextStyle(
                    fontWeight: FontWeight.bold, fontSize: 14.0),
              )
            ],
          ),
        ),
      );
    }

    List<Widget> gridItems() {
      return [
        individualGridItem(
            key: Key('carKey'),
            img: ImageConstants.carImg,
            name: context.tr("car")),
        individualGridItem(
            img: ImageConstants.busImg,
            name: context.tr("school_bus"),
            key: Key('schoolBusKey')),
        individualGridItem(
            img: ImageConstants.famImg,
            name: context.tr("family"),
            key: Key('familyKey')),
        individualGridItem(
            img: ImageConstants.empImg,
            name: context.tr("employee"),
            key: Key('employeeKey')),
        individualGridItem(
            img: ImageConstants.localBusImg,
            name: context.tr("local_bus"),
            url: ApiConstants.localBusUrl,
            key: Key('localBusKey')),
        individualGridItem(
            img: ImageConstants.technoSalesLogo,
            name: context.tr("mt"),
            url: ApiConstants.mtUrl,
            key: Key('mtKey')),
      ];
    }

    Widget individualBannerItem(
        {required String img, required Function onClick}) {
      return GestureDetector(
        onTap: () => onClick,
        child: Card(
          borderOnForeground: true,
          color: Colors.transparent,
          elevation: 20,
          child: ClipRRect(
              borderRadius: BorderRadius.circular(5.0),
              child: SizedBox(
                width: deviceWidth / 1.2,
                height: deviceHeight * 0.21,
                child: img.contains("http")
                    ? Image.network(img, fit: BoxFit.fill)
                    : Image.asset(
                        img,
                        fit: BoxFit.fill,
                      ),
              )),
        ),
      );
    }

    tempClick() {
      if (Platform.isIOS) {
        Utilities.demoShowDialog(
            title: "Information",
            body:
                "Int test test",
            context: context);
      } else {
      }
    }

    List<Widget> bannerItems() {
      return [
        individualBannerItem(
            img: ImageConstants.banner,
            onClick: () {
              tempClick();
            }),
        individualBannerItem(
            img:
                "http://www.gpsnepal.com.np/wp-content/uploads/2017/04/Untitledfddc.gif",
            onClick: () {
              tempClick();
            }),
      ];
    }

    Widget bannerSlider = Positioned(
        top: deviceHeight / 11,
        left: deviceWidth / 12.5,
        child: Container(
          color: Colors.transparent,
          width: deviceWidth / 1.2,
          child: CarouselSlider(
            items: bannerItems(),
            options: CarouselOptions(
                height: deviceHeight * 0.21,
                aspectRatio: 16 / 9,
                viewportFraction: 1.0,
                initialPage: 0,
                enableInfiniteScroll: true,
                reverse: false,
                autoPlay: true,
                autoPlayInterval: const Duration(seconds: 5),
                autoPlayAnimationDuration: const Duration(milliseconds: 800),
                autoPlayCurve: Curves.easeInCubic,
                pauseAutoPlayOnTouch: true,
                scrollDirection: Axis.horizontal),
          ),
        ));
    var logo = Positioned(
      top: deviceHeight / 50,
      left: deviceWidth / 40,
      child: Row(
        mainAxisSize: MainAxisSize.min,
        children: <Widget>[
          CircleAvatar(
              backgroundImage: AssetImage(ImageConstants.gpsLogo), radius: 16),
          SizedBox(
            width: deviceWidth * 0.05,
          ),
          const Text(
            appTitle,
            style: TextStyle(
                color: Colors.white, fontSize: 18, fontWeight: FontWeight.bold),
          ),
        ],
      ),
    );
    var infoButton = Positioned(
      top: deviceHeight / 70,
      right: deviceWidth / 40,
      child: Hero(
        tag: 'info',
        child: Material(
          color: Colors.transparent,
          child: IconButton(
            icon: Icon(
              Icons.info,
              size: deviceHeight * 0.05,
              color: Colors.white,
            ),
            onPressed: () {
              Navigator.push(
                context,
                MaterialPageRoute(builder: (context) => CompanyInfoScreen()),
              );
            },
          ),
        ),
      ),
    );
    var marqueeContainer = Container(
      height: deviceHeight * 0.04,
      color: Theme.of(context).primaryColor,
      child: Marquee(
        text: marqueeText,
        blankSpace: 5,
        style: const TextStyle(color: Colors.white, fontSize: 15.0),
        velocity: 30,
      ),
    );
    var menuGrid = SizedBox(
      width: deviceWidth,
      height: deviceHeight / 1.66,
      child: GridView.count(
        childAspectRatio: 16 / 11.5,
        addAutomaticKeepAlives: true,
        addRepaintBoundaries: true,
        padding: const EdgeInsets.all(20.0),
        mainAxisSpacing: 12,
        crossAxisSpacing: 25,
        crossAxisCount: 2,
        children: gridItems(),
      ),
    );
    return SafeArea(
      child: Scaffold(
        body: Stack(
          children: <Widget>[
            SingleChildScrollView(
              child: Column(
                children: <Widget>[
                  Container(
                    width: double.infinity,
                    height: deviceHeight * 0.24,
                    color: Theme.of(context).primaryColor,
                  ),
                  SizedBox(
                    height: deviceHeight * 0.08,
                  ),
                  marqueeContainer,
                  Sizing.smallHeight,
                  CustomLargeText(
                      text: "Version: $appVersion", color: Colors.black),
                  menuGrid,
                ],
              ),
            ),
            bannerSlider,
            logo,
            infoButton,
          ],
        ),
      ),
    );
  }
}

//This is the integration_test file:

void main() {
  IntegrationTestWidgetsFlutterBinding.ensureInitialized();

  testWidgets("On entering wrong username for GPS tracking of private car",
      (tester) async {
    app.main();
    await Future.delayed(const Duration(seconds: 1));
    await tester.tap(find.byKey(Key('carKey')));
    await Future.delayed(const Duration(seconds: 2));
    expect(find.byType(LoginScreen), findsOneWidget);
  });
}

Am receiving the error:
══╡ EXCEPTION CAUGHT BY FLUTTER TEST FRAMEWORK ╞════════════════════════════════════════════════════

The following assertion was thrown running a test:

The finder "Found 0 widgets with key [<'carKey'>]: []" (used in a call to "tap()") could not find

any matching widgets.

Am expecting the test to load the loginScreen on tap of the widget with key('carKey').

Answer 1

Your individualGridItem function doesn't do anything with the key argument it gets. I suppose you'd want to assign it to the GestureDetector that it returns.

So this

    Widget individualGridItem(
        {required Key? key,
        required String img,
        required String name,
        String? url}) {
      return GestureDetector(
        onTap: () async {
    ...

needs to be

    Widget individualGridItem(
        {required Key? key,
        required String img,
        required String name,
        String? url}) {
      return GestureDetector(
        key: key,
        onTap: () async {
    ...