fix: ScreenshotIntegration not being added for web (#3055)

* Fix enabling of screenshots for web

* Update

* Update tests

* Update

* Fix analyze

* Update CHANGELOG

Author: buenaflor

CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## Unreleased
+
+### Fixes
+
+- `ScreenshotIntegration` not being added for web ([#3055](https://github.com/getsentry/sentry-dart/pull/3055))
+
 ## 9.4.0
 
 ### Fixes

flutter/lib/src/event_processor/screenshot_event_processor.dart

@@ -3,10 +3,10 @@ import 'dart:typed_data';
 
 import 'package:meta/meta.dart';
 import '../../sentry_flutter.dart';
-import '../renderer/renderer.dart';
 import '../screenshot/recorder.dart';
 import '../screenshot/recorder_config.dart';
 
+import '../screenshot/screenshot_support.dart';
 import '../utils/debouncer.dart';
 
 class ScreenshotEventProcessor implements EventProcessor {
@@ -47,6 +47,15 @@ class ScreenshotEventProcessor implements EventProcessor {
       return event; // No need to attach screenshot of feedback form.
     }
 
+    final renderer = _options.rendererWrapper.renderer;
+    if (!_options.isScreenshotSupported) {
+      _options.log(
+        SentryLevel.debug,
+        'Screenshot: not supported in this environment with renderer $renderer',
+      );
+      return event;
+    }
+
     // skip capturing in case of debouncing (=too many frequent capture requests)
     // the BeforeCaptureCallback may overrule the debouncing decision
     final shouldDebounce = _debouncer.shouldDebounce();
@@ -70,7 +79,7 @@ class ScreenshotEventProcessor implements EventProcessor {
       } else if (shouldDebounce) {
         _options.log(
           SentryLevel.debug,
-          'Skipping screenshot capture due to debouncing (too many captures within ${_debouncer.waitTime.inMilliseconds}ms)',
+          'Screenshot: skipping capture due to debouncing (too many captures within ${_debouncer.waitTime.inMilliseconds}ms)',
         );
         takeScreenshot = false;
       }
@@ -81,7 +90,7 @@ class ScreenshotEventProcessor implements EventProcessor {
     } catch (exception, stackTrace) {
       _options.log(
         SentryLevel.error,
-        'The beforeCaptureScreenshot/beforeScreenshot callback threw an exception',
+        'Screenshot: the beforeCaptureScreenshot/beforeScreenshot callback threw an exception',
         exception: exception,
         stackTrace: stackTrace,
       );
@@ -90,16 +99,6 @@ class ScreenshotEventProcessor implements EventProcessor {
       }
     }
 
-    final renderer = _options.rendererWrapper.getRenderer();
-
-    if (_options.platform.isWeb && renderer != FlutterRenderer.canvasKit) {
-      _options.log(
-        SentryLevel.debug,
-        'Cannot take screenshot with ${renderer?.name} renderer.',
-      );
-      return event;
-    }
-
     final screenshotData = await createScreenshot();
     if (screenshotData != null) {
       hint.screenshot = SentryAttachment.fromScreenshotData(screenshotData);

flutter/lib/src/renderer/renderer.dart

@@ -6,9 +6,7 @@ import 'unknown_renderer.dart'
 
 @internal
 class RendererWrapper {
-  FlutterRenderer? getRenderer() {
-    return implementation.getRenderer();
-  }
+  late final FlutterRenderer? renderer = implementation.getRenderer();
 }
 
 enum FlutterRenderer {
@@ -18,10 +16,13 @@ enum FlutterRenderer {
   /// https://docs.flutter.dev/perf/impeller
   impeller,
 
-  /// https://docs.flutter.dev/platform-integration/web/renderers
+  /// https://docs.flutter.dev/platform-integration/web/renderers#canvaskit
   canvasKit,
 
-  /// https://docs.flutter.dev/platform-integration/web/renderers
+  /// https://docs.flutter.dev/platform-integration/web/renderers#skwasm
+  skwasm,
+
+  /// HTML is still there but considered legacy
   html,
   unknown,
 }

flutter/lib/src/renderer/web_renderer.dart

@@ -1,18 +1,9 @@
-import 'dart:js_interop';
+import 'package:flutter/foundation.dart';
 
 import 'renderer.dart';
 
 FlutterRenderer? getRenderer() {
-  return isCanvasKitRenderer ? FlutterRenderer.canvasKit : FlutterRenderer.html;
+  if (isCanvasKit) return FlutterRenderer.canvasKit;
+  if (isSkwasm) return FlutterRenderer.skwasm;
+  return FlutterRenderer.html;
 }
-
-bool get isCanvasKitRenderer {
-  return _windowFlutterCanvasKit != null;
-}
-
-// These values are set by the engine. They are used to determine if the
-// application is using canvaskit or skwasm.
-//
-// See https://github.com/flutter/flutter/blob/414d9238720a3cde85475f49ce0ba313f95046f7/packages/flutter/lib/src/foundation/_capabilities_web.dart#L10
-@JS('window.flutterCanvasKit')
-external JSAny? get _windowFlutterCanvasKit;

flutter/lib/src/screenshot/screenshot_support.dart

@@ -0,0 +1,19 @@
+import '../../sentry_flutter.dart';
+import '../renderer/renderer.dart';
+
+extension ScreenshotSupport on SentryFlutterOptions {
+  /// Returns `true` if capturing screenshots are allowed in the current environment.
+  ///
+  /// - On mobile / desktop we allow them unconditionally.
+  /// - On Web we allow them only when the renderer is CanvasKit or Skwasm.
+  bool get isScreenshotSupported {
+    // Mobile / desktop → always OK.
+    if (!platform.isWeb) return true;
+
+    const supportedWebRenderers = {
+      FlutterRenderer.canvasKit,
+      FlutterRenderer.skwasm,
+    };
+    return supportedWebRenderers.contains(rendererWrapper.renderer);
+  }
+}

flutter/lib/src/sentry_flutter.dart

@@ -27,8 +27,8 @@ import 'native/factory.dart';
 import 'native/native_scope_observer.dart';
 import 'native/sentry_native_binding.dart';
 import 'profiling.dart';
-import 'renderer/renderer.dart';
 import 'replay/integration.dart';
+import 'screenshot/screenshot_support.dart';
 import 'utils/platform_dispatcher_wrapper.dart';
 import 'version.dart';
 import 'view_hierarchy/view_hierarchy_integration.dart';
@@ -205,8 +205,7 @@ mixin SentryFlutter {
       options.enableDartSymbolication = false;
     }
 
-    final renderer = options.rendererWrapper.getRenderer();
-    if (!platform.isWeb || renderer == FlutterRenderer.canvasKit) {
+    if (options.isScreenshotSupported) {
       integrations.add(ScreenshotIntegration());
     }
 

flutter/test/event_processor/screenshot_event_processor_test.dart

@@ -83,6 +83,12 @@ void main() {
           added: false, isWeb: true);
     });
 
+    testWidgets('adds screenshot attachment with skwasm renderer',
+        (tester) async {
+      await _addScreenshotAttachment(tester, FlutterRenderer.skwasm,
+          added: true, isWeb: true);
+    });
+
     testWidgets('does add screenshot in correct resolution for low',
         (tester) async {
       final height = SentryScreenshotQuality.low.targetResolution()!;

flutter/test/mocks.dart

@@ -124,9 +124,7 @@ class MockRendererWrapper implements RendererWrapper {
   final FlutterRenderer? _renderer;
 
   @override
-  FlutterRenderer? getRenderer() {
-    return _renderer;
-  }
+  FlutterRenderer? get renderer => _renderer;
 }
 
 class TestBindingWrapper implements BindingWrapper {

flutter/test/screenshot/screenshot_support_test.dart

@@ -0,0 +1,58 @@
+import 'package:flutter_test/flutter_test.dart';
+import 'package:sentry/src/platform/mock_platform.dart';
+import 'package:sentry_flutter/sentry_flutter.dart';
+import 'package:sentry_flutter/src/renderer/renderer.dart';
+import 'package:sentry_flutter/src/screenshot/screenshot_support.dart';
+
+import '../mocks.dart';
+
+void main() {
+  group('isScreenshotSupported', () {
+    SentryFlutterOptions _buildOptions({
+      required bool isWeb,
+      FlutterRenderer? renderer,
+    }) {
+      final options = defaultTestOptions();
+      options.platform = MockPlatform(isWeb: isWeb);
+      options.rendererWrapper = MockRendererWrapper(renderer);
+      return options;
+    }
+
+    test('returns true for non-web platforms', () {
+      final options = _buildOptions(isWeb: false);
+      expect(options.isScreenshotSupported, isTrue);
+    });
+
+    test('returns true for web canvasKit renderer', () {
+      final options = _buildOptions(
+        isWeb: true,
+        renderer: FlutterRenderer.canvasKit,
+      );
+      expect(options.isScreenshotSupported, isTrue);
+    });
+
+    test('returns true for web skwasm renderer', () {
+      final options = _buildOptions(
+        isWeb: true,
+        renderer: FlutterRenderer.skwasm,
+      );
+      expect(options.isScreenshotSupported, isTrue);
+    });
+
+    test('returns false for web html renderer', () {
+      final options = _buildOptions(
+        isWeb: true,
+        renderer: FlutterRenderer.html,
+      );
+      expect(options.isScreenshotSupported, isFalse);
+    });
+
+    test('returns false for web unknown renderer', () {
+      final options = _buildOptions(
+        isWeb: true,
+        renderer: FlutterRenderer.unknown,
+      );
+      expect(options.isScreenshotSupported, isFalse);
+    });
+  });
+}

flutter/test/sentry_flutter_test.dart

@@ -564,12 +564,12 @@ void main() {
       await Sentry.close();
     }, testOn: 'vm');
 
-    test('installed with canvasKit renderer', () async {
+    test('installed on web with canvasKit renderer', () async {
       List<Integration> integrations = [];
 
       final sentryFlutterOptions =
           defaultTestOptions(checker: MockRuntimeChecker())
-            ..platform = MockPlatform.iOS()
+            ..platform = MockPlatform.iOS(isWeb: true)
             ..rendererWrapper = MockRendererWrapper(FlutterRenderer.canvasKit)
             ..release = ''
             ..dist = '';
@@ -591,6 +591,33 @@ void main() {
       await Sentry.close();
     }, testOn: 'browser');
 
+    test('installed on web with skwasm renderer', () async {
+      List<Integration> integrations = [];
+
+      final sentryFlutterOptions =
+          defaultTestOptions(checker: MockRuntimeChecker())
+            ..platform = MockPlatform.iOS(isWeb: true)
+            ..rendererWrapper = MockRendererWrapper(FlutterRenderer.skwasm)
+            ..release = ''
+            ..dist = '';
+
+      await SentryFlutter.init(
+        (options) async {
+          integrations = options.integrations;
+        },
+        appRunner: appRunner,
+        options: sentryFlutterOptions,
+      );
+
+      expect(
+          integrations
+              .map((e) => e.runtimeType)
+              .contains(ScreenshotIntegration),
+          true);
+
+      await Sentry.close();
+    }, testOn: 'browser');
+
     test('not installed with html renderer', () async {
       List<Integration> integrations = [];