Exception "init not called with valid version" when attempt to log in on web

What version are you using?

flutter_facebook_auth:5.0.8

What OS and version are you using to local deploy your application?

Windows 11

What platforms are you seeing the problem on?

web

pubspec.yaml

name: rvtournament
description: Remote Viewing Tournament
# The following line prevents the package from being accidentally published to
# pub.dev using `flutter pub publish`. This is preferred for private packages.
publish_to: 'none' # Remove this line if you wish to publish to pub.dev

# The following defines the version and build number for your application.
# A version number is three numbers separated by dots, like 1.2.43
# followed by an optional build number separated by a +.
# Both the version and the builder number may be overridden in flutter
# build by specifying --build-name and --build-number, respectively.
# In Android, build-name is used as versionName while build-number used as versionCode.
# Read more about Android versioning at https://developer.android.com/studio/publish/versioning
# In iOS, build-name is used as CFBundleShortVersionString while build-number is used as CFBundleVersion.
# Read more about iOS versioning at
# https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html
# In Windows, build-name is used as the major, minor, and patch parts
# of the product and file versions while build-number is used as the build suffix.
version: 1.11.7+61 # Modified 3/30/23

environment:
  sdk: '>=2.19.4 <3.0.0'

# Dependencies specify other packages that your package needs in order to work.
# To automatically upgrade your package dependencies to the latest versions
# consider running `flutter pub upgrade --major-versions`. Alternatively,
# dependencies can be manually updated by changing the version numbers below to
# the latest version available on pub.dev. To see which dependencies have newer
# versions available, run `flutter pub outdated`.
dependencies:
  flutter:
    sdk: flutter

  # The following adds the Cupertino Icons font to your application.
  # Use with the CupertinoIcons class for iOS style icons.
  cupertino_icons: ^1.0.2
  package_info_plus: ^3.0.3
  shared_preferences: ^2.0.18
  video_player: ^2.6.0
  chewie: ^1.0.0
  visibility_detector: ^0.4.0+2
  dio: ^5.0.2
  image: ^4.0.15
  path_provider: ^2.0.13
  sentry_flutter: ^6.22.0
  unique_identifier: ^0.3.0
  date_format: ^2.0.7
  flutter_local_notifications: ^13.0.0
  google_sign_in: ^6.0.2
  the_apple_sign_in: ^1.1.1
  url_launcher: ^6.1.10
  launch_review: ^3.0.1
  firebase_core: ^2.7.1
  retry: ^3.1.0
  google_api_availability: ^4.0.0
  flutter_facebook_auth: ^5.0.8
  photo_view: ^0.14.0
  transparent_image: ^2.0.1
  image_gallery_saver: ^1.7.1
  share_plus: ^6.3.1
  flutter_image: ^4.1.5
  universal_html: ^2.0.9
  flutter_html: ^3.0.0-alpha.6
  flutter_launcher_icons: ^0.12.0

dev_dependencies:
  flutter_test:
    sdk: flutter

  # The "flutter_lints" package below contains a set of recommended lints to
  # encourage good coding practices. The lint set provided by the package is
  # activated in the `analysis_options.yaml` file located at the root of your
  # package. See that file for information about deactivating specific lint
  # rules and activating additional ones.
  flutter_lints: ^2.0.0

# For information on the generic Dart part of this file, see the
# following page: https://dart.dev/tools/pub/pubspec

# The following section is specific to Flutter packages.
flutter:

  # The following line ensures that the Material Icons font is
  # included with your application, so that you can use the icons in
  # the material Icons class.
  uses-material-design: true

  # To add assets to your application, add an assets section, like this:
  assets:
    - assets/images/

  fonts:
    - family: Roboto
      fonts:
        - asset: assets/fonts/Roboto-Medium.ttf

