[DevTools] Update Background Service UI strings.
As per suggestions from UXW, make it clear that recording persists
and continues in the background.
Also make it clear when a metadata field is empty.
Screenshot: https://bugs.chromium.org/p/chromium/issues/detail?id=942174#c34
Change-Id: Ief7b2dc23f00767fe4e87d37b652a4b0dbb1edd2
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1708082
Commit-Queue: Rayan Kanso <[email protected]>
Reviewed-by: Joel Einbinder <[email protected]>
Cr-Original-Commit-Position: refs/heads/master@{#679514}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 02d9fc9da9c40566b18632473985d1d5d0fbc586
diff --git a/front_end/resources/BackgroundServiceView.js b/front_end/resources/BackgroundServiceView.js
index faf77f1..fca3e67 100644
--- a/front_end/resources/BackgroundServiceView.js
+++ b/front_end/resources/BackgroundServiceView.js
@@ -277,28 +277,33 @@
if (this._selectedEventNode) {
this._preview = this._selectedEventNode.createPreview();
- } else if (this._dataGrid.rootNode().children.length) {
+ this._preview.show(this._previewPanel.contentElement);
+ return;
+ }
+
+ this._preview = new UI.VBox();
+ this._preview.contentElement.classList.add('background-service-preview', 'fill');
+ const centered = this._preview.contentElement.createChild('div');
+
+ if (this._dataGrid.rootNode().children.length) {
// Inform users that grid entries are clickable.
- this._preview = new UI.EmptyWidget(ls`Select an entry to view metadata`);
+ centered.createChild('p').textContent = ls`Select an entry to view metadata`;
} else if (this._recordButton.toggled()) {
// Inform users that we are recording/waiting for events.
- this._preview = new UI.EmptyWidget(
- ls`Recording ${Resources.BackgroundServiceView.getUIString(this._serviceName)} activity...`);
+ const featureName = Resources.BackgroundServiceView.getUIString(this._serviceName);
+ centered.createChild('p').textContent = ls`Recording ${featureName} activity...`;
+ centered.createChild('p').textContent =
+ ls`DevTools will record all ${featureName} activity for up to 3 days, even when closed.`;
} else {
- this._preview = new UI.VBox();
- this._preview.contentElement.classList.add('empty-view-scroller');
- const centered = this._preview.contentElement.createChild('div', 'empty-view');
-
const landingRecordButton = UI.Toolbar.createActionButton(this._recordAction);
const recordKey = createElementWithClass('b', 'background-service-shortcut');
recordKey.textContent =
UI.shortcutRegistry.shortcutDescriptorsForAction('background-service.toggle-recording')[0].name;
- centered.createChild('div', 'empty-bold-text')
- .appendChild(UI.formatLocalized(
- 'Click the record button %s or hit %s to start recording.',
- [UI.createInlineButton(landingRecordButton), recordKey]));
+ centered.createChild('p').appendChild(UI.formatLocalized(
+ 'Click the record button %s or hit %s to start recording.',
+ [UI.createInlineButton(landingRecordButton), recordKey]));
}
this._preview.show(this._previewPanel.contentElement);
@@ -355,7 +360,12 @@
for (const entry of this._eventMetadata) {
const div = createElementWithClass('div', 'background-service-metadata-entry');
div.createChild('div', 'background-service-metadata-name').textContent = entry.key + ': ';
- div.createChild('div', 'background-service-metadata-value source-code').textContent = entry.value;
+ if (entry.value) {
+ div.createChild('div', 'background-service-metadata-value source-code').textContent = entry.value;
+ } else {
+ div.createChild('div', 'background-service-metadata-value background-service-empty-value').textContent =
+ ls`empty`;
+ }
preview.element.appendChild(div);
}