[web] Build multiple CanvasKit variants (using toolchain_args) (#38448)

* [web] New gn for building CanvasKit

* Use toolchain_args to override CanvasKit gn args

* Use correct path for the generated canvaskit files

* Put toolchain close to target

* remove extra toolchains

* remove extra import

* add canvaskit_lite to archive

* fix local canvaskit path in tests

* add some guards using visibility and asserts

* renames

* formatting

* rename mistake

* Add github issue to the TODO

* Update buildroot sha

* clang-tidy error

* skip canvaskit targets when not needed

Author: mdebbar

DEPS

@@ -236,7 +236,7 @@ allowed_hosts = [
 ]
 
 deps = {
-  'src': 'https://github.com/flutter/buildroot.git' + '@' + 'b2ab6e1908b3eb268d2a2cab1ec5b63f38e1bc11',
+  'src': 'https://github.com/flutter/buildroot.git' + '@' + '5ca962cdf56fa8e7313a37237d9f1d7e7466b93b',
 
    # Fuchsia compatibility
    #

lib/web_ui/dev/steps/compile_tests_step.dart

@@ -144,6 +144,7 @@ Future<void> copyCanvasKitFiles({bool useLocalCanvasKit = false}) async {
   // If CanvasKit has been built locally, use that instead of the CIPD version.
   final io.File localCanvasKitWasm = io.File(pathlib.join(
     environment.wasmReleaseOutDir.path,
+    'canvaskit',
     'canvaskit.wasm',
   ));
   final bool builtLocalCanvasKit = localCanvasKitWasm.existsSync();
@@ -163,6 +164,7 @@ Future<void> copyCanvasKitFiles({bool useLocalCanvasKit = false}) async {
       localCanvasKitWasm,
       io.File(pathlib.join(
         environment.wasmReleaseOutDir.path,
+        'canvaskit',
         'canvaskit.js',
       )),
     ];

third_party/canvaskit/BUILD.gn

@@ -0,0 +1,37 @@
+# Copyright 2013 The Flutter Authors. All rights reserved.
+# Use of this source code is governed by a BSD-style license that can be
+# found in the LICENSE file.
+
+import("//build/toolchain/wasm.gni")
+import("canvaskit.gni")
+
+if (build_canvaskit) {
+  # This toolchain is only to be used by canvaskit_group below.
+  wasm_toolchain("canvaskit") {
+    extra_toolchain_args = {
+      skia_use_icu = true
+      skia_use_client_icu = false
+    }
+  }
+
+  group("canvaskit_group") {
+    visibility = [ "//flutter/web_sdk:*" ]
+    public_deps = [ "//third_party/skia/modules/canvaskit(:canvaskit)" ]
+  }
+}
+
+if (build_canvaskit_chromium) {
+  # This toolchain is only to be used by canvaskit_chromium_group below.
+  wasm_toolchain("canvaskit_chromium") {
+    extra_toolchain_args = {
+      skia_use_icu = false
+      skia_use_client_icu = true
+    }
+  }
+
+  group("canvaskit_chromium_group") {
+    visibility = [ "//flutter/web_sdk:*" ]
+    public_deps =
+        [ "//third_party/skia/modules/canvaskit(:canvaskit_chromium)" ]
+  }
+}

third_party/canvaskit/canvaskit.gni

@@ -0,0 +1,8 @@
+# Copyright 2013 The Flutter Authors. All rights reserved.
+# Use of this source code is governed by a BSD-style license that can be
+# found in the LICENSE file.
+
+declare_args() {
+  build_canvaskit = false
+  build_canvaskit_chromium = false
+}

tools/gn

@@ -620,7 +620,6 @@ def to_gn_wasm_args(args, gn_args):
   gn_args['skia_gl_standard'] = 'webgl'
   gn_args['skia_enable_gpu'] = True
   gn_args['skia_enable_sksl_tracing'] = False
-  gn_args['skia_use_icu'] = True
   gn_args['icu_use_data_file'] = False
   gn_args['skia_use_freetype'] = True
   gn_args['skia_use_harfbuzz'] = True
@@ -659,6 +658,9 @@ def to_gn_wasm_args(args, gn_args):
   # than forced to true, once the recipes are updated.
   # https://github.com/flutter/flutter/issues/113303
   gn_args['build_canvaskit'] = True
+  # TODO(mdebbar): Read this from an input argument.
+  # https://github.com/flutter/flutter/issues/118744
+  gn_args['build_canvaskit_chromium'] = False
   gn_args['flutter_build_web_sdk'] = True
 
 

web_sdk/BUILD.gn

@@ -4,10 +4,10 @@
 
 import("//flutter/build/zip_bundle.gni")
 import("//flutter/common/config.gni")
+import("//flutter/third_party/canvaskit/canvaskit.gni")
 import("//third_party/dart/build/dart/dart_action.gni")
 
 declare_args() {
-  build_canvaskit = false
   archive_flutter_web_sdk = true
 }
 
@@ -561,7 +561,10 @@ if (!is_fuchsia) {
            ] + web_engine_libraries
 
     if (build_canvaskit) {
-      deps += [ "//third_party/skia/modules/canvaskit" ]
+      deps += [ "//flutter/third_party/canvaskit:canvaskit_group" ]
+    }
+    if (build_canvaskit_chromium) {
+      deps += [ "//flutter/third_party/canvaskit:canvaskit_chromium_group" ]
     }
 
     # flutter_ddc_modules
@@ -604,15 +607,28 @@ if (!is_fuchsia) {
     if (build_canvaskit) {
       tmp_files += [
         {
-          source = rebase_path("$root_out_dir/canvaskit.js")
+          source = rebase_path("$root_out_dir/canvaskit/canvaskit.js")
           destination = "flutter_web_sdk/canvaskit/canvaskit.js"
         },
         {
-          source = rebase_path("$root_out_dir/canvaskit.wasm")
+          source = rebase_path("$root_out_dir/canvaskit/canvaskit.wasm")
           destination = "flutter_web_sdk/canvaskit/canvaskit.wasm"
         },
       ]
     }
+    if (build_canvaskit_chromium) {
+      tmp_files += [
+        {
+          source = rebase_path("$root_out_dir/canvaskit_chromium/canvaskit.js")
+          destination = "flutter_web_sdk/canvaskit_chromium/canvaskit.js"
+        },
+        {
+          source =
+              rebase_path("$root_out_dir/canvaskit_chromium/canvaskit.wasm")
+          destination = "flutter_web_sdk/canvaskit_chromium/canvaskit.wasm"
+        },
+      ]
+    }
     files = tmp_files
   }
 }