Enable probes. (#3268)

polina-c · web-flow · commit ed5c28b97b8d · 2025-04-24T15:02:07.000-07:00
diff --git a/.github/workflows/dartpad_ui.yml b/.github/workflows/dartpad_ui.yml
@@ -36,5 +36,5 @@ jobs:
       - run: flutter analyze
       - run: dart format --set-exit-if-changed .
       - run: flutter build web
-      - run: flutter test
+      - run: flutter test test/presubmit
       - run: sh ./tool/check_cycles.sh
diff --git a/.github/workflows/dartpad_ui_probes.yml b/.github/workflows/dartpad_ui_probes.yml
@@ -0,0 +1,26 @@
+name: package:dartpad_ui
+
+permissions: read-all
+
+on:
+  schedule:
+    - cron: '0 0 * * *' # daily
+
+jobs:
+  validate:
+    runs-on: ubuntu-latest
+    defaults:
+      run:
+        working-directory: pkgs/dartpad_ui/
+    strategy:
+      fail-fast: false
+      matrix:
+        sdk: [ beta, main ]
+    steps:
+      - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683
+      - uses: subosito/flutter-action@e938fdf56512cc96ef2f93601a5a40bde3801046
+        with:
+          channel: ${{ matrix.sdk }}
+      - run: flutter --version
+      - run: flutter pub get
+      - run: flutter test test/probes
diff --git a/.vscode/launch.json b/.vscode/launch.json
@@ -51,6 +51,11 @@
                 "--web-launch-url",
                 "http://localhost:8888/?genui=true&channel=localhost",
             ],
-        }
+        },
+        {
+            "name": "current test file",
+            "request": "launch",
+            "type": "dart",
+        },
     ],
 }
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -45,6 +45,11 @@ To run the server, see the [dart_services readme](pkgs/dart_services/README.md).
 
 To run the front-end, see the [dartpad_ui readme](pkgs/dartpad_ui/README.md).
 
