Revert "RPP: remove "Disable JS Samples" checkbox"

This reverts commit 682af1f.

Reason for revert: we got feedback that people will often rely on this functionality

Original change's description:
> RPP: remove "Disable JS Samples" checkbox
>
> It's rarely useful to disable samples, and from our metrics we know
> barely anyone ever does.
>
> [email protected]
>
> Fixed: 414734883
> Change-Id: Ib328428e50f8f1571864e5f92a4ec69e252724d3
> Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6494564
> Reviewed-by: Paul Irish <[email protected]>
> Commit-Queue: Jack Franklin <[email protected]>
> Auto-Submit: Jack Franklin <[email protected]>
> Commit-Queue: Paul Irish <[email protected]>

Change-Id: I8b3296b406631e5fe7bee915b28906e4e4c9e518
Bug: 436491188, 414734883
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6850129
Reviewed-by: Connor Clark <[email protected]>
Commit-Queue: Connor Clark <[email protected]>

Author: jackfranklin

front_end/panels/timeline/TimelinePanel.ts

@@ -96,7 +96,11 @@ const UIStrings = {
    */
   dropTimelineFileOrUrlHere: 'Drop trace file or URL here',
   /**
-   * @description Title of capture layers and pictures setting in timeline panel of the performance panel
+   * @description Title of disable capture jsprofile setting in timeline panel of the performance panel
+   */
+  disableJavascriptSamples: 'Disable JavaScript samples',
+  /**
+   *@description Title of capture layers and pictures setting in timeline panel of the performance panel
    */
   enableAdvancedPaint: 'Enable advanced paint instrumentation (slow)',
   /**
@@ -138,6 +142,10 @@ const UIStrings = {
   /**
    * @description Text in Timeline Panel of the Performance panel
    */
+  disablesJavascriptSampling: 'Disables JavaScript sampling, reduces overhead when running against mobile devices',
+  /**
+   *@description Text in Timeline Panel of the Performance panel
+   */
   capturesAdvancedPaint: 'Captures advanced paint instrumentation, introduces significant performance overhead',
   /**
    * @description Text in Timeline Panel of the Performance panel
@@ -174,6 +182,10 @@ const UIStrings = {
   /**
    * @description Text in Timeline Panel of the Performance panel
    */
+  JavascriptSamplingIsDisabled: '- JavaScript sampling is disabled',
+  /**
+   *@description Text in Timeline Panel of the Performance panel
+   */
   stoppingTimeline: 'Stopping timeline…',
   /**
    * @description Text in Timeline Panel of the Performance panel
@@ -322,6 +334,7 @@ export class TimelinePanel extends Common.ObjectWrapper.eventMixin<EventTypes, t
   private readonly toggleRecordAction: UI.ActionRegistration.Action;
   private readonly recordReloadAction: UI.ActionRegistration.Action;
   readonly #historyManager: TimelineHistoryManager;
+  private disableCaptureJSProfileSetting: Common.Settings.Setting<boolean>;
   private readonly captureLayersAndPicturesSetting: Common.Settings.Setting<boolean>;
   private readonly captureSelectorStatsSetting: Common.Settings.Setting<boolean>;
   readonly #thirdPartyTracksSetting: Common.Settings.Setting<boolean>;
@@ -453,6 +466,9 @@ export class TimelinePanel extends Common.ObjectWrapper.eventMixin<EventTypes, t
 
     this.traceLoadStart = null;
 
+    this.disableCaptureJSProfileSetting = Common.Settings.Settings.instance().createSetting(
+        'timeline-disable-js-sampling', false, Common.Settings.SettingStorageType.SESSION);
+    this.disableCaptureJSProfileSetting.setTitle(i18nString(UIStrings.disableJavascriptSamples));
     this.captureLayersAndPicturesSetting = Common.Settings.Settings.instance().createSetting(
         'timeline-capture-layers-and-pictures', false, Common.Settings.SettingStorageType.SESSION);
     this.captureLayersAndPicturesSetting.setTitle(i18nString(UIStrings.enableAdvancedPaint));
@@ -1217,6 +1233,7 @@ export class TimelinePanel extends Common.ObjectWrapper.eventMixin<EventTypes, t
         this);
     SDK.CPUThrottlingManager.CPUThrottlingManager.instance().addEventListener(
         SDK.CPUThrottlingManager.Events.RATE_CHANGED, this.updateShowSettingsToolbarButton, this);
+    this.disableCaptureJSProfileSetting.addChangeListener(this.updateShowSettingsToolbarButton, this);
     this.captureLayersAndPicturesSetting.addChangeListener(this.updateShowSettingsToolbarButton, this);
     this.captureSelectorStatsSetting.addChangeListener(this.updateShowSettingsToolbarButton, this);
 
@@ -1229,16 +1246,20 @@ export class TimelinePanel extends Common.ObjectWrapper.eventMixin<EventTypes, t
     cpuThrottlingPane.append(this.cpuThrottlingSelect.control.element);
 
     this.settingsPane.append(UI.SettingsUI.createSettingCheckbox(
-        this.captureLayersAndPicturesSetting.title(), this.captureLayersAndPicturesSetting,
-        i18nString(UIStrings.capturesAdvancedPaint)));
+        this.captureSelectorStatsSetting.title(), this.captureSelectorStatsSetting,
+        i18nString(UIStrings.capturesSelectorStats)));
 
     const networkThrottlingPane = this.settingsPane.createChild('div');
     networkThrottlingPane.append(i18nString(UIStrings.network));
     networkThrottlingPane.append(this.createNetworkConditionsSelectToolbarItem().element);
 
     this.settingsPane.append(UI.SettingsUI.createSettingCheckbox(
-        this.captureSelectorStatsSetting.title(), this.captureSelectorStatsSetting,
-        i18nString(UIStrings.capturesSelectorStats)));
+        this.captureLayersAndPicturesSetting.title(), this.captureLayersAndPicturesSetting,
+        i18nString(UIStrings.capturesAdvancedPaint)));
+
+    this.settingsPane.append(UI.SettingsUI.createSettingCheckbox(
+        this.disableCaptureJSProfileSetting.title(), this.disableCaptureJSProfileSetting,
+        i18nString(UIStrings.disablesJavascriptSampling)));
 
     const thirdPartyCheckbox =
         this.createSettingCheckbox(this.#thirdPartyTracksSetting, i18nString(UIStrings.showDataAddedByExtensions));
@@ -1627,6 +1648,9 @@ export class TimelinePanel extends Common.ObjectWrapper.eventMixin<EventTypes, t
     if (this.captureSelectorStatsSetting.get()) {
       messages.push(i18nString(UIStrings.SelectorStatsEnabled));
     }
+    if (this.disableCaptureJSProfileSetting.get()) {
+      messages.push(i18nString(UIStrings.JavascriptSamplingIsDisabled));
+    }
 
     this.showSettingsPaneButton.setChecked(messages.length > 0);
     this.showSettingsPaneButton.element.style.setProperty('--dot-toggle-top', '16px');
@@ -1769,7 +1793,7 @@ export class TimelinePanel extends Common.ObjectWrapper.eventMixin<EventTypes, t
         await this.#navigateToAboutBlank();
       }
       const recordingOptions = {
-        enableJSSampling: true,
+        enableJSSampling: !this.disableCaptureJSProfileSetting.get(),
         capturePictures: this.captureLayersAndPicturesSetting.get(),
         captureFilmStrip: this.showScreenshotsSetting.get(),
         captureSelectorStats: this.captureSelectorStatsSetting.get(),

test/e2e/helpers/performance-helpers.ts

@@ -75,6 +75,7 @@ export async function openCaptureSettings(
             [
               veImpression('Toggle', 'timeline-capture-layers-and-pictures'),
               veImpression('Toggle', 'timeline-capture-selector-stats'),
+              veImpression('Toggle', 'timeline-disable-js-sampling'),
               veImpression('DropDown', 'cpu-throttling'),
               veImpression('DropDown', 'active-network-condition-key'),
               veImpression('Toggle', 'timeline-show-extension-data'),