Add WASM target in gn

BUILD.gn

@@ -45,14 +45,6 @@ if (flutter_prebuilt_dart_sdk) {
   }
 }
 
-# Flutter SDK artifacts should only be built when either doing host builds, or
-# for cross-compiled desktop targets.
-# TODO: We can't build the engine artifacts for arm (32-bit) right now;
-# see https://github.com/flutter/flutter/issues/74322
-_build_engine_artifacts =
-    current_toolchain == host_toolchain ||
-    (is_linux && !is_chromeos && current_cpu != "arm") || is_mac
-
 group("dart_sdk") {
   if (build_engine_artifacts) {
     if (flutter_prebuilt_dart_sdk) {
@@ -66,69 +58,82 @@ group("dart_sdk") {
 group("flutter") {
   testonly = true
 
-  # Compile the engine.
-  public_deps = [
-    ":unittests",
-    "//flutter/shell/platform/embedder:flutter_engine",
-    "//flutter/sky",
-  ]
-
-  # Ensure the example for a sample embedder compiles.
-  if (build_embedder_examples) {
-    public_deps += [
-      "//flutter/examples/glfw",
-      "//flutter/examples/vulkan_glfw",
+  # If building for WASM, only build CanvasKit.
+  if (is_wasm) {
+    deps = [ "//third_party/skia/modules/canvaskit:canvaskit" ]
+  } else {
+    # Flutter SDK artifacts should only be built when either doing host builds, or
+    # for cross-compiled desktop targets.
+    # TODO: We can't build the engine artifacts for arm (32-bit) right now;
+    # see https://github.com/flutter/flutter/issues/74322
+    _build_engine_artifacts =
+        current_toolchain == host_toolchain ||
+        (is_linux && !is_chromeos && current_cpu != "arm") || is_mac
+
+    # Compile the engine.
+    public_deps = [
+      ":unittests",
+      "//flutter/shell/platform/embedder:flutter_engine",
+      "//flutter/sky",
     ]
-  }
 
-  # If enbaled, compile the SDK / snapshot.
-  if (!is_fuchsia) {
-    public_deps += [ "//flutter/lib/snapshot:generate_snapshot_bins" ]
-
-    if (_build_engine_artifacts) {
+    # Ensure the example for a sample embedder compiles.
+    if (build_embedder_examples) {
       public_deps += [
-        ":dart_sdk",
-        "//flutter/flutter_frontend_server:frontend_server",
-
-        # This must be listed explicitly for desktop cross-builds since
-        # //flutter/lib/snapshot:generate_snapshot_bin will only build
-        # gen_snapshot for the host and not the target.
-        "//third_party/dart/runtime/bin:gen_snapshot",
+        "//flutter/examples/glfw",
+        "//flutter/examples/vulkan_glfw",
       ]
+    }
 
-      if (full_dart_sdk) {
-        public_deps += [ "//flutter/web_sdk" ]
+    # If enbaled, compile the SDK / snapshot.
+    if (!is_fuchsia) {
+      public_deps += [ "//flutter/lib/snapshot:generate_snapshot_bins" ]
+
+      if (_build_engine_artifacts) {
+        public_deps += [
+          ":dart_sdk",
+          "//flutter/flutter_frontend_server:frontend_server",
+
+          # This must be listed explicitly for desktop cross-builds since
+          # //flutter/lib/snapshot:generate_snapshot_bin will only build
+          # gen_snapshot for the host and not the target.
+          "//third_party/dart/runtime/bin:gen_snapshot",
+        ]
+
+        if (full_dart_sdk) {
+          public_deps += [ "//flutter/web_sdk" ]
+        }
       }
     }
-  }
 
-  if (_build_engine_artifacts) {
-    public_deps += [
-      "//flutter/shell/testing",
-      "//flutter/tools/const_finder",
-      "//flutter/tools/font-subset",
-    ]
-  }
+    if (_build_engine_artifacts) {
+      public_deps += [
+        "//flutter/shell/testing",
+        "//flutter/tools/const_finder",
+        "//flutter/tools/font-subset",
+      ]
+    }
 
-  # Compile all benchmark targets if enabled.
-  if (enable_unittests && !is_win) {
-    public_deps += [
-      "//flutter/display_list:display_list_benchmarks",
-      "//flutter/fml:fml_benchmarks",
-      "//flutter/lib/ui:ui_benchmarks",
-      "//flutter/shell/common:shell_benchmarks",
-      "//flutter/third_party/txt:txt_benchmarks",
-    ]
-  }
+    # Compile all benchmark targets if enabled.
+    if (enable_unittests && !is_win) {
+      public_deps += [
+        "//flutter/display_list:display_list_benchmarks",
+        "//flutter/fml:fml_benchmarks",
+        "//flutter/lib/ui:ui_benchmarks",
+        "//flutter/shell/common:shell_benchmarks",
+        "//flutter/third_party/txt:txt_benchmarks",
+      ]
+    }
 
-  if ((flutter_runtime_mode == "debug" || flutter_runtime_mode == "profile") &&
-      (is_ios || is_android)) {
-    public_deps += [ "//flutter/testing/scenario_app" ]
-  }
+    if ((flutter_runtime_mode == "debug" ||
+         flutter_runtime_mode == "profile") && (is_ios || is_android)) {
+      public_deps += [ "//flutter/testing/scenario_app" ]
+    }
 
-  if (is_android && flutter_runtime_mode == "profile" &&
-      current_cpu == "arm64") {
-    public_deps += [ "//flutter/testing/android_background_image" ]
+    if (is_android && flutter_runtime_mode == "profile" &&
+        current_cpu == "arm64") {
+      public_deps += [ "//flutter/testing/android_background_image" ]
+    }
   }
 }
 

DEPS

@@ -33,6 +33,12 @@ vars = {
   # See `lib/web_ui/README.md` for how to roll CanvasKit to a new version.
   'canvaskit_cipd_instance': '8MSYGWVWzrTJIoVL00ZquruZs-weuwLBy1kt1AawJiIC',
 
+  # Do not activate the Emscripten SDK by default.
+  # This prevents us from downloading the Emscripten toolchain for builds
+  # which do not build for the web. This toolchain is needed to build CanvasKit
+  # for the web engine.
+  'activate_emsdk': False,
+
   # When updating the Dart revision, ensure that all entries that are
   # dependencies of Dart are also updated to match the entries in the
   # Dart SDK's DEPS file for that revision of Dart. The DEPS file for
@@ -155,7 +161,7 @@ deps = {
    # Chromium-style dependencies.
 
   'src/third_party/icu':
-   Var('chromium_git') + '/chromium/deps/icu.git' + '@' + '2e0f2989441ec2f55abec30f48e89981dbac2c34',
+   Var('chromium_git') + '/chromium/deps/icu.git' + '@' + '1fa4e3959ec6637182b7318ac1d382799454806d',
 
   'src/third_party/khronos':
    Var('chromium_git') + '/chromium/src/third_party/khronos.git' + '@' + '7122230e90547962e0f0c627f62eeed3c701f275',
@@ -368,6 +374,9 @@ deps = {
   'src/third_party/colorama/src':
    Var('chromium_git') + '/external/colorama.git' + '@' + '799604a1041e9b3bc5d2789ecbd7e8db2e18e6b8',
 
+   'src/third_party/emsdk':
+   Var('skia_git') + '/external/github.com/emscripten-core/emsdk.git' + '@' + 'fc645b7626ebf86530dbd82fbece74d457e7ae07',
+
   'src/third_party/expat':
    Var('chromium_git') + '/external/github.com/libexpat/libexpat.git' + '@' + 'a28238bdeebc087071777001245df1876a11f5ee',
 
@@ -739,6 +748,15 @@ hooks = [
       Var('fuchsia_sdk_path'),
     ]
   },
+  {
+    'name': 'Activate Emscripten SDK',
+    'pattern': '.',
+    'condition': 'activate_emsdk',
+    'action': [
+      'python3',
+      'src/flutter/tools/activate_emsdk.py',
+    ]
+  },
   {
     'name': 'Setup githooks',
     'pattern': '.',

lib/web_ui/dev/build.dart

@@ -16,12 +16,18 @@ import 'utils.dart';
 class BuildCommand extends Command<bool> with ArgUtils<bool> {
   BuildCommand() {
     argParser.addFlag(
-        'watch',
-        defaultsTo: false,
-        abbr: 'w',
-        help: 'Run the build in watch mode so it rebuilds whenever a change'
-            'is made. Disabled by default.',
-      );
+      'watch',
+      defaultsTo: false,
+      abbr: 'w',
+      help: 'Run the build in watch mode so it rebuilds whenever a change is '
+          'made. Disabled by default.',
+    );
+    argParser.addFlag(
+      'build-canvaskit',
+      defaultsTo: false,
+      help: 'Build CanvasKit locally instead of getting it from CIPD. Disabled '
+          'by default.',
+    );
   }
 
   @override
@@ -32,12 +38,14 @@ class BuildCommand extends Command<bool> with ArgUtils<bool> {
 
   bool get isWatchMode => boolArg('watch');
 
+  bool get buildCanvasKit => boolArg('build-canvaskit');
+
   @override
   FutureOr<bool> run() async {
     final FilePath libPath = FilePath.fromWebUi('lib');
     final Pipeline buildPipeline = Pipeline(steps: <PipelineStep>[
-      GnPipelineStep(),
-      NinjaPipelineStep(),
+      GnPipelineStep(buildCanvasKit),
+      NinjaPipelineStep(buildCanvasKit),
     ]);
     await buildPipeline.run();
 
@@ -60,45 +68,78 @@ class BuildCommand extends Command<bool> with ArgUtils<bool> {
 /// Not safe to interrupt as it may leave the `out/` directory in a corrupted
 /// state. GN is pretty quick though, so it's OK to not support interruption.
 class GnPipelineStep extends ProcessStep {
+  GnPipelineStep(this.buildCanvasKit);
+
   @override
   String get description => 'gn';
 
   @override
   bool get isSafeToInterrupt => false;
 
+  /// Whether or not to build CanvasKit.
+  final bool buildCanvasKit;
+
   @override
   Future<ProcessManager> createProcess() {
     print('Running gn...');
-    return startProcess(
+    Future<ProcessManager> gnProcess = startProcess(
       path.join(environment.flutterDirectory.path, 'tools', 'gn'),
       <String>[
         '--unopt',
         if (Platform.isMacOS) '--xcode-symlinks',
         '--full-dart-sdk',
       ],
     );
+    if (buildCanvasKit) {
+      gnProcess = gnProcess.then((_) {
+        return startProcess(
+          path.join(environment.flutterDirectory.path, 'tools', 'gn'),
+          <String>[
+            '--wasm',
+          ],
+        );
+      });
+    }
+    return gnProcess;
   }
 }
 
 /// Runs `autoninja`.
 ///
 /// Can be safely interrupted.
 class NinjaPipelineStep extends ProcessStep {
+  NinjaPipelineStep(this.buildCanvasKit);
+
   @override
   String get description => 'ninja';
 
   @override
   bool get isSafeToInterrupt => true;
 
+  /// Whether or not to build CanvasKit.
+  final bool buildCanvasKit;
+
   @override
   Future<ProcessManager> createProcess() {
     print('Running autoninja...');
-    return startProcess(
+    Future<ProcessManager> ninjaProcess = startProcess(
       'autoninja',
       <String>[
         '-C',
         environment.hostDebugUnoptDir.path,
       ],
     );
+    if (buildCanvasKit) {
+      ninjaProcess = ninjaProcess.then((_) {
+        return startProcess(
+          'autoninja',
+          <String>[
+            '-C',
+            environment.canvasKitOutDir.path,
+          ],
+        );
+      });
+    }
+    return ninjaProcess;
   }
 }

lib/web_ui/dev/environment.dart

@@ -25,6 +25,8 @@ class Environment {
         io.Directory(pathlib.join(engineSrcDir.path, 'out'));
     final io.Directory hostDebugUnoptDir =
         io.Directory(pathlib.join(outDir.path, 'host_debug_unopt'));
+    final io.Directory canvasKitOutDir =
+        io.Directory(pathlib.join(outDir.path, 'wasm_debug'));
     final io.Directory dartSdkDir =
         io.Directory(pathlib.join(hostDebugUnoptDir.path, 'dart-sdk'));
     final io.Directory webUiRootDir = io.Directory(
@@ -49,6 +51,7 @@ class Environment {
       engineToolsDir: engineToolsDir,
       outDir: outDir,
       hostDebugUnoptDir: hostDebugUnoptDir,
+      canvasKitOutDir: canvasKitOutDir,
       dartSdkDir: dartSdkDir,
     );
   }
@@ -60,6 +63,7 @@ class Environment {
     required this.engineToolsDir,
     required this.outDir,
     required this.hostDebugUnoptDir,
+    required this.canvasKitOutDir,
     required this.dartSdkDir,
   });
 
@@ -83,6 +87,9 @@ class Environment {
   /// The "host_debug_unopt" build of the Dart SDK.
   final io.Directory hostDebugUnoptDir;
 
+  /// The output directory for the build of CanvasKit.
+  final io.Directory canvasKitOutDir;
+
   /// The root of the Dart SDK.
   final io.Directory dartSdkDir;