+## Update goldens
+
+When your change requires update to [golden images](https://api.flutter.dev/flutter/flutter_test/matchesGoldenFile.html), run the tests
+with flag `--update-goldens`.
+
 ## Other
 
 See internal details at go/dartpad-manual.
diff --git a/pkgs/dartpad_ui/lib/main.dart b/pkgs/dartpad_ui/lib/main.dart
@@ -33,7 +33,9 @@ import 'utils.dart';
 import 'versions.dart';
 
 const appName = 'DartPad';
-const smallScreenWidth = 840;
+
+// Smallest screen width when the screen is considered to be a large screen.
+const minLargeScreenWidth = 866.0;
 
 void main() async {
   usePathUrlStrategy();
@@ -227,16 +229,18 @@ class DartPadMainPage extends StatefulWidget {
        );
 
   @override
-  State<DartPadMainPage> createState() => _DartPadMainPageState();
+  State<DartPadMainPage> createState() => DartPadMainPageState();
 }
 
-class _DartPadMainPageState extends State<DartPadMainPage>
+@visibleForTesting
+class DartPadMainPageState extends State<DartPadMainPage>
     with SingleTickerProviderStateMixin {
   late final AppModel appModel;
   late final AppServices appServices;
   late final SplitViewController mainSplitter;
   late final SplitViewController consoleSplitter;
   late final TabController tabController;
+  final initialized = Completer<void>();
 
   final GlobalKey _executionWidgetKey = GlobalKey(
     debugLabel: 'execution-widget',
@@ -253,7 +257,10 @@ class _DartPadMainPageState extends State<DartPadMainPage>
   @override
   void initState() {
     super.initState();
+    _initialize();
+  }
 
+  Future<void> _initialize() async {
     tabController = TabController(length: 2, vsync: this)..addListener(() {
       // Rebuild when the user changes tabs so that the IndexedStack updates
       // its active child view.
@@ -282,26 +289,6 @@ class _DartPadMainPageState extends State<DartPadMainPage>
     appModel = AppModel();
     appServices = AppServices(appModel, channel ?? Channel.defaultChannel);
 
-    appServices.populateVersions();
-    appServices
-        .performInitialLoad(
-          gistId: widget.gistId,
-          sampleId: widget.builtinSampleId,
-          flutterSampleId: widget.flutterSampleId,
-          channel: widget.initialChannel,
-          keybinding: DartPadLocalStorage.instance.getUserKeybinding(),
-          getFallback:
-              () =>
-                  DartPadLocalStorage.instance.getUserCode() ??
-                  Samples.defaultSnippet(),
-        )
-        .then((value) {
-          // Start listening for inject code messages.
-          handleEmbedMessage(appServices, runOnInject: widget.runOnLoad);
-          if (widget.runOnLoad) {
-            appServices.performCompileAndRun();
-          }
-        });
     appModel.compilingState.addListener(_handleRunStarted);
 
     tabController.addListener(() {
@@ -312,6 +299,31 @@ class _DartPadMainPageState extends State<DartPadMainPage>
       }
     });
 
+    await Future.wait([
+      appServices.populateVersions(),
+      appServices
+          .performInitialLoad(
+            gistId: widget.gistId,
+            sampleId: widget.builtinSampleId,
+            flutterSampleId: widget.flutterSampleId,
+            channel: widget.initialChannel,
+            keybinding: DartPadLocalStorage.instance.getUserKeybinding(),
+            getFallback:
+                () =>
+                    DartPadLocalStorage.instance.getUserCode() ??
+                    Samples.defaultSnippet(),
+          )
+          .then((value) {
+            // Start listening for inject code messages.
+            handleEmbedMessage(appServices, runOnInject: widget.runOnLoad);
+            if (widget.runOnLoad) {
+              appServices.performCompileAndRun();
+            }
+          }),
+    ]);
+
+    initialized.complete();
+
     debugPrint('initialized: useGenui = $useGenUI, channel = $channel.');
   }
 
@@ -402,7 +414,7 @@ class _DartPadMainPageState extends State<DartPadMainPage>
     final scaffold = LayoutBuilder(
       builder: (context, constraints) {
         // Use the mobile UI layout for small screen widths.
-        if (constraints.maxWidth <= smallScreenWidth) {
+        if (constraints.maxWidth < minLargeScreenWidth) {
           return Scaffold(
             key: _scaffoldKey,
             appBar:
@@ -593,7 +605,7 @@ class DartPadAppBar extends StatelessWidget implements PreferredSizeWidget {
   Widget build(BuildContext context) {
     return LayoutBuilder(
       builder: (context, constraints) {
-        final wideLayout = constraints.maxWidth > smallScreenWidth;
+        final wideLayout = constraints.maxWidth >= minLargeScreenWidth;
 
         return AppBar(
           backgroundColor: theme.colorScheme.surface,
@@ -653,7 +665,7 @@ class DartPadAppBar extends StatelessWidget implements PreferredSizeWidget {
           bottom: bottom,
           actions: [
             // Hide the Install SDK button when the screen width is too small.
-            if (constraints.maxWidth > smallScreenWidth)
+            if (constraints.maxWidth >= minLargeScreenWidth)
               ContinueInMenu(openInFirebaseStudio: _openInFirebaseStudio),
             const SizedBox(width: denseSpacing),
             _BrightnessButton(
diff --git a/pkgs/dartpad_ui/pubspec.yaml b/pkgs/dartpad_ui/pubspec.yaml
@@ -34,6 +34,8 @@ dependencies:
   web: ^1.1.0
 
 dev_dependencies:
+  integration_test:
+    sdk: flutter
   flutter_test:
     sdk: flutter
   flutter_lints: ^5.0.0
diff --git a/pkgs/dartpad_ui/test/flutter_test_config.dart b/pkgs/dartpad_ui/test/flutter_test_config.dart
@@ -0,0 +1,48 @@
+// Copyright (c) 2025, the Dart project authors. Please see the AUTHORS file
+// for details. All rights reserved. Use of this source code is governed by a
+// BSD-style license that can be found in the LICENSE file.
+
+import 'dart:async';
+
+import 'package:flutter/foundation.dart';
+import 'package:flutter_test/flutter_test.dart';
+
+/// Test configuration for each test library in this directory.
+///
+/// See https://api.flutter.dev/flutter/flutter_test/flutter_test-library.html.
+Future<void> testExecutable(FutureOr<void> Function() testMain) async {
+  // Set golden file comparator to use a custom tolerance.
+  goldenFileComparator = _GoldenDiffComparator();
+
+  await testMain();
+}
+
+/// Customization of tolerance for golden file comparison.
+///
+/// See https://github.com/flutter/flutter/pull/77014#issuecomment-1048896776
+class _GoldenDiffComparator extends LocalFileComparator {
+  _GoldenDiffComparator() : super(Uri.parse('.'));
+
+  static const _tolerance = 0.015; // 1.5% of difference is ok.
+
+  @override
+  Future<bool> compare(Uint8List imageBytes, Uri golden) async {
+    final ComparisonResult result = await GoldenFileComparator.compareLists(
+      imageBytes,
+      await getGoldenBytes(golden),
+    );
+
+    if (!result.passed && result.diffPercent > _tolerance) {
+      final String error = await generateFailureOutput(result, golden, basedir);
+      throw FlutterError(error);
+    }
+    if (!result.passed) {
+      debugPrint(
+        'A tolerable difference of ${result.diffPercent * 100}% was found when '
+        'comparing $golden, that is acceptable as it is '
+        'less than the tolerance of ${_tolerance * 100}%.',
+      );
+    }
+    return result.passed || result.diffPercent <= _tolerance;
+  }
+}
diff --git a/pkgs/dartpad_ui/test/presubmit/README.md b/pkgs/dartpad_ui/test/presubmit/README.md
@@ -0,0 +1 @@
+This folder contains presubmit tests.
diff --git a/pkgs/dartpad_ui/test/presubmit/autosave_test.dart b/pkgs/dartpad_ui/test/presubmit/autosave_test.dart
diff --git a/pkgs/dartpad_ui/test/presubmit/gists_test.dart b/pkgs/dartpad_ui/test/presubmit/gists_test.dart
diff --git a/pkgs/dartpad_ui/test/presubmit/model_test.dart b/pkgs/dartpad_ui/test/presubmit/model_test.dart
diff --git a/pkgs/dartpad_ui/test/presubmit/samples_test.dart b/pkgs/dartpad_ui/test/presubmit/samples_test.dart
diff --git a/pkgs/dartpad_ui/test/probes/README.md b/pkgs/dartpad_ui/test/probes/README.md
@@ -0,0 +1 @@
+This folder contains tests against prod backend, that run on schedule.
diff --git a/pkgs/dartpad_ui/test/probes/failing_test.dart b/pkgs/dartpad_ui/test/probes/failing_test.dart
@@ -0,0 +1,15 @@
+// Copyright (c) 2025, the Dart project authors. Please see the AUTHORS file
+// for details. All rights reserved. Use of this source code is governed by a
+// BSD-style license that can be found in the LICENSE file.
+
+import 'package:flutter_test/flutter_test.dart';
+
+// TODO(polina-ch): Remove this test when we have alerting setup.
+void main() {
+  testWidgets(
+    'This test is designed to fail to ensure we have alerting setup.',
+    (WidgetTester tester) async {
+      expect(false, true);
+    },
+  );
+}
diff --git a/pkgs/dartpad_ui/test/probes/main_test.dart b/pkgs/dartpad_ui/test/probes/main_test.dart
@@ -0,0 +1,28 @@
+// Copyright (c) 2025, the Dart project authors. Please see the AUTHORS file
+// for details. All rights reserved. Use of this source code is governed by a
+// BSD-style license that can be found in the LICENSE file.
+
+import 'package:dartpad_ui/genai_editing.dart';
+import 'package:dartpad_ui/main.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+
+import '../test_infra/test_utils.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  testWidgets('Initial screen.', (WidgetTester tester) async {
+    await setMinLargeScreenWidth(tester);
+
+    await tester.pumpWidget(const DartPadApp());
+
+    final DartPadMainPageState state = tester.state(
+      find.byType(DartPadMainPage),
+    );
+
+    await state.initialized.future;
+    await tester.pumpAndSettle();
+    await expectLater(find.byType(EditorWithButtons), findsOneWidget);
+  });
+}
diff --git a/pkgs/dartpad_ui/test/test_infra/test_utils.dart b/pkgs/dartpad_ui/test/test_infra/test_utils.dart
@@ -0,0 +1,26 @@
+// Copyright (c) 2025, the Dart project authors. Please see the AUTHORS file
+// for details. All rights reserved. Use of this source code is governed by a
+// BSD-style license that can be found in the LICENSE file.
+
+import 'dart:ui';
+
+import 'package:dartpad_ui/main.dart';
+import 'package:flutter_test/flutter_test.dart';
+
+const goldenPath = 'test/test_infra/goldens';
+
+/// Sets the window size to be smallest possible for a large screen.
+///
+/// Needed to test there is no overflow on almost small screens.
+Future<void> setMinLargeScreenWidth(WidgetTester tester) async {
+  // We need to add some width to avoid overflow
+  // in tests, while overflow is not happening in real app on web and on mac.
+  const screenWidthDelta = 350;
+  await tester.binding.setSurfaceSize(
+    const Size(
+      minLargeScreenWidth + screenWidthDelta,
+      minLargeScreenWidth * 0.7,
+    ),
+  );
+  addTearDown(() => tester.binding.setSurfaceSize(null));
+}
