LateInitializationError from ScreenUtil package

I am trying to test 3 buttons which extend

abstract class LoginButton extends StatelessWidget {
  final String label;
  final void Function() onPressed;
  final CustomIcon icon;

  const LoginButton({
    Key? key,
    required this.label,
    required this.onPressed,
    required this.icon,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      width: 250.w,
      height: 58.h,
      child: ElevatedButton(
        style: ElevatedButton.styleFrom(
          backgroundColor: Colors.white,
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(15.r),
          ),
        ),
        onPressed: onPressed,
        child: FittedBox(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              icon,
              SizedBox(width: 22.w),
              Container(
                constraints: BoxConstraints(maxWidth: 204.w),
                child: Text(
                  label,
                  style: TextStyle(
                    fontSize: 16.sp,
                    color: Colors.black,
                    fontWeight: FontWeight.w500,
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

Here is the button actually being tested

class GoogleLoginButton extends LoginButton {
  GoogleLoginButton({
    Key? key,
    required void Function() onPressed,
  }) : super(
          key: key,
          label: 'Sign in with Google',
          onPressed: onPressed,
          icon: GoogleIcon(height: 24.h, width: 24.w),
        );
}

The error that I'm running into; it is a late initialization error for screen util package

LateInitializationError: Field '_splitScreenMode@488084504' has not been initialized.

Each component that I'm trying to test is wrapped with this wrapper

class _Wrapper extends StatelessWidget {
  final Widget child;

  const _Wrapper(this.child);

  @override
  Widget build(BuildContext context) {
    return ScreenUtilInit(
      designSize: const Size(430, 932),
      builder: (context, child) => child!,
    );
  }
}

Widget testableWidget(Widget child) {
  return MediaQuery(
    data: const MediaQueryData(),
    child: MaterialApp(
      home: Scaffold(
        body: _Wrapper(child),
      ),
    ),
  );
}

I am running into this error only when I'm testing this component, i.e. when a component is extending another stateless widget. When testing a standalone stateless widget it works fine.

Update

On removing the screenutil units in the GoogleLoginButton component the test works. Need to figure out a way to initialize screenutil before that is called.

Seems like something from ScreenUtil has not been initialized.

As documentation reports, try this:

...

   @override
   Widget build(BuildContext context) {
     return ScreenUtilInit(
       designSize: const Size(360, 690),
       minTextAdapt: true,
       splitScreenMode: true, <-- THIS
       builder: (context , child) {
         return MaterialApp(
...

If adding splitScreenMode doesn't help, let me know and I will provide more support. Happy coding!

UPDATE

Since Stateless widgets are built directly when called, you should try initializing it before the widget builds and by passing it as a parameter. If this is not suitable in your case, I would try to create a Stateful widget to manage better the state and the initialization.

Please, let me know if this solved your problem, happy coding!