diff options
Diffstat (limited to 'devtools/client/performance-new/aboutprofiling')
4 files changed, 198 insertions, 0 deletions
diff --git a/devtools/client/performance-new/aboutprofiling/README.md b/devtools/client/performance-new/aboutprofiling/README.md new file mode 100644 index 0000000000..4055a7cdac --- /dev/null +++ b/devtools/client/performance-new/aboutprofiling/README.md @@ -0,0 +1,3 @@ +# about:profiling + +This directory collects the code that powers about:profiling. See devtools/client/performance-new/README.md for more information. diff --git a/devtools/client/performance-new/aboutprofiling/index.xhtml b/devtools/client/performance-new/aboutprofiling/index.xhtml new file mode 100644 index 0000000000..0968a8f5f5 --- /dev/null +++ b/devtools/client/performance-new/aboutprofiling/index.xhtml @@ -0,0 +1,36 @@ +<!-- This Source Code Form is subject to the terms of the Mozilla Public + - License, v. 2.0. If a copy of the MPL was not distributed with this + - file, You can obtain one at http://mozilla.org/MPL/2.0/. --> +<html xmlns="http://www.w3.org/1999/xhtml" dir=""> + <head> + <meta + http-equiv="Content-Security-Policy" + content="default-src 'none'; style-src chrome: resource:; img-src chrome: resource:; script-src chrome: resource:; object-src 'none'" + /> + <meta name="color-scheme" content="light dark" /> + <link + rel="icon" + type="image/svg+xml" + href="chrome://devtools/skin/images/tool-profiler.svg" + /> + <link + rel="stylesheet" + href="chrome://global/skin/global.css" + type="text/css" + /> + <link + rel="stylesheet" + href="chrome://global/skin/in-content/common.css" + type="text/css" + /> + <link + rel="stylesheet" + href="chrome://devtools/skin/aboutprofiling.css" + type="text/css" + /> + </head> + <body class="theme-body"> + <div id="root"></div> + <script src="chrome://devtools/content/performance-new/aboutprofiling/initializer.js"></script> + </body> +</html> diff --git a/devtools/client/performance-new/aboutprofiling/initializer.js b/devtools/client/performance-new/aboutprofiling/initializer.js new file mode 100644 index 0000000000..8dd854007c --- /dev/null +++ b/devtools/client/performance-new/aboutprofiling/initializer.js @@ -0,0 +1,152 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ +// @ts-check +/** + * @typedef {import("../@types/perf").RecordingSettings} RecordingSettings + * @typedef {import("../@types/perf").PerfFront} PerfFront + * @typedef {import("../@types/perf").PageContext} PageContext + */ +"use strict"; + +/** + * This file initializes the about:profiling page, which can be used to tweak the + * profiler's settings. + */ + +{ + // Create the browser loader, but take care not to conflict with + // TypeScript. See devtools/client/performance-new/typescript.md and + // the section on "Do not overload require" for more information. + + const { BrowserLoader } = ChromeUtils.import( + "resource://devtools/shared/loader/browser-loader.js" + ); + const browserLoader = BrowserLoader({ + baseURI: "resource://devtools/client/performance-new/aboutprofiling", + window, + }); + + /** + * @type {any} - Coerce the current scope into an `any`, and assign the + * loaders to the scope. They can then be used freely below. + */ + const scope = this; + scope.require = browserLoader.require; + scope.loader = browserLoader.loader; +} + +/** + * The background.sys.mjs manages the profiler state, and can be loaded multiple time + * for various components. This page needs a copy, and it is also used by the + * profiler shortcuts. In order to do this, the background code needs to live in a + * JSM module, that can be shared with the DevTools keyboard shortcut manager. + */ +const { presets } = ChromeUtils.importESModule( + "resource://devtools/client/performance-new/shared/background.sys.mjs" +); + +const ReactDOM = require("resource://devtools/client/shared/vendor/react-dom.js"); +const React = require("resource://devtools/client/shared/vendor/react.js"); +const FluentReact = require("resource://devtools/client/shared/vendor/fluent-react.js"); +const { + FluentL10n, +} = require("resource://devtools/client/shared/fluent-l10n/fluent-l10n.js"); +const Provider = React.createFactory( + require("resource://devtools/client/shared/vendor/react-redux.js").Provider +); +const ProfilerPreferenceObserver = React.createFactory( + require("resource://devtools/client/performance-new/components/shared/ProfilerPreferenceObserver.js") +); +const LocalizationProvider = React.createFactory( + FluentReact.LocalizationProvider +); +const AboutProfiling = React.createFactory( + require("resource://devtools/client/performance-new/components/aboutprofiling/AboutProfiling.js") +); +const createStore = require("resource://devtools/client/shared/redux/create-store.js"); +const reducers = require("resource://devtools/client/performance-new/store/reducers.js"); +const actions = require("resource://devtools/client/performance-new/store/actions.js"); + +/** + * Initialize the panel by creating a redux store, and render the root component. + * + * @param {PageContext} pageContext - The context that the UI is being loaded in under. + * @param {boolean} isSupportedPlatform + * @param {string[]} supportedFeatures + * @param {(() => void)} [openRemoteDevTools] Optionally provide a way to go back to + * the remote devtools page. + */ +async function gInit( + pageContext, + isSupportedPlatform, + supportedFeatures, + openRemoteDevTools +) { + const store = createStore(reducers); + + const l10n = new FluentL10n(); + await l10n.init( + [ + "devtools/client/perftools.ftl", + // For -brand-shorter-name used in some profiler preset descriptions. + "branding/brand.ftl", + // Needed for the onboarding UI + "toolkit/branding/brandings.ftl", + ], + { + setAttributesOnDocument: true, + } + ); + + // Do some initialization, especially with privileged things that are part of the + // the browser. + store.dispatch( + actions.initializeStore({ + isSupportedPlatform, + supportedFeatures, + presets, + pageContext, + openRemoteDevTools, + }) + ); + + ReactDOM.render( + Provider( + { store }, + LocalizationProvider( + { bundles: l10n.getBundles() }, + React.createElement( + React.Fragment, + null, + ProfilerPreferenceObserver(), + AboutProfiling() + ) + ) + ), + document.querySelector("#root") + ); + + window.addEventListener("unload", () => gDestroy(), { once: true }); +} + +async function gDestroy() { + // This allows all unregister commands to run. + ReactDOM.unmountComponentAtNode(document.querySelector("#root")); +} + +// Automatically initialize the page if it's not a remote connection, otherwise +// the page will be initialized by about:debugging. +if (window.location.hash !== "#remote") { + document.addEventListener( + "DOMContentLoaded", + () => { + const isSupportedPlatform = "nsIProfiler" in Ci; + const supportedFeatures = isSupportedPlatform + ? Services.profiler.GetFeatures() + : []; + gInit("aboutprofiling", isSupportedPlatform, supportedFeatures); + }, + { once: true } + ); +} diff --git a/devtools/client/performance-new/aboutprofiling/moz.build b/devtools/client/performance-new/aboutprofiling/moz.build new file mode 100644 index 0000000000..958a922236 --- /dev/null +++ b/devtools/client/performance-new/aboutprofiling/moz.build @@ -0,0 +1,7 @@ +# vim: set filetype=python: +# This Source Code Form is subject to the terms of the Mozilla Public +# License, v. 2.0. If a copy of the MPL was not distributed with this +# file, You can obtain one at http://mozilla.org/MPL/2.0/. + +with Files("**"): + BUG_COMPONENT = ("DevTools", "Performance Tools (Profiler/Timeline)") |