flutter_icons:
  android: "launcher_icon"
  ios: true
  image_path: "assets/icon/icon_1024.png"
  adaptive_icon_background: "assets/icon/icon_background_1024.png"
  adaptive_icon_foreground: "assets/icon/icon_foreground_1024.png"
  min_sdk_android: 21 # android min sdk min:16, default 21
  web:
    generate: true
    image_path: "assets/icon/icon_1024.png"
  windows:
    generate: false
    image_path: "assets/icon/icon_1024.png"
    icon_size: 48 # min:48, max:256, default: 48
  macos:
    generate: false
    image_path: "path/to/image.png"

Describe the Bug

As shown in the example code, I initialize the Facebook SDK:

    // initialize the facebook javascript SDK
    await facebook.FacebookAuth.instance.webAndDesktopInitialize(
      appId: "xxxxxxxxxxxxxxxx",
      cookie: true,
      xfbml: true,
      version: "v15.0", // Tried v15.0, v15.1.0, v15.0.2, v14.0
    );

Later, before attempting to log in, I check FacebookAuth.i.isWebSdkInitialized, which is set to true.

Then I attempt to log in:

final facebook.LoginResult result = await facebook.FacebookAuth.instance.login();

This call causes an exception, with the error: 'init not called with valid version'

I tried this with version set to each of the following values, and it always produces that same error. v14.0 v15.0 v15.0.2 v15.1.0

Note that the Facebook login process works fine on iOS and Android; this problem only affects web builds.

Expected Behavior

The call to login() should not result in an exception.

To Reproduce

  // initialize the facebook javascript SDK
  await facebook.FacebookAuth.instance.webAndDesktopInitialize(
    appId: "xxxxxxxxxxxxxxxx",
    cookie: true,
    xfbml: true,
    version: "v15.0", // Tried v15.0, v15.1.0, v15.0.2, v14.0
  );

`final facebook.LoginResult result = await facebook.FacebookAuth.instance.login(); `

Relevant log output

connectFacebook() called.
FacebookAuth.i.isWebSdkInitialized: true
Exception when calling facebook.FacebookAuth.instance.login(): Error: init not called with valid version

flutter doctor -v

[√] Flutter (Channel stable, 3.7.7, on Microsoft Windows [Version 10.0.22621.1413], locale en-US)
    • Flutter version 3.7.7 on channel stable at C:\flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 2ad6cd72c0 (4 weeks ago), 2023-03-08 09:41:59 -0800
    • Engine revision 1837b5be5f
    • Dart version 2.19.4
    • DevTools version 2.20.1

[√] Windows Version (Installed version of Windows is version 10 or higher)

[√] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
    • Android SDK at C:\Users\mike\AppData\Local\Android\sdk
    • Platform android-33, build-tools 33.0.0
    • Java binary at: C:\Program Files\Android\Android Studio\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 11.0.13+0-b1751.21-8125866)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe

[√] Visual Studio - develop for Windows (Visual Studio Community 2022 17.5.1)
    • Visual Studio at C:\Program Files\Microsoft Visual Studio\2022\Community
    • Visual Studio Community 2022 version 17.5.33424.131
    • Windows 10 SDK version 10.0.22000.0

[√] Android Studio (version 2021.3)
    • Android Studio at C:\Program Files\Android\Android Studio
    • Flutter plugin can be installed from:
       https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
       https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.13+0-b1751.21-8125866)

[√] Connected device (3 available)
    • Windows (desktop) • windows • windows-x64    • Microsoft Windows [Version 10.0.22621.1413]
    • Chrome (web)      • chrome  • web-javascript • Google Chrome 111.0.5563.146
    • Edge (web)        • edge    • web-javascript • Microsoft Edge 111.0.1661.54

[√] HTTP Host Availability
    • All required HTTP hosts are available

• No issues found!

Info.plist (iOS)

No response

Podfile (iOS)

No response

AndroidManifest.xml

No response

MainActivity.java

No response

MainActivity.kt

No response

