InAppWebView Flutter : Failed to get fallback IMM with expected displayId

Question

I have created WebView in my flutter project using InAppWebView as below :

Widget build(BuildContext context) {
return Scaffold(
  body: SafeArea(
    child: Stack(
      children: <Widget>[
        InAppWebView(
          initialUrlRequest: URLRequest(url: Uri.parse(widget.url)),
          initialOptions: InAppWebViewGroupOptions(
            crossPlatform:
                InAppWebViewOptions(javaScriptCanOpenWindowsAutomatically:true,useShouldOverrideUrlLoading: true, javaScriptEnabled: true),
            ios: IOSInAppWebViewOptions(),
            android: AndroidInAppWebViewOptions(),
          ),
          onWebViewCreated: (controller) {
            webViewController = controller;
          },
          onProgressChanged: (controller, progress) {
            print(progress.toString());
            if (progress == 100) {
              setState(() {
                isLoading = false;
              });
            } else {
              setState(() {
                isLoading = true;
              });
            }
          },
          onLoadError: (controller, url, i, s) async {
            if (widget.stopOnURL != null &&
                url.toString().contains(widget.stopOnURL)) {
              showCustomView(url.toString());
            } else {
              showError();
            }
          },
          onLoadHttpError: (controller, url, i, s) async {
            if (widget.stopOnURL != null &&
                url.toString().contains(widget.stopOnURL)) {
              showCustomView(url.toString());
            } else {
              showError();
            }
          },
          shouldOverrideUrlLoading:
              (controller, shouldOverrideUrlLoadingRequest) async {
            var url = shouldOverrideUrlLoadingRequest.request.url;
            if (widget.stopOnURL != null &&
                url.toString().contains(widget.stopOnURL)) {
              return NavigationActionPolicy.CANCEL;
            }
            return NavigationActionPolicy.ALLOW;
          },
        ),
        showErrorPage
            ? Center(
                child: Container(
                  color: Colors.white,
                  alignment: Alignment.center,
                  height: double.infinity,
                  width: double.infinity,
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      Padding(
                        padding: EdgeInsets.only(bottom: 20),
                        child: Image.asset(
                          ImageConstants.icFailure,
                          height: 100,
                          width: 100,
                        ),
                      ),
                      Text('Internal Server Error'),
                    ],
                  ),
                ),
              )
            : SizedBox(height: 0, width: 0),
        isLoading
            ? Center(
                child: CircularProgressIndicator(
                  valueColor: AlwaysStoppedAnimation<Color>(
                      ColorUtils.primaryColor),
                ),
              )
            : Stack(),
        showCustomPage
            ? widget.onStopCustomView(currentURL)
            : Positioned(
                top: 0,
                right: 0,
                child: IconButton(
                  icon: Icon(Icons.close),
                  onPressed: widget.onClose,
                ),
              ),
      ],
    ),
  ),
);

}

But Getting below error specifically in Android. In Ios its working fine :

Failed to get fallback IMM with expected displayId=124 actual IMM#displayId=0 view=com.pichillilorenzo.flutter_inappwebview.in_app_webview.InAppWebView{5c047cc VFEDHVCL. ......ID 0,0-1080,2022

You can see in code that I have also added necessary thing as below :

initialOptions: InAppWebViewGroupOptions(
        crossPlatform:
            InAppWebViewOptions(javaScriptCanOpenWindowsAutomatically:true,useShouldOverrideUrlLoading: true, javaScriptEnabled: true),
        ios: IOSInAppWebViewOptions(),
        android: AndroidInAppWebViewOptions(),
      )

What might be the issue ? Thanks.

Answer 1

You have to enable hybrid composition. You can look at this github link https://github.com/flutter/flutter/issues/40716#issuecomment-708076795

android: AndroidInAppWebViewOptions(
           useHybridComposition: true,
         ),