diff --git a/devtools/client/performance-new/components/Settings.js b/devtools/client/performance-new/components/Settings.js index 9dcf8ea269cd..0e993068bf46 100644 --- a/devtools/client/performance-new/components/Settings.js +++ b/devtools/client/performance-new/components/Settings.js @@ -70,6 +70,7 @@ const { h3, section, p, + em, } = require("devtools/client/shared/vendor/react-dom-factories"); const Range = createFactory( require("devtools/client/performance-new/components/Range") @@ -453,6 +454,25 @@ class Settings extends PureComponent { { className: "perf-settings-thread-columns" }, threadColumns.map(this._renderThreadsColumns) ), + div( + { className: "perf-settings-all-threads" }, + label( + { + className: "perf-settings-checkbox-label", + }, + input({ + className: "perf-settings-checkbox", + id: "perf-settings-thread-checkbox-all-threads", + type: "checkbox", + value: "*", + checked: threads.includes("*"), + onChange: this._handleThreadCheckboxChange, + }), + "Bypass selections above and record ", + em(null, "all"), + " registered threads" + ) + ), div( { className: "perf-settings-row" }, label( diff --git a/devtools/client/performance-new/test/chrome/test_perf-settings-threads.html b/devtools/client/performance-new/test/chrome/test_perf-settings-threads.html index 944e1a26e37e..481d7c990e2f 100644 --- a/devtools/client/performance-new/test/chrome/test_perf-settings-threads.html +++ b/devtools/client/performance-new/test/chrome/test_perf-settings-threads.html @@ -78,6 +78,21 @@ is(threadTextEl.value, "GeckoMain,DOM Worker,StyleThread", "Another thread was in the thread text input"); + // Enable profiling of all threads + const allThreadsCheckbox = document.querySelector( + "#perf-settings-thread-checkbox-all-threads"); + allThreadsCheckbox.click(); + is(selectors.getThreads(getState()).join(","), "GeckoMain,DOM Worker,StyleThread,*", + "Asterisk was added") + is(threadTextEl.value, "GeckoMain,DOM Worker,StyleThread,*", + "Asterisk was in the thread text input"); + + // Remove the asterisk + setReactFriendlyInputValue(threadTextEl, "GeckoMain,DOM Worker,StyleThread"); + threadTextEl.dispatchEvent(new Event("blur", { bubbles: true })); + ok(!allThreadsCheckbox.checked, + "The all threads checkbox is not checked."); + // Start the profiler by clicking the start button, and flushing the async // calls out to the mock perf front. document.querySelector("button").click(); diff --git a/devtools/client/themes/perf.css b/devtools/client/themes/perf.css index 47f725bed11a..25143f30c775 100644 --- a/devtools/client/themes/perf.css +++ b/devtools/client/themes/perf.css @@ -231,7 +231,7 @@ } .perf-settings-thread-columns { - margin-bottom: 20px; + margin-bottom: 5px; display: flex; line-height: 2; } @@ -240,6 +240,10 @@ flex: 1; } +.perf-settings-all-threads { + margin-bottom: 14px; +} + .perf-settings-checkbox-label { display: block; }