index.html

<!DOCTYPE html>
<html>
<head>
  <!--
    If you are serving your web app in a path other than the root, change the
    href value below to reflect the base path you are serving from.

    The path provided below has to start and end with a slash "/" in order for
    it to work correctly.

    For more details:
    * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
  -->
  <!--<base href="/">-->

  <meta charset="UTF-8">
  <meta content="IE=Edge" http-equiv="X-UA-Compatible">
  <meta name="description" content="A new Flutter project.">

  <!-- iOS meta tags & icons -->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="apple-mobile-web-app-title" content="rvt">
  <link rel="apple-touch-icon" href="icons/Icon-192.png">

  <meta name="google-signin-client_id" content="272011278931-6a7te5jbn65a1rn6g4qijldifeq3dtd6.apps.googleusercontent.com">

  <title>RV Tournament</title>
  <link rel="manifest" href="manifest.json">
  <link rel="icon" href="https://rvtournament.com/wp-content/uploads/2019/01/cropped-site_icon-192x192.png" sizes="192x192" />
  <link rel="apple-touch-icon-precomposed" href="https://rvtournament.com/wp-content/uploads/2019/01/cropped-site_icon-180x180.png" />
  <meta name="msapplication-TileImage" content="https://rvtournament.com/wp-content/uploads/2019/01/cropped-site_icon-270x270.png" />
</head>
<body>
  <script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js"></script>
  <script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-app.js"></script>
  <script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-analytics.js"></script>
  <!-- This script installs service_worker.js to provide PWA functionality to
       application. For more information, see:
       https://developers.google.com/web/fundamentals/primers/service-workers -->
  <script>
    var serviceWorkerVersion = '1929666323';
    var scriptLoaded = false;
    function loadMainDartJs() {
      if (scriptLoaded) {
        return;
      }
      scriptLoaded = true;
      var scriptTag = document.createElement('script');
      scriptTag.src = 'main.dart.js';
      scriptTag.type = 'application/javascript';
      document.body.append(scriptTag);
    }

    if ('serviceWorker' in navigator) {
      // Service workers are supported. Use them.
      window.addEventListener('load', function () {
        // Wait for registration to finish before dropping the <script> tag.
        // Otherwise, the browser will load the script multiple times,
        // potentially different versions.
        var serviceWorkerUrl = 'flutter_service_worker.js?v=' + serviceWorkerVersion;
        navigator.serviceWorker.register(serviceWorkerUrl)
          .then((reg) => {
            function waitForActivation(serviceWorker) {
              serviceWorker.addEventListener('statechange', () => {
                if (serviceWorker.state == 'activated') {
                  console.log('Installed new service worker.');
                  loadMainDartJs();
                }
              });
            }
            if (!reg.active && (reg.installing || reg.waiting)) {
              // No active web worker and we have installed or are installing
              // one for the first time. Simply wait for it to activate.
              waitForActivation(reg.installing ?? reg.waiting);
            } else if (!reg.active.scriptURL.endsWith(serviceWorkerVersion)) {
              // When the app updates the serviceWorkerVersion changes, so we
              // need to ask the service worker to update.
              console.log('New service worker available.');
              reg.update();
              waitForActivation(reg.installing);
            } else {
              // Existing service worker is still good.
              console.log('Loading app from service worker.');
              loadMainDartJs();
            }
          });

        // If service worker doesn't succeed in a reasonable amount of time,
        // fallback to plaint <script> tag.
        setTimeout(() => {
          if (!scriptLoaded) {
            console.warn(
              'Failed to load app from service worker. Falling back to plain <script> tag.',
            );
            loadMainDartJs();
          }
        }, 4000);
      });
    } else {
      // Service workers not supported. Just drop the <script> tag.
      loadMainDartJs();
    }
  </script>
</body>
</html>

Info.plist (macOS)

No response

darwin-morocho / flutter-facebook-auth