chromium/src
0
Fork 0
Code Activity

webui: migrate connectivity_diagnostics to TypeScript

Browse Source 
This change migrates the
//ash/webui/connectivity_diagnostics/resources/connectivity_diagnostics
directory from JavaScript to TypeScript.

Before: https://drive.google.com/file/d/1htRKJIaRqF-N5nzoQK81hnTWwMfUviH8/view?usp=sharing
After: https://drive.google.com/file/d/1LLvchoJRv3y9Sa1NM8xYhIO3jcz9j9d7/view?usp=sharing

Bug: b/315873234
Test: ./out/Default/browser_tests --gtest_filter=*NetworkDiagnostics*
Test: Verified on DUT.

Change-Id: I43189638b29e0acee10f7b1612ba983173802150
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5097804
Reviewed-by: Wes Okuhara <wesokuhara@google.com>
Reviewed-by: Demetrios Papadopoulos <dpapad@chromium.org>
Reviewed-by: Daniel Cheng <dcheng@chromium.org>
Commit-Queue: Chad Duffin <chadduffin@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1237606}
This commit is contained in:
Chad Duffin
2023-12-14 18:04:13 +00:00
committed by Chromium LUCI CQ
parent 6aad676543
commit 06e47de0c9
18 changed files with 414 additions and 370 deletions

2
PRESUBMIT.py

