diff --git a/ash/webui/BUILD.gn b/ash/webui/BUILD.gn index 5998f17a4d174e..70f331d315ae57 100644 --- a/ash/webui/BUILD.gn +++ b/ash/webui/BUILD.gn @@ -75,9 +75,6 @@ group("closure_compile") { ] if (!is_official_build) { - deps += [ - "//ash/webui/demo_mode_app_ui:closure_compile", - "//ash/webui/sample_system_web_app_ui:closure_compile", - ] + deps += [ "//ash/webui/demo_mode_app_ui:closure_compile" ] } } diff --git a/ash/webui/resources/BUILD.gn b/ash/webui/resources/BUILD.gn index 427f9cc608f81a..8987a7ec191369 100644 --- a/ash/webui/resources/BUILD.gn +++ b/ash/webui/resources/BUILD.gn @@ -90,14 +90,17 @@ if (!is_official_build) { # Resources used by chrome://sample-system-web-app ash_generated_grit("sample_system_web_app_resources") { - source = "$root_gen_dir/ash/webui/sample_system_web_app_ui/ash_sample_system_web_app_resources.grd" - deps = [ "//ash/webui/sample_system_web_app_ui:build_trusted_grd" ] + source = "$root_gen_dir/ash/webui/sample_system_web_app_ui/resources/trusted/ash_sample_system_web_app_resources.grd" + deps = + [ "//ash/webui/sample_system_web_app_ui/resources/trusted:trusted_grd" ] } # Resources used by chrome-untrusted://sample-system-web-app ash_generated_grit("sample_system_web_app_untrusted_resources") { - source = "$root_gen_dir/ash/webui/sample_system_web_app_ui/ash_sample_system_web_app_untrusted_resources.grd" - deps = [ "//ash/webui/sample_system_web_app_ui:build_untrusted_grd" ] + source = "$root_gen_dir/ash/webui/sample_system_web_app_ui/resources/untrusted/ash_sample_system_web_app_untrusted_resources.grd" + deps = [ + "//ash/webui/sample_system_web_app_ui/resources/untrusted:untrusted_grd", + ] } } diff --git a/ash/webui/sample_system_web_app_ui/BUILD.gn b/ash/webui/sample_system_web_app_ui/BUILD.gn index c61d5d087620f8..f12d252f128997 100644 --- a/ash/webui/sample_system_web_app_ui/BUILD.gn +++ b/ash/webui/sample_system_web_app_ui/BUILD.gn @@ -33,23 +33,6 @@ static_library("sample_system_web_app_ui") { ] } -js_type_check("closure_compile") { - deps = [ - ":trusted", - ":untrusted", - ] - closure_flags = default_closure_args + mojom_js_args -} - -js_library("untrusted") { - sources = [ "resources/untrusted.js" ] -} - -js_library("trusted") { - sources = [ "resources/page_handler.js" ] - deps = [ "//ash/webui/sample_system_web_app_ui/mojom:trusted_webui_js" ] -} - js2gtest("browser_tests_js") { test_type = "mojo_lite_webui" @@ -57,104 +40,3 @@ js2gtest("browser_tests_js") { defines = [ "HAS_OUT_OF_PROC_TEST_RUNNER" ] } - -# Rules to generate grdp files for the generated mojo bindings. -grd_prefix = "ash_sample_system_web_app" - -trusted_mojo_grdp = - "$target_gen_dir/sample_system_web_app_trusted_mojo_resources.grdp" -generate_grd("build_trusted_mojo_grdp") { - out_grd = trusted_mojo_grdp - grd_prefix = grd_prefix - - deps = [ "//ash/webui/sample_system_web_app_ui/mojom:trusted_webui_js" ] - - # Flatten out the dependency tree of your mojom and add generated bindings - # file here. - input_files = [ "ash/webui/sample_system_web_app_ui/mojom/sample_system_web_app_ui.mojom-webui.js" ] - - input_files_base_dir = - rebase_path("$root_gen_dir/mojom-webui", "$root_build_dir") -} - -shared_mojo_grdp = - "$target_gen_dir/sample_system_web_app_shared_mojo_resources.grdp" -generate_grd("build_shared_mojo_grdp") { - grd_prefix = grd_prefix - out_grd = shared_mojo_grdp - - deps = [ "//ash/webui/sample_system_web_app_ui/mojom:shared_webui_js" ] - - # Flatten out the dependency tree of your mojom and add generated bindings - # file here. - input_files = [ "ash/webui/sample_system_web_app_ui/mojom/sample_system_web_app_shared_ui.mojom-webui.js" ] - - input_files_base_dir = - rebase_path("$root_gen_dir/mojom-webui", "$root_build_dir") -} - -untrusted_mojo_grdp = - "$target_gen_dir/sample_system_web_app_untrusted_mojo_resources.grdp" -generate_grd("build_untrusted_mojo_grdp") { - grd_prefix = grd_prefix - out_grd = untrusted_mojo_grdp - - deps = [ "//ash/webui/sample_system_web_app_ui/mojom:untrusted_webui_js" ] - - # Flatten out the dependency tree of your mojom and add generated bindings - # file here. - input_files = [ "ash/webui/sample_system_web_app_ui/mojom/sample_system_web_app_untrusted_ui.mojom-webui.js" ] - - input_files_base_dir = - rebase_path("$root_gen_dir/mojom-webui", "$root_build_dir") -} - -generate_grd("build_untrusted_grd") { - input_files_base_dir = rebase_path("resources", "//") - input_files = [ - "untrusted.html", - "untrusted.js", - "untrusted_page_interface.js", - ] - grd_prefix = "ash_sample_system_web_app_untrusted" - out_grd = "$target_gen_dir/${grd_prefix}_resources.grd" - - deps = [ - ":build_shared_mojo_grdp", - ":build_untrusted_mojo_grdp", - ] - grdp_files = [ - shared_mojo_grdp, - untrusted_mojo_grdp, - ] -} - -generate_grd("build_trusted_grd") { - input_files_base_dir = rebase_path("resources", "//") - input_files = [ - "app_icon_192.png", - "component_playground.html", - "index.html", - "inter_frame_communication.html", - "inter_frame_communication.js", - "main.js", - "worker.js", - "page_handler.js", - "timer.html", - "timer.js", - ] - - # Manifest for generated files generated by resources:component_playground. - manifest_files = [ "$target_gen_dir/resources/build_manifest.json" ] - grd_prefix = grd_prefix - out_grd = "$target_gen_dir/${grd_prefix}_resources.grd" - deps = [ - ":build_shared_mojo_grdp", - ":build_trusted_mojo_grdp", - "resources:component_playground", - ] - grdp_files = [ - shared_mojo_grdp, - trusted_mojo_grdp, - ] -} diff --git a/ash/webui/sample_system_web_app_ui/mojom/BUILD.gn b/ash/webui/sample_system_web_app_ui/mojom/BUILD.gn index 1f74a2c79037f7..99ed5ba59e7d5c 100644 --- a/ash/webui/sample_system_web_app_ui/mojom/BUILD.gn +++ b/ash/webui/sample_system_web_app_ui/mojom/BUILD.gn @@ -4,34 +4,64 @@ import("//build/config/chromeos/ui_mode.gni") import("//mojo/public/tools/bindings/mojom.gni") +import("//tools/typescript/ts_library.gni") assert(is_chromeos_ash, "Sample System Web App is ash-chrome only") assert(!is_official_build, "Sample System Web App is only built for unofficial builds") +cur_dir = rebase_path(".", "//") + mojom("trusted") { sources = [ "sample_system_web_app_ui.mojom" ] public_deps = [ - "//ash/webui/sample_system_web_app_ui/mojom:shared", + ":shared", "//mojo/public/mojom/base", ] - webui_module_path = "/ash/webui/sample_system_web_app_ui/mojom/" + webui_module_path = "/$cur_dir" } mojom("shared") { sources = [ "sample_system_web_app_shared_ui.mojom" ] public_deps = [ "//mojo/public/mojom/base" ] - webui_module_path = "/ash/webui/sample_system_web_app_ui/mojom/" + webui_module_path = "/$cur_dir" } mojom("untrusted") { sources = [ "sample_system_web_app_untrusted_ui.mojom" ] public_deps = [ - "//ash/webui/sample_system_web_app_ui/mojom:shared", + ":shared", "//mojo/public/mojom/base", ] - webui_module_path = "/ash/webui/sample_system_web_app_ui/mojom/" + webui_module_path = "/" + rebase_path(".", "//") +} + +# Builds a TS library for generated Mojo files that can be depended on by +# downstream TS clients. In particular, we need d.ts files to be generated from +# the JS files so that downstream TS clients get type information. +# TODO(crbug.com/1002798): Mojo should generate this ts_library() from actual +# TS files rather than creating d.ts files from the generated JS files. +ts_library("mojom_ts") { + mojom_gen_dir = "$root_gen_dir/mojom-webui/$cur_dir" + root_dir = mojom_gen_dir + out_dir = "$mojom_gen_dir/tsc" + tsconfig_base = "../tsconfig_base.json" + in_files = [ + "sample_system_web_app_untrusted_ui.mojom-webui.js", + "sample_system_web_app_ui.mojom-webui.js", + "sample_system_web_app_shared_ui.mojom-webui.js", + ] + + # Targets that generate the above .mojom-webui.js files. + extra_deps = [ + ":shared_webui_js", + ":trusted_webui_js", + ":untrusted_webui_js", + ] + + # Generates d.ts files which allows this library to be depended upon. + composite = true } diff --git a/ash/webui/sample_system_web_app_ui/resources/BUILD.gn b/ash/webui/sample_system_web_app_ui/resources/BUILD.gn deleted file mode 100644 index 012229eaa9abd5..00000000000000 --- a/ash/webui/sample_system_web_app_ui/resources/BUILD.gn +++ /dev/null @@ -1,19 +0,0 @@ -# Copyright 2021 The Chromium 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/config/chromeos/ui_mode.gni") -import("//third_party/material_web_components/build_mwc_app.gni") - -assert(is_chromeos_ash, "Sample System Web App is ash-chrome only") -assert(!is_official_build, - "Sample System Web App is only built for unofficial builds") - -build_mwc_app("component_playground") { - host = "sample-system-web-app" - input = rebase_path(".", root_build_dir) - js_module_in_files = [ "component_playground.js" ] - js_out_files = [ "component_playground.rollup.js" ] - out_manifest = "$target_gen_dir/build_manifest.json" - deps = [] -} diff --git a/ash/webui/sample_system_web_app_ui/resources/trusted/BUILD.gn b/ash/webui/sample_system_web_app_ui/resources/trusted/BUILD.gn new file mode 100644 index 00000000000000..efb1d072bfeea1 --- /dev/null +++ b/ash/webui/sample_system_web_app_ui/resources/trusted/BUILD.gn @@ -0,0 +1,84 @@ +# Copyright 2021 The Chromium 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/config/chromeos/ui_mode.gni") +import("//third_party/material_web_components/build_mwc_app.gni") +import("//tools/typescript/ts_library.gni") +import("//ui/webui/resources/tools/generate_grd.gni") + +assert(is_chromeos_ash, "Sample System Web App is ash-chrome only") +assert(!is_official_build, + "Sample System Web App is only built for unofficial builds") + +generate_grd("trusted_grd") { + grd_prefix = "ash_sample_system_web_app" + out_grd = "$target_gen_dir/${grd_prefix}_resources.grd" + + input_files = [ + "app_icon_192.png", + "component_playground.html", + "index.html", + "inter_frame_communication.html", + "timer.html", + ] + input_files_base_dir = rebase_path(".", "//") + + # tsconfig.manifest is generated by :trusted_ts and adds all of the + # in_files to the grd. + manifest_files = [ + "$target_gen_dir/tsconfig.manifest", + "$target_gen_dir/component_playground.manifest", + ] + + # Flatten out the dependency tree of your mojom and add generated bindings + # grdp files here. + # TODO(crbug.com/1002798): We could add a mojo_grdp_deps variable to + # generate_grd that automatically adds these grdp files when you add a + # X_webui_grdp target to it. + grdp_files = [ + "$target_gen_dir/../../mojom/shared_webui_resources.grdp", + "$target_gen_dir/../../mojom/trusted_webui_resources.grdp", + ] + + deps = [ + ":component_playground", + ":trusted_ts", + "../../mojom:shared_webui_grdp", + "../../mojom:trusted_webui_grdp", + ] +} + +ts_library("trusted_ts") { + root_dir = "." + out_dir = "$target_gen_dir/tsc" + + in_files = [ + "inter_frame_communication.ts", + "main.ts", + "page_handler.ts", + + # TODO(crbug.com/1002798): Migrate these Shared Worker files to TS. + "timer.js", + "worker.js", + ] + + tsconfig_base = "../../tsconfig_base.json" + composite = true + + # Allows TSC to check the generated mojom-webui/ directory when it encounters + # imports. + path_mappings = + [ "/*|" + rebase_path("$root_gen_dir/mojom-webui/*", target_gen_dir) ] + + deps = [ "../../mojom:mojom_ts" ] +} + +build_mwc_app("component_playground") { + host = "sample-system-web-app" + input = rebase_path(".", root_build_dir) + js_module_in_files = [ "component_playground.js" ] + js_out_files = [ "component_playground.rollup.js" ] + out_manifest = "$target_gen_dir/component_playground.manifest" + deps = [] +} diff --git a/ash/webui/sample_system_web_app_ui/resources/app_icon_192.png b/ash/webui/sample_system_web_app_ui/resources/trusted/app_icon_192.png similarity index 100% rename from ash/webui/sample_system_web_app_ui/resources/app_icon_192.png rename to ash/webui/sample_system_web_app_ui/resources/trusted/app_icon_192.png diff --git a/ash/webui/sample_system_web_app_ui/resources/component_playground.html b/ash/webui/sample_system_web_app_ui/resources/trusted/component_playground.html similarity index 100% rename from ash/webui/sample_system_web_app_ui/resources/component_playground.html rename to ash/webui/sample_system_web_app_ui/resources/trusted/component_playground.html diff --git a/ash/webui/sample_system_web_app_ui/resources/component_playground.js b/ash/webui/sample_system_web_app_ui/resources/trusted/component_playground.js similarity index 100% rename from ash/webui/sample_system_web_app_ui/resources/component_playground.js rename to ash/webui/sample_system_web_app_ui/resources/trusted/component_playground.js diff --git a/ash/webui/sample_system_web_app_ui/resources/index.html b/ash/webui/sample_system_web_app_ui/resources/trusted/index.html similarity index 100% rename from ash/webui/sample_system_web_app_ui/resources/index.html rename to ash/webui/sample_system_web_app_ui/resources/trusted/index.html diff --git a/ash/webui/sample_system_web_app_ui/resources/inter_frame_communication.html b/ash/webui/sample_system_web_app_ui/resources/trusted/inter_frame_communication.html similarity index 100% rename from ash/webui/sample_system_web_app_ui/resources/inter_frame_communication.html rename to ash/webui/sample_system_web_app_ui/resources/trusted/inter_frame_communication.html diff --git a/ash/webui/sample_system_web_app_ui/resources/inter_frame_communication.js b/ash/webui/sample_system_web_app_ui/resources/trusted/inter_frame_communication.ts similarity index 56% rename from ash/webui/sample_system_web_app_ui/resources/inter_frame_communication.js rename to ash/webui/sample_system_web_app_ui/resources/trusted/inter_frame_communication.ts index ac7884509d1c6a..fb5634aae8cc19 100644 --- a/ash/webui/sample_system_web_app_ui/resources/inter_frame_communication.js +++ b/ash/webui/sample_system_web_app_ui/resources/trusted/inter_frame_communication.ts @@ -5,7 +5,8 @@ // This file demonstrates how a chrome:// page can communicate with its // embedded chrome-untrusted:// child page. -import {ParentTrustedPageReceiver} from '/ash/webui/sample_system_web_app_ui/mojom/sample_system_web_app_shared_ui.mojom-webui.js'; +import {ChildUntrustedPageRemote, ParentTrustedPage, ParentTrustedPagePendingReceiver, ParentTrustedPageReceiver} from '/ash/webui/sample_system_web_app_ui/mojom/sample_system_web_app_shared_ui.mojom-webui.js'; + import {callbackRouter} from './page_handler.js'; /** @@ -15,21 +16,15 @@ import {callbackRouter} from './page_handler.js'; * Note: If you expect to have multiple listeners for your interface, consider * using a CallbackRouter instead. CallbackRouter provides a more event-like * API that makes it easier to have multiple listeners. - * - * @implements {ash.mojom.sample_swa.ParentTrustedPage} */ -class ParentTrustedPageImpl { - /** - * @param {ash.mojom.sample_swa.ParentTrustedPagePendingReceiver} - * pendingReceiver - */ - constructor(pendingReceiver) { - this.receiver_ = new ParentTrustedPageReceiver(this); +class ParentTrustedPageImpl implements ParentTrustedPage { + private receiver_ = new ParentTrustedPageReceiver(this); + constructor(pendingReceiver: ParentTrustedPagePendingReceiver) { this.receiver_.$.bindHandle(pendingReceiver.handle); } - async doSomethingForChild(task) { - document.querySelector('#child-task').innerText = task; + async doSomethingForChild(task: string) { + document.querySelector('#child-task')!.innerText = task; // Mojo interface's JS implementation should return an Object, even if the // method only has one return value. @@ -41,9 +36,14 @@ class ParentTrustedPageImpl { // A promise that resolves when child page is ready. Other modules wishing to // use childPage need to wait for the promise. -export const childPageReady = new Promise(resolve => { +interface ChildPageReadyResult { + childPage: ChildUntrustedPageRemote; + parentPageReceiver: ParentTrustedPage; +} +export const childPageReady = new Promise(resolve => { callbackRouter.createParentPage.addListener( - (childPageRemote, parentPagePendingReceiver) => { + (childPageRemote: ChildUntrustedPageRemote, + parentPagePendingReceiver: ParentTrustedPagePendingReceiver) => { resolve({ childPage: childPageRemote, parentPageReceiver: @@ -53,8 +53,14 @@ export const childPageReady = new Promise(resolve => { }); // Expose for testing. +declare global { + interface Window { + childPageReady: Promise<{childPage: ChildUntrustedPageRemote}>; + } +} + window.childPageReady = childPageReady; -childPageReady.then(({childPage}) => { - childPage.doSomethingForParent('Hello from chrome://'); +childPageReady.then((result: ChildPageReadyResult) => { + result.childPage.doSomethingForParent('Hello from chrome://'); }); diff --git a/ash/webui/sample_system_web_app_ui/resources/main.js b/ash/webui/sample_system_web_app_ui/resources/trusted/main.ts similarity index 54% rename from ash/webui/sample_system_web_app_ui/resources/main.js rename to ash/webui/sample_system_web_app_ui/resources/trusted/main.ts index 6fb58a780cfded..d3c2b1a17234b0 100644 --- a/ash/webui/sample_system_web_app_ui/resources/main.js +++ b/ash/webui/sample_system_web_app_ui/resources/trusted/main.ts @@ -2,14 +2,26 @@ // Use of this source code is governed by a BSD-style license that can be // found in the LICENSE file. -import {pageHandler, callbackRouter} from './page_handler.js'; +import {PageCallbackRouter, PageHandlerRemote} from '/ash/webui/sample_system_web_app_ui/mojom/sample_system_web_app_ui.mojom-webui.js'; -const first = document.querySelector('#number1'); -const second = document.querySelector('#number2'); -const additional = document.querySelector('#additional'); +import {callbackRouter, pageHandler} from './page_handler.js'; -const result = document.querySelector('#result'); -const form = document.querySelector('form'); +const first = document.querySelector('#number1')!; +const second = document.querySelector('#number2')!; +const additional = document.querySelector('#additional')!; + +const result = document.querySelector('#result')!; + +// TODO(crbug.com/1002798): Replace this with real type definitions. +declare const trustedTypes: any; + +declare global { + interface Window { + pageHandler: PageHandlerRemote; + callbackRouter: PageCallbackRouter; + eventCount: Map; + } +} const workerUrlPolicy = trustedTypes.createPolicy( 'worker-js-static', @@ -24,11 +36,12 @@ second.onchange = () => { myWorker.port.postMessage([first.value, second.value]); }; -myWorker.port.onmessage = (event) => { +myWorker.port.onmessage = (event: any) => { result.textContent = event.data[0]; additional.value = event.data[1]; }; + // Exposes the pageHandler to the user as a window's global variable for // testing. window.pageHandler = pageHandler; @@ -36,8 +49,8 @@ window.callbackRouter = callbackRouter; window.eventCount = new Map(); // Example of adding an event listener for `OnEventOccurred`. -callbackRouter.onEventOccurred.addListener((name) => { - document.querySelector('#mojo-event').value = name; +callbackRouter.onEventOccurred.addListener((name: string) => { + document.querySelector('#mojo-event')!.value = name; window.eventCount.set(name, 1 + (window.eventCount.get(name) || 0)); }); @@ -50,11 +63,13 @@ pageHandler.send(`message at ${Date.now()}`); // a member for each of the Mojo callback's argument, in this case // a `preferences` member. const {preferences} = await pageHandler.getPreferences(); - document.querySelector('#background').value = preferences.background; - document.querySelector('#foreground').value = preferences.foreground; + document.querySelector('#background')!.value = + preferences.background; + document.querySelector('#foreground')!.value = + preferences.foreground; })(); -const mojoButton = document.querySelector('#do-something'); +const mojoButton = document.querySelector('#do-something')!; mojoButton.onclick = () => { pageHandler.doSomething(); }; diff --git a/ash/webui/sample_system_web_app_ui/resources/page_handler.js b/ash/webui/sample_system_web_app_ui/resources/trusted/page_handler.ts similarity index 97% rename from ash/webui/sample_system_web_app_ui/resources/page_handler.js rename to ash/webui/sample_system_web_app_ui/resources/trusted/page_handler.ts index b8a17ac43e7f42..6cbf802debdd3c 100644 --- a/ash/webui/sample_system_web_app_ui/resources/page_handler.js +++ b/ash/webui/sample_system_web_app_ui/resources/trusted/page_handler.ts @@ -49,4 +49,4 @@ export const callbackRouter = new PageCallbackRouter(); const factoryRemote = PageHandlerFactory.getRemote(); factoryRemote.createPageHandler( pageHandler.$.bindNewPipeAndPassReceiver(), - callbackRouter.$.bindNewPipeAndPassRemote()); \ No newline at end of file + callbackRouter.$.bindNewPipeAndPassRemote()); diff --git a/ash/webui/sample_system_web_app_ui/resources/timer.html b/ash/webui/sample_system_web_app_ui/resources/trusted/timer.html similarity index 100% rename from ash/webui/sample_system_web_app_ui/resources/timer.html rename to ash/webui/sample_system_web_app_ui/resources/trusted/timer.html diff --git a/ash/webui/sample_system_web_app_ui/resources/timer.js b/ash/webui/sample_system_web_app_ui/resources/trusted/timer.js similarity index 100% rename from ash/webui/sample_system_web_app_ui/resources/timer.js rename to ash/webui/sample_system_web_app_ui/resources/trusted/timer.js diff --git a/ash/webui/sample_system_web_app_ui/resources/worker.js b/ash/webui/sample_system_web_app_ui/resources/trusted/worker.js similarity index 100% rename from ash/webui/sample_system_web_app_ui/resources/worker.js rename to ash/webui/sample_system_web_app_ui/resources/trusted/worker.js diff --git a/ash/webui/sample_system_web_app_ui/resources/untrusted/BUILD.gn b/ash/webui/sample_system_web_app_ui/resources/untrusted/BUILD.gn new file mode 100644 index 00000000000000..3a0df76b584474 --- /dev/null +++ b/ash/webui/sample_system_web_app_ui/resources/untrusted/BUILD.gn @@ -0,0 +1,59 @@ +# Copyright 2021 The Chromium 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/config/chromeos/ui_mode.gni") +import("//tools/typescript/ts_library.gni") +import("//ui/webui/resources/tools/generate_grd.gni") + +assert(is_chromeos_ash, "Sample System Web App is ash-chrome only") +assert(!is_official_build, + "Sample System Web App is only built for unofficial builds") + +generate_grd("untrusted_grd") { + grd_prefix = "ash_sample_system_web_app_untrusted" + out_grd = "$target_gen_dir/${grd_prefix}_resources.grd" + + input_files = [ "untrusted.html" ] + input_files_base_dir = rebase_path(".", "//") + + # tsconfig.manifest is generated by :untrusted_ts and adds all of the + # in_files to the grd. + manifest_files = [ "$target_gen_dir/tsconfig.manifest" ] + + # Flatten out the dependency tree of your mojom and add generated bindings + # grdp files here. + # TODO(crbug.com/1002798): We could add a mojo_grdp_deps variable to + # generate_grd that automatically adds these grdp files when you add a + # X_webui_grdp target to it. + grdp_files = [ + "$target_gen_dir/../../mojom/shared_webui_resources.grdp", + "$target_gen_dir/../../mojom/untrusted_webui_resources.grdp", + ] + + deps = [ + ":untrusted_ts", + "../../mojom:shared_webui_grdp", + "../../mojom:untrusted_webui_grdp", + ] +} + +ts_library("untrusted_ts") { + root_dir = "." + out_dir = "$target_gen_dir/tsc" + + in_files = [ + "untrusted.ts", + "untrusted_page_interface.ts", + ] + + composite = true + tsconfig_base = "../../tsconfig_base.json" + + # Allows TSC to check the generated mojom-webui/ directory when it encounters + # imports. + path_mappings = + [ "/*|" + rebase_path("$root_gen_dir/mojom-webui/*", target_gen_dir) ] + + deps = [ "../../mojom:mojom_ts" ] +} diff --git a/ash/webui/sample_system_web_app_ui/resources/untrusted.html b/ash/webui/sample_system_web_app_ui/resources/untrusted/untrusted.html similarity index 100% rename from ash/webui/sample_system_web_app_ui/resources/untrusted.html rename to ash/webui/sample_system_web_app_ui/resources/untrusted/untrusted.html diff --git a/ash/webui/sample_system_web_app_ui/resources/untrusted.js b/ash/webui/sample_system_web_app_ui/resources/untrusted/untrusted.ts similarity index 80% rename from ash/webui/sample_system_web_app_ui/resources/untrusted.js rename to ash/webui/sample_system_web_app_ui/resources/untrusted/untrusted.ts index 7ac193c1f4db45..5f8bb06bb2806a 100644 --- a/ash/webui/sample_system_web_app_ui/resources/untrusted.js +++ b/ash/webui/sample_system_web_app_ui/resources/untrusted/untrusted.ts @@ -1,9 +1,9 @@ // Copyright 2020 The Chromium 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 {PARENT_PAGE_ORIGIN, parentPage} from '/untrusted_page_interface.js'; +import {PARENT_PAGE_ORIGIN, parentPage} from './untrusted_page_interface.js'; -const header = document.querySelector('#untrusted-title'); +const header = document.querySelector('#untrusted-title')!; header.textContent = 'Untrusted Sample System Web App'; // For testing purposes: notify the parent window the iframe has been embedded @@ -30,5 +30,6 @@ window.addEventListener('message', async event => { // Ask the parent page to do something, and retrieve the result. parentPage.doSomethingForChild('Say hello').then(result => { - document.querySelector('#parent-resp').innerText = result.resp; -}); \ No newline at end of file + document.querySelector('#parent-resp')!.innerText = + result.resp; +}); diff --git a/ash/webui/sample_system_web_app_ui/resources/untrusted_page_interface.js b/ash/webui/sample_system_web_app_ui/resources/untrusted/untrusted_page_interface.ts similarity index 90% rename from ash/webui/sample_system_web_app_ui/resources/untrusted_page_interface.js rename to ash/webui/sample_system_web_app_ui/resources/untrusted/untrusted_page_interface.ts index 1944a13e58a20c..a9099ce0fab45c 100644 --- a/ash/webui/sample_system_web_app_ui/resources/untrusted_page_interface.js +++ b/ash/webui/sample_system_web_app_ui/resources/untrusted/untrusted_page_interface.ts @@ -18,17 +18,16 @@ export const PARENT_PAGE_ORIGIN = 'chrome://sample-system-web-app'; * @implements {ash.mojom.sample_swa.ChildUntrustedPage} */ class ChildUntrustedPageImpl { - constructor() { - this.receiver_ = new ChildUntrustedPageReceiver(this); - } + private receiver_ = new ChildUntrustedPageReceiver(this); // Returns a Mojo remote that should be send to the parent page to be bound. bindNewPipeAndPassRemote() { return this.receiver_.$.bindNewPipeAndPassRemote(); } - doSomethingForParent(task) { - document.querySelector('#parent-task').innerText = task; + doSomethingForParent(task: string) { + document.querySelector('#parent-task')!.innerText = + task; // For testing, report the received task. window.parent.postMessage( diff --git a/ash/webui/sample_system_web_app_ui/tsconfig_base.json b/ash/webui/sample_system_web_app_ui/tsconfig_base.json new file mode 100644 index 00000000000000..33f7126e6aa031 --- /dev/null +++ b/ash/webui/sample_system_web_app_ui/tsconfig_base.json @@ -0,0 +1,6 @@ +{ + "extends": "../../../tools/typescript/tsconfig_base.json", + "compilerOptions": { + "allowJs": true + } +} diff --git a/mojo/public/tools/bindings/mojom.gni b/mojo/public/tools/bindings/mojom.gni index f1e4173f9319f8..e76d39328f256e 100644 --- a/mojo/public/tools/bindings/mojom.gni +++ b/mojo/public/tools/bindings/mojom.gni @@ -5,6 +5,7 @@ import("//third_party/closure_compiler/closure_args.gni") import("//third_party/closure_compiler/compile_js.gni") import("//third_party/protobuf/proto_library.gni") +import("//ui/webui/resources/tools/generate_grd.gni") import("//ui/webui/webui_features.gni") # TODO(rockot): Maybe we can factor these dependencies out of //mojo. They're @@ -1884,6 +1885,24 @@ template("mojom") { group(webui_js_target_name) { } } + + webui_grdp_target_name = "${target_name}_webui_grdp" + out_grd = "$target_gen_dir/${target_name}_webui_resources.grdp" + grd_prefix = "${target_name}_webui" + generate_grd(webui_grdp_target_name) { + grd_prefix = grd_prefix + out_grd = out_grd + + deps = [ ":$webui_js_target_name" ] + + input_files = [] + foreach(base_path, output_file_base_paths) { + input_files += [ "${base_path}-webui.js" ] + } + + input_files_base_dir = + rebase_path("$root_gen_dir/mojom-webui", "$root_build_dir") + } } } if ((generate_fuzzing || !defined(invoker.cpp_only) || !invoker.cpp_only) && diff --git a/tools/gritsettings/resource_ids.spec b/tools/gritsettings/resource_ids.spec index 94e9bb0d5480d4..420f56975d6886 100644 --- a/tools/gritsettings/resource_ids.spec +++ b/tools/gritsettings/resource_ids.spec @@ -494,11 +494,11 @@ "includes": [3140], "structures": [3160], }, - "<(SHARED_INTERMEDIATE_DIR)/ash/webui/sample_system_web_app_ui/ash_sample_system_web_app_resources.grd": { + "<(SHARED_INTERMEDIATE_DIR)/ash/webui/sample_system_web_app_ui/resources/trusted/ash_sample_system_web_app_resources.grd": { "META": {"sizes": {"includes": [50],}}, "includes": [3180], }, - "<(SHARED_INTERMEDIATE_DIR)/ash/webui/sample_system_web_app_ui/ash_sample_system_web_app_untrusted_resources.grd": { + "<(SHARED_INTERMEDIATE_DIR)/ash/webui/sample_system_web_app_ui/resources/untrusted/ash_sample_system_web_app_untrusted_resources.grd": { "META": {"sizes": {"includes": [50],}}, "includes": [3200], },