@ -315,7 +315,7 @@ _BANNED_JAVASCRIPT_FUNCTIONS : Sequence [BanRule] = (
'ash/webui/common/resources/multidevice_setup/multidevice_setup_browser_proxy.js',
'ash/webui/common/resources/quick_unlock/lock_screen_constants.ts',
'ash/webui/common/resources/smb_shares/smb_browser_proxy.js',
'ash/webui/connectivity_diagnostics/resources/connectivity_diagnostics.js',
'ash/webui/connectivity_diagnostics/resources/connectivity_diagnostics.ts',
'ash/webui/diagnostics_ui/resources/diagnostics_browser_proxy.ts',
'ash/webui/multidevice_debug/resources/logs.js',
'ash/webui/multidevice_debug/resources/webui.js',

1
ash/webui/BUILD.gn

@ -63,7 +63,6 @@ group("closure_compile") {
testonly = true
deps = [
"//ash/webui/common:closure_compile",
"//ash/webui/connectivity_diagnostics:closure_compile",
"//ash/webui/demo_mode_app_ui:closure_compile",
"//ash/webui/eche_app_ui:closure_compile",
"//ash/webui/file_manager/untrusted_resources:closure_compile",

5
ash/webui/common/resources/BUILD.gn

@ -429,7 +429,6 @@ generate_definitions_js_files = [
"network/cr_policy_network_behavior_mojo.js",
"network_health/mojo_interface_provider.js",
"network_health/network_diagnostics.html.js",
"network_health/network_diagnostics.js",
"network_health/network_diagnostics_types.js",
"network_health/network_health_container.html.js",
"network_health/network_health_container.js",
@ -511,6 +510,7 @@ checked_in_dts_files = [
"smb_shares/smb_browser_proxy.d.ts",
"traffic_counters/traffic_counters.d.ts",
"network/apn_detail_dialog.d.ts",
"network/apn_list.d.ts",
"network/apn_list_item.d.ts",
"network/cr_policy_network_indicator_mojo.d.ts",
@ -530,7 +530,8 @@ checked_in_dts_files = [
"network/network_proxy.d.ts",
"network/network_siminfo.d.ts",
"network/sim_lock_dialogs.d.ts",
"network/apn_detail_dialog.d.ts",
"network_health/network_diagnostics.d.ts",
"network_health/network_health_summary.d.ts",
"post_message_api/post_message_api_client.d.ts",
"post_message_api/post_message_api_request_handler.d.ts",

15
ash/webui/common/resources/network_health/network_diagnostics.d.ts vendored Normal file

@ -0,0 +1,15 @@
// Copyright 2023 The Chromium Authors
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import {PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
export class NetworkDiagnosticsElement extends PolymerElement {
runAllRoutines(): void;
}
declare global {
interface HTMLElementTagNameMap {
'network-diagnostics': NetworkDiagnosticsElement;
}
}

354
ash/webui/common/resources/network_health/network_diagnostics.js

@ -5,8 +5,8 @@
import 'chrome://resources/cr_elements/cr_button/cr_button.js';
import './routine_group.js';
import {Polymer} from '//resources/polymer/v3_0/polymer/polymer_bundled.min.js';
import {I18nBehavior} from 'chrome://resources/ash/common/i18n_behavior.js';
import {mixinBehaviors, PolymerElement} from '//resources/polymer/v3_0/polymer/polymer_bundled.min.js';
import {I18nBehavior, I18nBehaviorInterface} from 'chrome://resources/ash/common/i18n_behavior.js';
import {ArcDnsResolutionProblem, ArcHttpProblem, ArcPingProblem, CaptivePortalProblem, DnsLatencyProblem, DnsResolutionProblem, DnsResolverPresentProblem, GatewayCanBePingedProblem, HasSecureWiFiConnectionProblem, HttpFirewallProblem, HttpsFirewallProblem, HttpsLatencyProblem, RoutineProblems, RoutineType, RoutineVerdict, SignalStrengthProblem, VideoConferencingProblem} from 'chrome://resources/mojo/chromeos/services/network_health/public/mojom/network_diagnostics.mojom-webui.js';
import {getNetworkDiagnosticsService} from './mojo_interface_provider.js';
@ -38,169 +38,185 @@ function createRoutine(name, type, group, func) {
};
}
Polymer({
_template: getTemplate(),
is: 'network-diagnostics',
/**
* @constructor
* @extends {PolymerElement}
* @implements {I18nBehaviorInterface}
*/
const NetworkDiagnosticsElementBase =
mixinBehaviors([I18nBehavior], PolymerElement);
behaviors: [
I18nBehavior,
],
/** @polymer */
export class NetworkDiagnosticsElement extends NetworkDiagnosticsElementBase {
static get is() {
return 'network-diagnostics';
}
properties: {
/**
* List of Diagnostics Routines
* @private {!Array<!Routine>}
*/
routines_: {
type: Array,
value: function() {
const routineGroups = [
{
group: RoutineGroup.CONNECTION,
routines: [
{
name: 'NetworkDiagnosticsLanConnectivity',
type: RoutineType.kLanConnectivity,
func: () => getNetworkDiagnosticsService().runLanConnectivity(),
},
],
},
{
group: RoutineGroup.WIFI,
routines: [
{
name: 'NetworkDiagnosticsSignalStrength',
type: RoutineType.kSignalStrength,
func: () => getNetworkDiagnosticsService().runSignalStrength(),
},
{
name: 'NetworkDiagnosticsHasSecureWiFiConnection',
type: RoutineType.kHasSecureWiFiConnection,
func: () =>
getNetworkDiagnosticsService().runHasSecureWiFiConnection(),
},
],
},
{
group: RoutineGroup.PORTAL,
routines: [
{
name: 'NetworkDiagnosticsCaptivePortal',
type: RoutineType.kCaptivePortal,
func: () => getNetworkDiagnosticsService().runCaptivePortal(),
},
],
},
{
group: RoutineGroup.GATEWAY,
routines: [
{
name: 'NetworkDiagnosticsGatewayCanBePinged',
type: RoutineType.kGatewayCanBePinged,
func: () =>
getNetworkDiagnosticsService().runGatewayCanBePinged(),
},
],
},
{
group: RoutineGroup.FIREWALL,
routines: [
{
name: 'NetworkDiagnosticsHttpFirewall',
type: RoutineType.kHttpFirewall,
func: () => getNetworkDiagnosticsService().runHttpFirewall(),
},
{
name: 'NetworkDiagnosticsHttpsFirewall',
type: RoutineType.kHttpsFirewall,
func: () => getNetworkDiagnosticsService().runHttpsFirewall(),
static get template() {
return getTemplate();
}
},
{
name: 'NetworkDiagnosticsHttpsLatency',
type: RoutineType.kHttpsLatency,
func: () => getNetworkDiagnosticsService().runHttpsLatency(),
},
],
},
{
group: RoutineGroup.DNS,
routines: [
{
name: 'NetworkDiagnosticsDnsResolverPresent',
type: RoutineType.kDnsResolverPresent,
func: () =>
getNetworkDiagnosticsService().runDnsResolverPresent(),
},
{
name: 'NetworkDiagnosticsDnsLatency',
type: RoutineType.kDnsLatency,
func: () => getNetworkDiagnosticsService().runDnsLatency(),
},
{
name: 'NetworkDiagnosticsDnsResolution',
type: RoutineType.kDnsResolution,
func: () => getNetworkDiagnosticsService().runDnsResolution(),
},
],
},
{
group: RoutineGroup.GOOGLE_SERVICES,
routines: [
{
name: 'NetworkDiagnosticsVideoConferencing',
type: RoutineType.kVideoConferencing,
// A null stun_server_hostname will use the routine
// default.
func: () => getNetworkDiagnosticsService().runVideoConferencing(
/*stun_server_hostname=*/ null),
},
],
},
{
group: RoutineGroup.ARC,
routines: [
{
name: 'ArcNetworkDiagnosticsPing',
type: RoutineType.kArcPing,
func: () => getNetworkDiagnosticsService().runArcPing(),
},
{
name: 'ArcNetworkDiagnosticsHttp',
type: RoutineType.kArcHttp,
func: () => getNetworkDiagnosticsService().runArcHttp(),
},
{
name: 'ArcNetworkDiagnosticsDnsResolution',
type: RoutineType.kArcDnsResolution,
func: () =>
getNetworkDiagnosticsService().runArcDnsResolution(),
},
],
},
];
const routines = [];
static get properties() {
return {
/**
* List of Diagnostics Routines
* @private {!Array<!Routine>}
*/
routines_: {
type: Array,
value: function() {
const routineGroups = [
{
group: RoutineGroup.CONNECTION,
routines: [
{
name: 'NetworkDiagnosticsLanConnectivity',
type: RoutineType.kLanConnectivity,
func: () =>
getNetworkDiagnosticsService().runLanConnectivity(),
},
],
},
{
group: RoutineGroup.WIFI,
routines: [
{
name: 'NetworkDiagnosticsSignalStrength',
type: RoutineType.kSignalStrength,
func: () =>
getNetworkDiagnosticsService().runSignalStrength(),
},
{
name: 'NetworkDiagnosticsHasSecureWiFiConnection',
type: RoutineType.kHasSecureWiFiConnection,
func: () => getNetworkDiagnosticsService()
.runHasSecureWiFiConnection(),
},
],
},
{
group: RoutineGroup.PORTAL,
routines: [
{
name: 'NetworkDiagnosticsCaptivePortal',
type: RoutineType.kCaptivePortal,
func: () => getNetworkDiagnosticsService().runCaptivePortal(),
},
],
},
{
group: RoutineGroup.GATEWAY,
routines: [
{
name: 'NetworkDiagnosticsGatewayCanBePinged',
type: RoutineType.kGatewayCanBePinged,
func: () =>
getNetworkDiagnosticsService().runGatewayCanBePinged(),
},
],
},
{
group: RoutineGroup.FIREWALL,
routines: [
{
name: 'NetworkDiagnosticsHttpFirewall',
type: RoutineType.kHttpFirewall,
func: () => getNetworkDiagnosticsService().runHttpFirewall(),
},
{
name: 'NetworkDiagnosticsHttpsFirewall',
type: RoutineType.kHttpsFirewall,
func: () => getNetworkDiagnosticsService().runHttpsFirewall(),
for (const group of routineGroups) {
for (const routine of group.routines) {
routines[routine.type] = createRoutine(
routine.name, routine.type, group.group, routine.func);
},
{
name: 'NetworkDiagnosticsHttpsLatency',
type: RoutineType.kHttpsLatency,
func: () => getNetworkDiagnosticsService().runHttpsLatency(),
},
],
},
{
group: RoutineGroup.DNS,
routines: [
{
name: 'NetworkDiagnosticsDnsResolverPresent',
type: RoutineType.kDnsResolverPresent,
func: () =>
getNetworkDiagnosticsService().runDnsResolverPresent(),
},
{
name: 'NetworkDiagnosticsDnsLatency',
type: RoutineType.kDnsLatency,
func: () => getNetworkDiagnosticsService().runDnsLatency(),
},
{
name: 'NetworkDiagnosticsDnsResolution',
type: RoutineType.kDnsResolution,
func: () => getNetworkDiagnosticsService().runDnsResolution(),
},
],
},
{
group: RoutineGroup.GOOGLE_SERVICES,
routines: [
{
name: 'NetworkDiagnosticsVideoConferencing',
type: RoutineType.kVideoConferencing,
// A null stun_server_hostname will use the routine
// default.
func: () =>
getNetworkDiagnosticsService().runVideoConferencing(
/*stun_server_hostname=*/ null),
},
],
},
{
group: RoutineGroup.ARC,
routines: [
{
name: 'ArcNetworkDiagnosticsPing',
type: RoutineType.kArcPing,
func: () => getNetworkDiagnosticsService().runArcPing(),
},
{
name: 'ArcNetworkDiagnosticsHttp',
type: RoutineType.kArcHttp,
func: () => getNetworkDiagnosticsService().runArcHttp(),
},
{
name: 'ArcNetworkDiagnosticsDnsResolution',
type: RoutineType.kArcDnsResolution,
func: () =>
getNetworkDiagnosticsService().runArcDnsResolution(),
},
],
},
];
const routines = [];
for (const group of routineGroups) {
for (const routine of group.routines) {
routines[routine.type] = createRoutine(
routine.name, routine.type, group.group, routine.func);
}
}
}
return routines;
return routines;
},
},
},
/**
* Enum of Routine Groups
* @private {Object}
*/
RoutineGroup_: {
type: Object,
value: RoutineGroup,
},
},
/**
* Enum of Routine Groups
* @private {Object}
*/
RoutineGroup_: {
type: Object,
value: RoutineGroup,
},
};
}
/**
* Runs all supported network diagnostics routines.
@ -210,7 +226,7 @@ Polymer({
for (const routine of this.routines_) {
this.runRoutine_(routine.type);
}
},
}
/**
* Runs all supported network diagnostics routines.
@ -221,7 +237,7 @@ Polymer({
*/
getRoutineGroup_(routines, group) {
return routines.base.filter(r => r.group === group);
},
}
/**
* @param {!RoutineType} type
@ -237,7 +253,7 @@ Polymer({
this.routines_[type].func().then(
result => this.evaluateRoutine_(type, result));
},
}
/**
* @param {!RoutineType} type
@ -252,7 +268,7 @@ Polymer({
const resultMsg = this.getRoutineResult_(this.routines_[type]);
this.set(routine + '.resultMsg', resultMsg);
this.set(routine + '.ariaDescription', resultMsg);
},
}
/**
* Helper function to generate the routine result string.
@ -285,7 +301,7 @@ Polymer({
}
return '';
},
}
/**
* @param {!RoutineType} type The type of routine
@ -582,7 +598,7 @@ Polymer({
}
return problemStrings;
},
}
/**
* Converts a collection ArcPingProblem into string identifiers for display.
@ -623,7 +639,7 @@ Polymer({
}
return problemStringIds;
},
}
/**
* Converts a collection ArcDnsResolutionProblem into string identifiers for
@ -660,7 +676,7 @@ Polymer({
}
return problemStringIds;
},
}
/**
* Converts a collection ArcHttpProblem into string identifiers for display.
@ -695,7 +711,7 @@ Polymer({
}
return problemStringIds;
},
}
/**
* @param {!RoutineVerdict} verdict
@ -712,5 +728,7 @@ Polymer({
return 'Failed';
}
return 'Unknown';
},
});
}
}
customElements.define(NetworkDiagnosticsElement.is, NetworkDiagnosticsElement);

13
ash/webui/common/resources/network_health/network_health_summary.d.ts vendored Normal file

@ -0,0 +1,13 @@
// Copyright 2023 The Chromium Authors
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import {PolymerElement} from '//resources/polymer/v3_0/polymer/polymer_bundled.min.js';
export class NetworkHealthSummaryElement extends PolymerElement {}
declare global {
interface HTMLElementTagNameMap {
'network-health-summary': NetworkHealthSummaryElement;
}
}

118
ash/webui/common/resources/network_health/network_health_summary.js

@ -1,13 +1,13 @@
// Copyright 2020 The Chromium Authors
// Copyright 2019 The Chromium Authors
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import 'chrome://resources/cr_elements/cr_shared_style.css.js';
import 'chrome://resources/ash/common/network/network_shared.css.js';
import {Polymer} from '//resources/polymer/v3_0/polymer/polymer_bundled.min.js';
import {mixinBehaviors, PolymerElement} from '//resources/polymer/v3_0/polymer/polymer_bundled.min.js';
import {assertNotReached} from 'chrome://resources/ash/common/assert.js';
import {I18nBehavior} from 'chrome://resources/ash/common/i18n_behavior.js';
import {I18nBehavior, I18nBehaviorInterface} from 'chrome://resources/ash/common/i18n_behavior.js';
import {OncMojo} from 'chrome://resources/ash/common/network/onc_mojo.js';
import {NetworkType, PortalState} from 'chrome://resources/mojo/chromeos/services/network_config/public/mojom/network_types.mojom-webui.js';
import {NetworkHealthService, NetworkHealthServiceRemote} from 'chrome://resources/mojo/chromeos/services/network_health/public/mojom/network_health.mojom-webui.js';
@ -25,49 +25,76 @@ const TechnologyIcons = {
/**
* @fileoverview Polymer element for displaying NetworkHealth properties.
*/
Polymer({
_template: getTemplate(),
is: 'network-health-summary',
behaviors: [
I18nBehavior,
],
/**
* @constructor
* @extends {PolymerElement}
* @implements {I18nBehaviorInterface}
*/
const NetworkHealthSummaryElementBase =
mixinBehaviors([I18nBehavior], PolymerElement);
/**
* Network Health State object.
* @private
* @type {NetworkHealthState}
*/
networkHealthState_: null,
/** @polymer */
class NetworkHealthSummaryElement extends NetworkHealthSummaryElementBase {
static get is() {
return 'network-health-summary';
}
/**
* Network Health mojo remote.
* @private
* @type {?NetworkHealthServiceRemote}
*/
networkHealth_: null,
static get template() {
return getTemplate();
}
/**
* Expanded state per network type.
* @private
* @type {!Array<boolean>}
*/
typeExpanded_: [],
static get properties() {
return {
/**
* Network Health State object.
* @private
* @type {NetworkHealthState}
*/
networkHealthState_: {
type: Object,
},
/**
* Network Health mojo remote.
* @private
* @type {?NetworkHealthServiceRemote}
*/
networkHealth_: {
type: Object,
value: null,
},
/**
* Expanded state per network type.
* @private
* @type {!Array<boolean>}
*/
typeExpanded_: {
type: Array,
value: () => [],
},
};
}
/** @override */
created() {
constructor() {
super();
this.networkHealth_ = NetworkHealthService.getRemote();
},
}
/** @override */
attached() {
connectedCallback() {
super.connectedCallback();
this.requestNetworkHealth_();
// Automatically refresh Network Health every second.
window.setInterval(() => {
this.requestNetworkHealth_();
}, 1000);
},
}
/**
* Requests the NetworkHealthState and updates the page.
@ -77,7 +104,7 @@ Polymer({
this.networkHealth_.getHealthSnapshot().then(result => {
this.networkHealthState_ = result.state;
});
},
}
/**
* Returns a string for the given NetworkState.
@ -107,7 +134,7 @@ Polymer({
assertNotReached('Unexpected enum value');
return '';
},
}
/**
* Returns a boolean flag to show the PortalState attribute. The information
@ -134,7 +161,7 @@ Polymer({
}
return true;
},
}
/**
* Returns a string for the given PortalState.
@ -144,7 +171,7 @@ Polymer({
*/
getPortalStateString_(state) {
return this.i18n('OncPortalState' + OncMojo.getPortalStateString(state));
},
}
/**
* Returns a string for the given NetworkType.
@ -154,7 +181,7 @@ Polymer({
*/
getNetworkTypeString_(type) {
return this.i18n('OncType' + OncMojo.getNetworkTypeString(type));
},
}
/**
* Returns a icon for the given NetworkType.
@ -177,7 +204,7 @@ Polymer({
default:
return '';
}
},
}
/**
* Returns a string for the given signal strength.
@ -187,7 +214,7 @@ Polymer({
*/
getSignalStrengthString_(signalStrength) {
return signalStrength ? signalStrength.value.toString() : '';
},
}
/**
* Returns a boolean flag if the open to settings link should be shown.
@ -203,7 +230,7 @@ Polymer({
NetworkState.kOnline,
];
return validStates.includes(network.state);
},
}
/**
* Returns a URL for the network's settings page.
@ -213,7 +240,7 @@ Polymer({
*/
getNetworkUrl_(network) {
return 'chrome://os-settings/networkDetail?guid=' + network.guid;
},
}
/**
* Returns a concatenated list of strings.
@ -223,7 +250,7 @@ Polymer({
*/
joinAddresses_(addresses) {
return addresses.join(', ');
},
}
/**
* Returns a boolean flag if the routine type should be expanded.
@ -237,7 +264,7 @@ Polymer({
}
return this.typeExpanded_[type];
},
}
/**
* Helper function to toggle the expanded properties when the network
@ -248,5 +275,8 @@ Polymer({
onToggleExpanded_(event) {
const type = event.model.network.type;
this.set('typeExpanded_.' + type, !this.typeExpanded_[type]);
},
});
}
}
customElements.define(
NetworkHealthSummaryElement.is, NetworkHealthSummaryElement);

6
ash/webui/connectivity_diagnostics/BUILD.gn

@ -22,9 +22,9 @@ static_library("connectivity_diagnostics") {
deps = [
"//ash/webui/common:chrome_os_webui_config",
"//ash/webui/common:trusted_types_util",
"//ash/webui/connectivity_diagnostics/resources:resources",
"//ash/webui/network_ui:network_diagnostics_resource_provider",
"//ash/webui/network_ui:network_health_resource_provider",
"//ash/webui/resources:connectivity_diagnostics_resources",
"//ash/webui/web_applications",
"//chromeos/services/network_health/public/mojom",
"//chromeos/strings/",
@ -33,7 +33,3 @@ static_library("connectivity_diagnostics") {
"//ui/resources",
]
}
group("closure_compile") {
deps = [ "resources:closure_compile_module" ]
}

62
ash/webui/connectivity_diagnostics/resources/BUILD.gn

@ -3,55 +3,29 @@
# found in the LICENSE file.
import("//build/config/chromeos/ui_mode.gni")
import("//third_party/closure_compiler/compile_js.gni")
import("//tools/grit/preprocess_if_expr.gni")
import("//tools/polymer/html_to_js.gni")
import("//ui/webui/resources/tools/generate_grd.gni")
import("//ui/webui/resources/tools/build_webui.gni")
assert(is_chromeos_ash)
assert(is_chromeos_ash, "Non-ChromeOS builds cannot depend on //ash")
preprocess_folder = "preprocessed"
preprocess_gen_manifest = "preprocessed_gen_manifest.json"
js_type_check("closure_compile_module") {
is_polymer3 = true
closure_flags = default_closure_args + mojom_js_args
deps = [ ":connectivity_diagnostics" ]
}
js_library("connectivity_diagnostics") {
deps = [
"//ash/webui/common/resources:cr_container_shadow_behavior",
"//ash/webui/common/resources:i18n_behavior",
"//ash/webui/common/resources/network_health:network_diagnostics",
"//ash/webui/common/resources/network_health:network_health_summary",
"//third_party/polymer/v3_0/components-chromium/polymer:polymer_bundled",
]
externs_list = [ "$externs_path/chrome_send.js" ]
}
generate_grd("build_grd") {
deps = [ ":preprocess_generated" ]
manifest_files = [ "$target_gen_dir/$preprocess_gen_manifest" ]
input_files_base_dir = rebase_path(".", "//")
input_files = [
build_webui("build") {
static_files = [
"index.html",
"app_icon_192.png",
"app_icon_256.png",
]
web_component_files = [ "connectivity_diagnostics.ts" ]
ts_definitions = [ "//tools/typescript/definitions/chrome_send.d.ts" ]
ts_deps = [
"//ash/webui/common/resources:build_ts",
"//third_party/polymer/v3_0:library",
"//ui/webui/resources/cr_elements:build_ts",
"//ui/webui/resources/js:build_ts",
"//ui/webui/resources/mojo:build_ts",
]
grd_prefix = "connectivity_diagnostics"
out_grd = "$target_gen_dir/connectivity_diagnostics_resources.grd"
}
preprocess_if_expr("preprocess_generated") {
deps = [ ":web_components" ]
in_folder = target_gen_dir
out_folder = "$target_gen_dir/$preprocess_folder"
out_manifest = "$target_gen_dir/$preprocess_gen_manifest"
in_files = [ "connectivity_diagnostics.js" ]
}
html_to_js("web_components") {
js_files = [ "connectivity_diagnostics.js" ]
grit_output_dir = "$root_gen_dir/ash/webui"
}

4
ash/webui/connectivity_diagnostics/resources/connectivity_diagnostics.html

@ -41,11 +41,11 @@
<div id="container" class="content" show-bottom-shadow>
<div class="section">
<h3>[[i18n('networkDevicesLabel')]]</h3>
<network-health-summary id="network-health"></network-health-summary>
<network-health-summary id="networkHealth"></network-health-summary>
</div>
<div class="section">
<h3>[[i18n('diagnosticRoutinesLabel')]]</h3>
<network-diagnostics id="network-diagnostics"></network-diagnostics>
<network-diagnostics id="networkDiagnostics"></network-diagnostics>
</div>
</div>
<div class="button-group">

80
ash/webui/connectivity_diagnostics/resources/connectivity_diagnostics.js

@ -1,80 +0,0 @@
// Copyright 2020 The Chromium Authors
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import 'chrome://resources/ash/common/network_health/network_diagnostics.js';
import 'chrome://resources/ash/common/network_health/network_health_summary.js';
import 'chrome://resources/cr_elements/cr_shared_style.css.js';
import './strings.m.js';
import {sendWithPromise} from 'chrome://resources/ash/common/cr.m.js';
import {CrContainerShadowBehavior} from 'chrome://resources/ash/common/cr_container_shadow_behavior.js';
import {I18nBehavior} from 'chrome://resources/ash/common/i18n_behavior.js';
import {html, Polymer} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
/**
* @fileoverview
* Polymer element connectivity diagnostics UI.
*/
Polymer({
is: 'connectivity-diagnostics',
_template: html`{__html_template__}`,
behaviors: [I18nBehavior, CrContainerShadowBehavior],
/**
* Boolean flag to show the feedback button in the app.
* @private
* @type {boolean}
*/
showFeedbackBtn_: false,
/** @override */
attached() {
this.getShowFeedbackBtn_();
this.runAllRoutines_();
},
/**
* Returns and typecasts the network diagnostics element
* @returns {!NetworkDiagnosticsElement}
* @private
*/
getNetworkDiagnosticsElement_() {
return /** @type {!NetworkDiagnosticsElement} */ (
this.$$('#network-diagnostics'));
},
/** @private */
runAllRoutines_() {
this.getNetworkDiagnosticsElement_().runAllRoutines();
},
/** @private */
onCloseClick_() {
self.close();
},
/** @private */
onRunAllRoutinesClick_() {
this.runAllRoutines_();
},
/**
* Handles requests to open the feedback report dialog. The provided string
* in the event will be sent as a part of the feedback report.
* @private
*/
onSendFeedbackClick_() {
chrome.send('sendFeedbackReport');
},
/** @private */
getShowFeedbackBtn_() {
sendWithPromise('getShowFeedbackButton').then(result => {
this.set('showFeedbackBtn_', result[0]);
});
},
});

96
ash/webui/connectivity_diagnostics/resources/connectivity_diagnostics.ts Normal file

@ -0,0 +1,96 @@
// Copyright 2020 The Chromium Authors
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import 'chrome://resources/ash/common/network_health/network_diagnostics.js';
import 'chrome://resources/ash/common/network_health/network_health_summary.js';
import 'chrome://resources/cr_elements/cr_shared_style.css.js';
import './strings.m.js';
import {NetworkDiagnosticsElement} from 'chrome://resources/ash/common/network_health/network_diagnostics.js';
import {CrContainerShadowMixin} from 'chrome://resources/cr_elements/cr_container_shadow_mixin.js';
import {I18nMixin} from 'chrome://resources/cr_elements/i18n_mixin.js';
import {sendWithPromise} from 'chrome://resources/js/cr.js';
import {PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
import {getTemplate} from './connectivity_diagnostics.html.js';
/**
* @fileoverview
* Polymer element connectivity diagnostics UI.
*/
export interface ConnectivityDiagnosticsElement {
$: {
networkDiagnostics: NetworkDiagnosticsElement,
};
}
const ConnectivityDiagnosticsElementBase =
I18nMixin(CrContainerShadowMixin(PolymerElement));
export class ConnectivityDiagnosticsElement extends
ConnectivityDiagnosticsElementBase {
static get is() {
return 'connectivity-diagnostics';
}
static get template() {
return getTemplate();
}
static get properties() {
return {
/**
* Boolean flag to show the feedback button in the app.
*/
showFeedbackBtn_: {
type: Boolean,
value: false,
},
};
}
private showFeedbackBtn_: boolean;
override connectedCallback() {
super.connectedCallback();
this.getShowFeedbackBtn_();
this.runAllRoutines_();
}
private runAllRoutines_(): void {
this.$.networkDiagnostics.runAllRoutines();
}
private onCloseClick_(): void {
self.close();
}
private onRunAllRoutinesClick_(): void {
this.runAllRoutines_();
}
/**
* Handles requests to open the feedback report dialog. The provided string
* in the event will be sent as a part of the feedback report.
*/
private onSendFeedbackClick_(): void {
chrome.send('sendFeedbackReport');
}
private getShowFeedbackBtn_(): void {
sendWithPromise('getShowFeedbackButton').then(result => {
this.showFeedbackBtn_ = result[0];
});
}
}
declare global {
interface HTMLElementTagNameMap {
'connectivity-diagnostics': ConnectivityDiagnosticsElement;
}
}
customElements.define(
ConnectivityDiagnosticsElement.is, ConnectivityDiagnosticsElement);

20
ash/webui/resources/BUILD.gn

@ -301,26 +301,6 @@ grit("eche_bundle_resources") {
output_dir = "$ash_webui_grit_output_dir"
}
# Resources used by chrome://connectivity-diagnostics
grit("connectivity_diagnostics_resources") {
# These arguments are needed since the grd is generated at build time.
enable_input_discovery_for_gn_analyze = false
conn_diag_gen_dir =
"$root_gen_dir/ash/webui/connectivity_diagnostics/resources"
source = "$conn_diag_gen_dir/connectivity_diagnostics_resources.grd"
deps = [ "//ash/webui/connectivity_diagnostics/resources:build_grd" ]
outputs = [
"connectivity_diagnostics_resources.pak",
"grit/connectivity_diagnostics_resources.h",
"grit/connectivity_diagnostics_resources_map.cc",
"grit/connectivity_diagnostics_resources_map.h",
]
output_dir = "$ash_webui_grit_output_dir"
}
grit("multidevice_debug_resources") {
source =
"//ash/webui/multidevice_debug/resources/multidevice_debug_resources.grd"

2
chrome/browser/ash/BUILD.gn

@ -3973,6 +3973,7 @@ source_set("ash") {
"//ash/style",
"//ash/webui/camera_app_ui:document_scanning",
"//ash/webui/camera_app_ui/resources/strings",
"//ash/webui/connectivity_diagnostics/resources:resources",
"//ash/webui/demo_mode_app_ui",
"//ash/webui/diagnostics_ui",
"//ash/webui/file_manager:constants",
@ -3991,7 +3992,6 @@ source_set("ash") {
"//ash/webui/print_management/resources",
"//ash/webui/projector_app/public/cpp",
"//ash/webui/resources:camera_app_resources",
"//ash/webui/resources:connectivity_diagnostics_resources",
"//ash/webui/resources:demo_mode_app_resources",
"//ash/webui/resources:diagnostics_app_resources",
"//ash/webui/resources:eche_bundle_resources",

1
chrome/browser/resources/chromeos/network_ui/network_ui.js

@ -20,6 +20,7 @@ import './network_metrics_ui.js';
import {I18nBehavior} from 'chrome://resources/ash/common/i18n_behavior.js';
import {loadTimeData} from 'chrome://resources/ash/common/load_time_data.m.js';
import {OncMojo} from 'chrome://resources/ash/common/network/onc_mojo.js';
import {NetworkDiagnosticsElement} from 'chrome://resources/ash/common/network_health/network_diagnostics.js';
import {CrosNetworkConfig, CrosNetworkConfigRemote, StartConnectResult} from 'chrome://resources/mojo/chromeos/services/network_config/public/mojom/cros_network_config.mojom-webui.js';
import {flush, Polymer} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';

2
chrome/chrome_paks.gni

@ -311,6 +311,7 @@ template("chrome_extra_paks") {
"//ash/webui/color_internals/resources:resources",
"//ash/webui/common/resources:resources",
"//ash/webui/common/resources/office_fallback:resources",
"//ash/webui/connectivity_diagnostics/resources:resources",
"//ash/webui/file_manager/resources:file_manager_swa_resources",
"//ash/webui/file_manager/untrusted_resources:file_manager_untrusted_resources",
"//ash/webui/firmware_update_ui/resources:resources",
@ -319,7 +320,6 @@ template("chrome_extra_paks") {
"//ash/webui/personalization_app/resources:resources",
"//ash/webui/print_management/resources:resources",
"//ash/webui/resources:camera_app_resources",
"//ash/webui/resources:connectivity_diagnostics_resources",
"//ash/webui/resources:demo_mode_app_resources",
"//ash/webui/resources:diagnostics_app_resources",
"//ash/webui/resources:eche_app_resources",

1
chrome/test/data/webui/cr_components/chromeos/network_health/network_diagnostics_test.js

@ -6,6 +6,7 @@ import 'chrome://connectivity-diagnostics/strings.m.js';
import 'chrome://resources/ash/common/network_health/network_diagnostics.js';
import {setNetworkDiagnosticsServiceForTesting} from 'chrome://resources/ash/common/network_health/mojo_interface_provider.js';
import {NetworkDiagnosticsElement} from 'chrome://resources/ash/common/network_health/network_diagnostics.js';
import {Icons} from 'chrome://resources/ash/common/network_health/network_diagnostics_types.js';
import {RoutineVerdict} from 'chrome://resources/mojo/chromeos/services/network_health/public/mojom/network_diagnostics.mojom-webui.js';
import {flushTasks} from 'chrome://webui-test/polymer_test_util.js';

2
tools/gritsettings/resource_ids.spec

@ -759,7 +759,7 @@
"META": {"sizes": {"includes": [5]}},
"includes": [5620],
},
"<(SHARED_INTERMEDIATE_DIR)/ash/webui/connectivity_diagnostics/resources/connectivity_diagnostics_resources.grd": {
"<(SHARED_INTERMEDIATE_DIR)/ash/webui/connectivity_diagnostics/resources/resources.grd": {
"META": {"sizes": {"includes": [50],}},
"includes": [5640],
},