diff options
Diffstat (limited to 'devtools/startup')
46 files changed, 3957 insertions, 0 deletions
diff --git a/devtools/startup/AboutDebuggingRegistration.jsm b/devtools/startup/AboutDebuggingRegistration.jsm new file mode 100644 index 0000000000..4228c265df --- /dev/null +++ b/devtools/startup/AboutDebuggingRegistration.jsm @@ -0,0 +1,42 @@ +/* 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/. */ + +"use strict"; + +// Register the about:debugging URL, that allows to debug tabs, extensions, workers on +// the current instance of Firefox or on a remote Firefox. +const { Services } = ChromeUtils.import("resource://gre/modules/Services.jsm"); + +const { nsIAboutModule } = Ci; + +function AboutDebugging() {} + +AboutDebugging.prototype = { + classDescription: "about:debugging", + classID: Components.ID("1060afaf-dc9e-43da-8646-23a2faf48493"), + contractID: "@mozilla.org/network/protocol/about;1?what=debugging", + + QueryInterface: ChromeUtils.generateQI([nsIAboutModule]), + + newChannel: function(_, loadInfo) { + const chan = Services.io.newChannelFromURIWithLoadInfo( + Services.io.newURI("chrome://devtools/content/aboutdebugging/index.html"), + loadInfo + ); + chan.owner = Services.scriptSecurityManager.getSystemPrincipal(); + return chan; + }, + + getURIFlags: function(uri) { + return nsIAboutModule.ALLOW_SCRIPT; + }, + + getChromeURI: function(_uri) { + return Services.io.newURI( + "chrome://devtools/content/aboutdebugging/index.html" + ); + }, +}; + +var EXPORTED_SYMBOLS = ["AboutDebugging"]; diff --git a/devtools/startup/AboutDevToolsToolboxRegistration.jsm b/devtools/startup/AboutDevToolsToolboxRegistration.jsm new file mode 100644 index 0000000000..b68de6d000 --- /dev/null +++ b/devtools/startup/AboutDevToolsToolboxRegistration.jsm @@ -0,0 +1,43 @@ +/* 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/. */ + +"use strict"; + +// Register about:devtools-toolbox which allows to open a devtools toolbox +// in a Firefox tab or a custom html iframe in browser.html + +const { Services } = ChromeUtils.import("resource://gre/modules/Services.jsm"); + +const { nsIAboutModule } = Ci; + +function AboutDevtoolsToolbox() {} + +AboutDevtoolsToolbox.prototype = { + uri: Services.io.newURI("chrome://devtools/content/framework/toolbox.xhtml"), + classDescription: "about:devtools-toolbox", + classID: Components.ID("11342911-3135-45a8-8d71-737a2b0ad469"), + contractID: "@mozilla.org/network/protocol/about;1?what=devtools-toolbox", + + QueryInterface: ChromeUtils.generateQI([nsIAboutModule]), + + newChannel: function(uri, loadInfo) { + const chan = Services.io.newChannelFromURIWithLoadInfo(this.uri, loadInfo); + chan.owner = Services.scriptSecurityManager.getSystemPrincipal(); + return chan; + }, + + getURIFlags: function(uri) { + return ( + nsIAboutModule.ALLOW_SCRIPT | + nsIAboutModule.ENABLE_INDEXED_DB | + nsIAboutModule.HIDE_FROM_ABOUTABOUT + ); + }, + + getChromeURI: function(_uri) { + return this.uri; + }, +}; + +var EXPORTED_SYMBOLS = ["AboutDevtoolsToolbox"]; diff --git a/devtools/startup/DevToolsShim.jsm b/devtools/startup/DevToolsShim.jsm new file mode 100644 index 0000000000..4d14002b3e --- /dev/null +++ b/devtools/startup/DevToolsShim.jsm @@ -0,0 +1,332 @@ +/* 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/. */ + +"use strict"; + +const { Services } = ChromeUtils.import("resource://gre/modules/Services.jsm"); + +const { XPCOMUtils } = ChromeUtils.import( + "resource://gre/modules/XPCOMUtils.jsm" +); +XPCOMUtils.defineLazyGetter(this, "DevtoolsStartup", () => { + return Cc["@mozilla.org/devtools/startup-clh;1"].getService( + Ci.nsICommandLineHandler + ).wrappedJSObject; +}); + +// We don't want to spend time initializing the full loader here so we create +// our own lazy require. +XPCOMUtils.defineLazyGetter(this, "Telemetry", function() { + const { require } = ChromeUtils.import( + "resource://devtools/shared/Loader.jsm" + ); + // eslint-disable-next-line no-shadow + const Telemetry = require("devtools/client/shared/telemetry"); + + return Telemetry; +}); + +const DEVTOOLS_ENABLED_PREF = "devtools.enabled"; +const DEVTOOLS_POLICY_DISABLED_PREF = "devtools.policy.disabled"; + +const EXPORTED_SYMBOLS = ["DevToolsShim"]; + +function removeItem(array, callback) { + const index = array.findIndex(callback); + if (index >= 0) { + array.splice(index, 1); + } +} + +/** + * DevToolsShim is a singleton that provides a set of helpers to interact with DevTools, + * that work whether Devtools are enabled or not. + * + * It can be used to start listening to devtools events before DevTools are ready. As soon + * as DevTools are enabled, the DevToolsShim will forward all the requests received until + * then to the real DevTools instance. + */ +const DevToolsShim = { + _gDevTools: null, + listeners: [], + + get telemetry() { + if (!this._telemetry) { + this._telemetry = new Telemetry(); + this._telemetry.setEventRecordingEnabled(true); + } + return this._telemetry; + }, + + /** + * Returns true if DevTools are enabled for the current profile. If devtools are not + * enabled, initializing DevTools will open the onboarding page. Some entry points + * should no-op in this case. + */ + isEnabled: function() { + const enabled = Services.prefs.getBoolPref(DEVTOOLS_ENABLED_PREF); + return enabled && !this.isDisabledByPolicy(); + }, + + /** + * Returns true if the devtools are completely disabled and can not be enabled. All + * entry points should return without throwing, initDevTools should never be called. + */ + isDisabledByPolicy: function() { + return Services.prefs.getBoolPref(DEVTOOLS_POLICY_DISABLED_PREF, false); + }, + + /** + * Check if DevTools have already been initialized. + * + * @return {Boolean} true if DevTools are initialized. + */ + isInitialized: function() { + return !!this._gDevTools; + }, + + /** + * Returns the array of the existing toolboxes. This method is part of the compatibility + * layer for webextensions. + * + * @return {Array<Toolbox>} + * An array of toolboxes. + */ + getToolboxes: function() { + if (this.isInitialized()) { + return this._gDevTools.getToolboxes(); + } + + return []; + }, + + /** + * Register an instance of gDevTools. Should be called by DevTools during startup. + * + * @param {DevTools} a devtools instance (from client/framework/devtools) + */ + register: function(gDevTools) { + this._gDevTools = gDevTools; + this._onDevToolsRegistered(); + this._gDevTools.emit("devtools-registered"); + }, + + /** + * Unregister the current instance of gDevTools. Should be called by DevTools during + * shutdown. + */ + unregister: function() { + if (this.isInitialized()) { + this._gDevTools.emit("devtools-unregistered"); + this._gDevTools = null; + } + }, + + /** + * The following methods can be called before DevTools are initialized: + * - on + * - off + * + * If DevTools are not initialized when calling the method, DevToolsShim will call the + * appropriate method as soon as a gDevTools instance is registered. + */ + + /** + * This method is used by browser/components/extensions/ext-devtools.js for the events: + * - toolbox-created + * - toolbox-destroyed + */ + on: function(event, listener) { + if (this.isInitialized()) { + this._gDevTools.on(event, listener); + } else { + this.listeners.push([event, listener]); + } + }, + + /** + * This method is currently only used by devtools code, but is kept here for consistency + * with on(). + */ + off: function(event, listener) { + if (this.isInitialized()) { + this._gDevTools.off(event, listener); + } else { + removeItem(this.listeners, ([e, l]) => e === event && l === listener); + } + }, + + /** + * Called from SessionStore.jsm in mozilla-central when saving the current state. + * + * @param {Object} state + * A SessionStore state object that gets modified by reference + */ + saveDevToolsSession: function(state) { + if (!this.isInitialized()) { + return; + } + + this._gDevTools.saveDevToolsSession(state); + }, + + /** + * Called from SessionStore.jsm in mozilla-central when restoring a previous session. + * Will always be called, even if the session does not contain DevTools related items. + */ + restoreDevToolsSession: function(session) { + if (!this.isEnabled()) { + return; + } + + const { browserConsole, browserToolbox } = session; + const hasDevToolsData = browserConsole || browserToolbox; + if (!hasDevToolsData) { + // Do not initialize DevTools unless there is DevTools specific data in the session. + return; + } + + this.initDevTools("SessionRestore"); + this._gDevTools.restoreDevToolsSession(session); + }, + + /** + * Called from nsContextMenu.js in mozilla-central when using the Inspect Accessibility + * context menu item. + * + * @param {XULTab} tab + * The browser tab on which inspect accessibility was used. + * @param {ElementIdentifier} domReference + * Identifier generated by ContentDOMReference. It is a unique pair of + * BrowsingContext ID and a numeric ID. + * @return {Promise} a promise that resolves when the accessible node is selected in the + * accessibility inspector or that resolves immediately if DevTools are not + * enabled. + */ + inspectA11Y: function(tab, domReference) { + if (!this.isEnabled()) { + if (!this.isDisabledByPolicy()) { + DevtoolsStartup.openInstallPage("ContextMenu"); + } + return Promise.resolve(); + } + + // Record the timing at which this event started in order to compute later in + // gDevTools.showToolbox, the complete time it takes to open the toolbox. + // i.e. especially take `DevtoolsStartup.initDevTools` into account. + const startTime = Cu.now(); + + this.initDevTools("ContextMenu"); + + return this._gDevTools.inspectA11Y(tab, domReference, startTime); + }, + + /** + * Called from nsContextMenu.js in mozilla-central when using the Inspect Element + * context menu item. + * + * @param {XULTab} tab + * The browser tab on which inspect node was used. + * @param {ElementIdentifier} domReference + * Identifier generated by ContentDOMReference. It is a unique pair of + * BrowsingContext ID and a numeric ID. + * @return {Promise} a promise that resolves when the node is selected in the inspector + * markup view or that resolves immediately if DevTools are not enabled. + */ + inspectNode: function(tab, domReference) { + if (!this.isEnabled()) { + if (!this.isDisabledByPolicy()) { + DevtoolsStartup.openInstallPage("ContextMenu"); + } + return Promise.resolve(); + } + + // Record the timing at which this event started in order to compute later in + // gDevTools.showToolbox, the complete time it takes to open the toolbox. + // i.e. especially take `DevtoolsStartup.initDevTools` into account. + const startTime = Cu.now(); + + this.initDevTools("ContextMenu"); + + return this._gDevTools.inspectNode(tab, domReference, startTime); + }, + + _onDevToolsRegistered: function() { + // Register all pending event listeners on the real gDevTools object. + for (const [event, listener] of this.listeners) { + this._gDevTools.on(event, listener); + } + + this.listeners = []; + }, + + /** + * Initialize DevTools via DevToolsStartup if needed. This method throws if DevTools are + * not enabled.. If the entry point is supposed to trigger the onboarding, call it + * explicitly via DevtoolsStartup.openInstallPage(). + * + * @param {String} reason + * optional, if provided should be a valid entry point for DEVTOOLS_ENTRY_POINT + * in toolkit/components/telemetry/Histograms.json + */ + initDevTools: function(reason) { + if (!this.isEnabled()) { + throw new Error("DevTools are not enabled and can not be initialized."); + } + + if (reason) { + const window = Services.wm.getMostRecentWindow("navigator:browser"); + + this.telemetry.addEventProperty( + window, + "open", + "tools", + null, + "shortcut", + "" + ); + this.telemetry.addEventProperty( + window, + "open", + "tools", + null, + "entrypoint", + reason + ); + } + + if (!this.isInitialized()) { + DevtoolsStartup.initDevTools(reason); + } + }, +}; + +/** + * Compatibility layer for webextensions. + * + * Those methods are called only after a DevTools webextension was loaded in DevTools, + * therefore DevTools should always be available when they are called. + */ +const webExtensionsMethods = [ + "createDescriptorForTab", + "createWebExtensionInspectedWindowFront", + "getTargetForTab", + "getTheme", + "openBrowserConsole", +]; + +for (const method of webExtensionsMethods) { + DevToolsShim[method] = function() { + if (!this.isEnabled()) { + throw new Error( + "Could not call a DevToolsShim webextension method ('" + + method + + "'): DevTools are not initialized." + ); + } + + this.initDevTools(); + return this._gDevTools[method].apply(this._gDevTools, arguments); + }; +} diff --git a/devtools/startup/DevToolsStartup.jsm b/devtools/startup/DevToolsStartup.jsm new file mode 100644 index 0000000000..2c0525c041 --- /dev/null +++ b/devtools/startup/DevToolsStartup.jsm @@ -0,0 +1,1339 @@ +/* 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/. */ + +/** + * This XPCOM component is loaded very early. + * Be careful to lazy load dependencies as much as possible. + * + * It manages all the possible entry points for DevTools: + * - Handles command line arguments like -jsconsole, + * - Register all key shortcuts, + * - Listen for "Web Developer" system menu opening, under "Tools", + * - Inject the wrench icon in toolbar customization, which is used + * by the "Web Developer" list displayed in the hamburger menu, + * - Register the JSON Viewer protocol handler. + * - Inject the profiler recording button in toolbar customization. + * + * Only once any of these entry point is fired, this module ensures starting + * core modules like 'devtools-browser.js' that hooks the browser windows + * and ensure setting up tools. + **/ + +"use strict"; + +const kDebuggerPrefs = [ + "devtools.debugger.remote-enabled", + "devtools.chrome.enabled", +]; + +const DEVTOOLS_ENABLED_PREF = "devtools.enabled"; +const DEVTOOLS_F12_DISABLED_PREF = "devtools.experiment.f12.shortcut_disabled"; + +const DEVTOOLS_POLICY_DISABLED_PREF = "devtools.policy.disabled"; + +const { XPCOMUtils } = ChromeUtils.import( + "resource://gre/modules/XPCOMUtils.jsm" +); + +ChromeUtils.defineModuleGetter( + this, + "Services", + "resource://gre/modules/Services.jsm" +); +ChromeUtils.defineModuleGetter( + this, + "AppConstants", + "resource://gre/modules/AppConstants.jsm" +); +ChromeUtils.defineModuleGetter( + this, + "CustomizableUI", + "resource:///modules/CustomizableUI.jsm" +); +ChromeUtils.defineModuleGetter( + this, + "CustomizableWidgets", + "resource:///modules/CustomizableWidgets.jsm" +); +ChromeUtils.defineModuleGetter( + this, + "PrivateBrowsingUtils", + "resource://gre/modules/PrivateBrowsingUtils.jsm" +); +ChromeUtils.defineModuleGetter( + this, + "ProfilerMenuButton", + "resource://devtools/client/performance-new/popup/menu-button.jsm.js" +); +ChromeUtils.defineModuleGetter( + this, + "WebChannel", + "resource://gre/modules/WebChannel.jsm" +); +ChromeUtils.defineModuleGetter( + this, + "PanelMultiView", + "resource:///modules/PanelMultiView.jsm" +); + +// We don't want to spend time initializing the full loader here so we create +// our own lazy require. +XPCOMUtils.defineLazyGetter(this, "Telemetry", function() { + const { require } = ChromeUtils.import( + "resource://devtools/shared/Loader.jsm" + ); + // eslint-disable-next-line no-shadow + const Telemetry = require("devtools/client/shared/telemetry"); + + return Telemetry; +}); + +XPCOMUtils.defineLazyGetter(this, "StartupBundle", function() { + const url = "chrome://devtools-startup/locale/startup.properties"; + return Services.strings.createBundle(url); +}); + +XPCOMUtils.defineLazyGetter(this, "KeyShortcutsBundle", function() { + const url = "chrome://devtools-startup/locale/key-shortcuts.properties"; + return Services.strings.createBundle(url); +}); + +/** + * Safely retrieve a localized DevTools key shortcut from KeyShortcutsBundle. + * If the shortcut is not available, this will return null. Consumer code + * should rely on this to skip unavailable shortcuts. + * + * Note that all shortcuts should always be available, but there is a notable + * exception, which is why we have to do this. When a localization change is + * uplifted to beta, language packs will not be updated immediately when the + * updated beta is available. + * + * This means that language pack users might get a new Beta version but will not + * have a language pack with the new strings yet. + */ +function getLocalizedKeyShortcut(id) { + try { + return KeyShortcutsBundle.GetStringFromName(id); + } catch (e) { + console.error("Failed to retrieve DevTools localized shortcut for id", id); + return null; + } +} + +XPCOMUtils.defineLazyGetter(this, "KeyShortcuts", function() { + const isMac = AppConstants.platform == "macosx"; + + // Common modifier shared by most key shortcuts + const modifiers = isMac ? "accel,alt" : "accel,shift"; + + // List of all key shortcuts triggering installation UI + // `id` should match tool's id from client/definitions.js + const shortcuts = [ + // The following keys are also registered in /client/menus.js + // And should be synced. + + // Both are toggling the toolbox on the last selected panel + // or the default one. + { + id: "toggleToolbox", + shortcut: getLocalizedKeyShortcut("toggleToolbox.commandkey"), + modifiers, + }, + // All locales are using F12 + { + id: "toggleToolboxF12", + shortcut: getLocalizedKeyShortcut("toggleToolboxF12.commandkey"), + modifiers: "", // F12 is the only one without modifiers + }, + // Open the Browser Toolbox + { + id: "browserToolbox", + shortcut: getLocalizedKeyShortcut("browserToolbox.commandkey"), + modifiers: "accel,alt,shift", + }, + // Open the Browser Console + { + id: "browserConsole", + shortcut: getLocalizedKeyShortcut("browserConsole.commandkey"), + modifiers: "accel,shift", + }, + // Toggle the Responsive Design Mode + { + id: "responsiveDesignMode", + shortcut: getLocalizedKeyShortcut("responsiveDesignMode.commandkey"), + modifiers, + }, + // The following keys are also registered in /client/definitions.js + // and should be synced. + + // Key for opening the Inspector + { + toolId: "inspector", + shortcut: getLocalizedKeyShortcut("inspector.commandkey"), + modifiers, + }, + // Key for opening the Web Console + { + toolId: "webconsole", + shortcut: getLocalizedKeyShortcut("webconsole.commandkey"), + modifiers, + }, + // Key for opening the Debugger + { + toolId: "jsdebugger", + shortcut: getLocalizedKeyShortcut("jsdebugger.commandkey2"), + modifiers, + }, + // Key for opening the Network Monitor + { + toolId: "netmonitor", + shortcut: getLocalizedKeyShortcut("netmonitor.commandkey"), + modifiers, + }, + // Key for opening the Style Editor + { + toolId: "styleeditor", + shortcut: getLocalizedKeyShortcut("styleeditor.commandkey"), + modifiers: "shift", + }, + // Key for opening the Performance Panel + { + toolId: "performance", + shortcut: getLocalizedKeyShortcut("performance.commandkey"), + modifiers: "shift", + }, + // Key for opening the Storage Panel + { + toolId: "storage", + shortcut: getLocalizedKeyShortcut("storage.commandkey"), + modifiers: "shift", + }, + // Key for opening the DOM Panel + { + toolId: "dom", + shortcut: getLocalizedKeyShortcut("dom.commandkey"), + modifiers, + }, + // Key for opening the Accessibility Panel + { + toolId: "accessibility", + shortcut: getLocalizedKeyShortcut("accessibilityF12.commandkey"), + modifiers: "shift", + }, + ]; + + if (isMac) { + // Add the extra key command for macOS, so you can open the inspector with cmd+shift+C + // like on Chrome DevTools. + shortcuts.push({ + id: "inspectorMac", + toolId: "inspector", + shortcut: getLocalizedKeyShortcut("inspector.commandkey"), + modifiers: "accel,shift", + }); + } + + if (ProfilerMenuButton.isInNavbar()) { + shortcuts.push(...getProfilerKeyShortcuts()); + } + + return shortcuts; +}); + +function getProfilerKeyShortcuts() { + return [ + // Start/stop the profiler + { + id: "profilerStartStop", + shortcut: getLocalizedKeyShortcut("profilerStartStop.commandkey"), + modifiers: "control,shift", + }, + // Capture a profile + { + id: "profilerCapture", + shortcut: getLocalizedKeyShortcut("profilerCapture.commandkey"), + modifiers: "control,shift", + }, + ]; +} + +/** + * Validate the URL that will be used for the WebChannel for the profiler. + * + * @param {string} targetUrl + * @returns {string} + */ +function validateProfilerWebChannelUrl(targetUrl) { + const frontEndUrl = "https://profiler.firefox.com"; + + if (targetUrl !== frontEndUrl) { + // The user can specify either localhost or deploy previews as well as + // the official frontend URL for testing. + if ( + // Allow a test URL. + targetUrl === "http://example.com" || + // Allows the following: + // "http://localhost:4242" + // "http://localhost:4242/" + // "http://localhost:3" + // "http://localhost:334798455" + /^http:\/\/localhost:\d+\/?$/.test(targetUrl) || + // Allows the following: + // "https://deploy-preview-1234--perf-html.netlify.com" + // "https://deploy-preview-1234--perf-html.netlify.com/" + // "https://deploy-preview-1234567--perf-html.netlify.app" + // "https://main--perf-html.netlify.app" + /^https:\/\/(?:deploy-preview-\d+|main)--perf-html\.netlify\.(?:com|app)\/?$/.test( + targetUrl + ) + ) { + // This URL is one of the allowed ones to be used for configuration. + return targetUrl; + } + + console.error( + `The preference "devtools.performance.recording.ui-base-url" was set to a ` + + "URL that is not allowed. No WebChannel messages will be sent between the " + + `browser and that URL. Falling back to ${frontEndUrl}. Only localhost ` + + "and deploy previews URLs are allowed.", + targetUrl + ); + } + + return frontEndUrl; +} + +XPCOMUtils.defineLazyGetter(this, "ProfilerPopupBackground", function() { + return ChromeUtils.import( + "resource://devtools/client/performance-new/popup/background.jsm.js" + ); +}); + +function DevToolsStartup() { + this.onEnabledPrefChanged = this.onEnabledPrefChanged.bind(this); + this.onWindowReady = this.onWindowReady.bind(this); + this.toggleProfilerKeyShortcuts = this.toggleProfilerKeyShortcuts.bind(this); +} + +DevToolsStartup.prototype = { + /** + * Boolean flag to check if DevTools have been already initialized or not. + * By initialized, we mean that its main modules are loaded. + */ + initialized: false, + + /** + * Boolean flag to check if the devtools initialization was already sent to telemetry. + * We only want to record one devtools entry point per Firefox run, but we are not + * interested in all the entry points. + */ + recorded: false, + + get telemetry() { + if (!this._telemetry) { + this._telemetry = new Telemetry(); + this._telemetry.setEventRecordingEnabled(true); + } + return this._telemetry; + }, + + /** + * Flag that indicates if the developer toggle was already added to customizableUI. + */ + developerToggleCreated: false, + + /** + * Flag that indicates if the profiler recording popup was already added to + * customizableUI. + */ + profilerRecordingButtonCreated: false, + + isDisabledByPolicy: function() { + return Services.prefs.getBoolPref(DEVTOOLS_POLICY_DISABLED_PREF, false); + }, + + handle: function(cmdLine) { + const flags = this.readCommandLineFlags(cmdLine); + + // handle() can be called after browser startup (e.g. opening links from other apps). + const isInitialLaunch = + cmdLine.state == Ci.nsICommandLine.STATE_INITIAL_LAUNCH; + if (isInitialLaunch) { + // Enable devtools for all users on startup (onboarding experiment from Bug 1408969 + // is over). + Services.prefs.setBoolPref(DEVTOOLS_ENABLED_PREF, true); + + // The F12 shortcut might be disabled to avoid accidental usage. + // Users who are already considered as devtools users should not be + // impacted. + if (this.isDevToolsUser()) { + Services.prefs.setBoolPref(DEVTOOLS_F12_DISABLED_PREF, false); + } + + // Store devtoolsFlag to check it later in onWindowReady. + this.devtoolsFlag = flags.devtools; + + /* eslint-disable mozilla/balanced-observers */ + // We are not expecting to remove those listeners until Firefox closes. + + // Only top level Firefox Windows fire a browser-delayed-startup-finished event + Services.obs.addObserver( + this.onWindowReady, + "browser-delayed-startup-finished" + ); + + // Update menu items when devtools.enabled changes. + Services.prefs.addObserver( + DEVTOOLS_ENABLED_PREF, + this.onEnabledPrefChanged + ); + /* eslint-enable mozilla/balanced-observers */ + + if (!this.isDisabledByPolicy()) { + if (AppConstants.MOZ_DEV_EDITION) { + // On DevEdition, the developer toggle is displayed by default in the navbar + // area and should be created before the first paint. + this.hookDeveloperToggle(); + } + + this.hookProfilerRecordingButton(); + } + } + + if (flags.console) { + this.commandLine = true; + this.handleConsoleFlag(cmdLine); + } + if (flags.debugger) { + this.commandLine = true; + const binaryPath = + typeof flags.debugger == "string" ? flags.debugger : null; + this.handleDebuggerFlag(cmdLine, binaryPath); + } + + if (flags.devToolsServer) { + this.handleDevToolsServerFlag(cmdLine, flags.devToolsServer); + } + }, + + readCommandLineFlags(cmdLine) { + // All command line flags are disabled if DevTools are disabled by policy. + if (this.isDisabledByPolicy()) { + return { + console: false, + debugger: false, + devtools: false, + devToolsServer: false, + }; + } + + const console = cmdLine.handleFlag("jsconsole", false); + const devtools = cmdLine.handleFlag("devtools", false); + + let devToolsServer; + try { + devToolsServer = cmdLine.handleFlagWithParam( + "start-debugger-server", + false + ); + } catch (e) { + // We get an error if the option is given but not followed by a value. + // By catching and trying again, the value is effectively optional. + devToolsServer = cmdLine.handleFlag("start-debugger-server", false); + } + + let debuggerFlag; + try { + debuggerFlag = cmdLine.handleFlagWithParam("jsdebugger", false); + } catch (e) { + // We get an error if the option is given but not followed by a value. + // By catching and trying again, the value is effectively optional. + debuggerFlag = cmdLine.handleFlag("jsdebugger", false); + } + + return { console, debugger: debuggerFlag, devtools, devToolsServer }; + }, + + /** + * Called when receiving the "browser-delayed-startup-finished" event for a new + * top-level window. + */ + onWindowReady(window) { + if (this.isDisabledByPolicy()) { + this.removeDevToolsMenus(window); + return; + } + + this.hookWindow(window); + + // This listener is called for all Firefox windows, but we want to execute some code + // only once. + if (!this._firstWindowReadyReceived) { + this.onFirstWindowReady(window); + this._firstWindowReadyReceived = true; + } + + JsonView.initialize(); + }, + + removeDevToolsMenus(window) { + // This will hide the "Tools > Web Developer" menu. + window.document + .getElementById("webDeveloperMenu") + .setAttribute("hidden", "true"); + // This will hide the "Web Developer" item in the hamburger menu. + PanelMultiView.getViewNode( + window.document, + "appMenu-developer-button" + ).setAttribute("hidden", "true"); + }, + + onFirstWindowReady(window) { + if (this.devtoolsFlag) { + this.handleDevToolsFlag(window); + + // In the case of the --jsconsole and --jsdebugger command line parameters + // there was no browser window when they were processed so we act on the + // this.commandline flag instead. + if (this.commandLine) { + this.sendEntryPointTelemetry("CommandLine"); + } + } + }, + + /** + * Register listeners to all possible entry points for Developer Tools. + * But instead of implementing the actual actions, defer to DevTools codebase. + * In most cases, it only needs to call this.initDevTools which handles the rest. + * We do that to prevent loading any DevTools module until the user intent to use them. + */ + hookWindow(window) { + // Key Shortcuts need to be added on all the created windows. + this.hookKeyShortcuts(window); + + // In some situations (e.g. starting Firefox with --jsconsole) DevTools will be + // initialized before the first browser-delayed-startup-finished event is received. + // We use a dedicated flag because we still need to hook the developer toggle. + this.hookDeveloperToggle(); + this.hookProfilerRecordingButton(); + + // The developer menu hook only needs to be added if devtools have not been + // initialized yet. + if (!this.initialized) { + this.hookWebDeveloperMenu(window); + } + + this.createDevToolsEnableMenuItem(window); + this.updateDevToolsMenuItems(window); + }, + + /** + * Dynamically register a wrench icon in the customization menu. + * You can use this button by right clicking on Firefox toolbar + * and dragging it from the customization panel to the toolbar. + * (i.e. this isn't displayed by default to users!) + * + * _But_, the "Web Developer" entry in the hamburger menu (the menu with + * 3 horizontal lines), is using this "developer-button" view to populate + * its menu. So we have to register this button for the menu to work. + * + * Also, this menu duplicates its own entries from the "Web Developer" + * menu in the system menu, under "Tools" main menu item. The system + * menu is being hooked by "hookWebDeveloperMenu" which ends up calling + * devtools/client/framework/browser-menus to create the items for real, + * initDevTools, from onViewShowing is also calling browser-menu. + */ + hookDeveloperToggle() { + if (this.developerToggleCreated) { + return; + } + + const id = "developer-button"; + const widget = CustomizableUI.getWidget(id); + if (widget && widget.provider == CustomizableUI.PROVIDER_API) { + return; + } + const item = { + id: id, + type: "view", + viewId: "PanelUI-developer", + shortcutId: "key_toggleToolbox", + tooltiptext: "developer-button.tooltiptext2", + onViewShowing: event => { + if (Services.prefs.getBoolPref(DEVTOOLS_ENABLED_PREF)) { + // If DevTools are enabled, initialize DevTools to create all menuitems in the + // system menu before trying to copy them. + this.initDevTools("HamburgerMenu"); + } + + // Populate the subview with whatever menuitems are in the developer + // menu. We skip menu elements, because the menu panel has no way + // of dealing with those right now. + const doc = event.target.ownerDocument; + + const menu = doc.getElementById("menuWebDeveloperPopup"); + + const itemsToDisplay = [...menu.children]; + // Hardcode the addition of the "work offline" menuitem at the bottom: + itemsToDisplay.push({ + localName: "menuseparator", + getAttribute: () => {}, + }); + itemsToDisplay.push(doc.getElementById("goOfflineMenuitem")); + + const developerItems = PanelMultiView.getViewNode( + doc, + "PanelUI-developerItems" + ); + CustomizableUI.clearSubview(developerItems); + CustomizableUI.fillSubviewFromMenuItems(itemsToDisplay, developerItems); + }, + onInit(anchor) { + // Since onBeforeCreated already bails out when initialized, we can call + // it right away. + this.onBeforeCreated(anchor.ownerDocument); + }, + onBeforeCreated: doc => { + // The developer toggle needs the "key_toggleToolbox" <key> element. + // In DEV EDITION, the toggle is added before 1st paint and hookKeyShortcuts() is + // not called yet when CustomizableUI creates the widget. + this.hookKeyShortcuts(doc.defaultView); + + if (PanelMultiView.getViewNode(doc, "PanelUI-developerItems")) { + return; + } + const view = doc.createXULElement("panelview"); + view.id = "PanelUI-developerItems"; + const panel = doc.createXULElement("vbox"); + panel.setAttribute("class", "panel-subview-body"); + view.appendChild(panel); + doc.getElementById("PanelUI-multiView").appendChild(view); + }, + }; + CustomizableUI.createWidget(item); + CustomizableWidgets.push(item); + + this.developerToggleCreated = true; + }, + + /** + * Register the profiler recording button. This button will be available + * in the customization palette for the Firefox toolbar. In addition, it can be + * enabled from profiler.firefox.com. + */ + hookProfilerRecordingButton() { + if (this.profilerRecordingButtonCreated) { + return; + } + const featureFlagPref = "devtools.performance.popup.feature-flag"; + const isPopupFeatureFlagEnabled = Services.prefs.getBoolPref( + featureFlagPref + ); + this.profilerRecordingButtonCreated = true; + + // Listen for messages from the front-end. This needs to happen even if the + // button isn't enabled yet. This will allow the front-end to turn on the + // popup for our users, regardless of if the feature is enabled by default. + this.initializeProfilerWebChannel(); + + if (isPopupFeatureFlagEnabled) { + // Initialize the CustomizableUI widget. + ProfilerMenuButton.initialize(this.toggleProfilerKeyShortcuts); + } else { + // The feature flag is not enabled, but watch for it to be enabled. If it is, + // initialize everything. + const enable = () => { + ProfilerMenuButton.initialize(this.toggleProfilerKeyShortcuts); + Services.prefs.removeObserver(featureFlagPref, enable); + }; + Services.prefs.addObserver(featureFlagPref, enable); + } + }, + + /** + * Initialize the WebChannel for profiler.firefox.com. This function happens at + * startup, so care should be taken to minimize its performance impact. The WebChannel + * is a mechanism that is used to communicate between the browser, and front-end code. + */ + initializeProfilerWebChannel() { + let channel; + + // Register a channel for the URL in preferences. Also update the WebChannel if + // the URL changes. + const urlPref = "devtools.performance.recording.ui-base-url"; + + // This method is only run once per Firefox instance, so it should not be + // strictly necessary to remove observers here. + // eslint-disable-next-line mozilla/balanced-observers + Services.prefs.addObserver(urlPref, registerWebChannel); + + registerWebChannel(); + + function registerWebChannel() { + if (channel) { + channel.stopListening(); + } + + const urlForWebChannel = Services.io.newURI( + validateProfilerWebChannelUrl(Services.prefs.getStringPref(urlPref)) + ); + + channel = new WebChannel("profiler.firefox.com", urlForWebChannel); + + channel.listen((id, message, target) => { + // Defer loading the ProfilerPopupBackground script until it's absolutely needed, + // as this code path gets loaded at startup. + ProfilerPopupBackground.handleWebChannelMessage( + channel, + id, + message, + target + ); + }); + } + }, + + /* + * We listen to the "Web Developer" system menu, which is under "Tools" main item. + * This menu item is hardcoded empty in Firefox UI. We listen for its opening to + * populate it lazily. Loading main DevTools module is going to populate it. + */ + hookWebDeveloperMenu(window) { + const menu = window.document.getElementById("webDeveloperMenu"); + const onPopupShowing = () => { + if (!Services.prefs.getBoolPref(DEVTOOLS_ENABLED_PREF)) { + return; + } + menu.removeEventListener("popupshowing", onPopupShowing); + this.initDevTools("SystemMenu"); + }; + menu.addEventListener("popupshowing", onPopupShowing); + }, + + /** + * Create a new menu item to enable DevTools and insert it DevTools's submenu in the + * System Menu. + */ + createDevToolsEnableMenuItem(window) { + const { document } = window; + + // Create the menu item. + const item = document.createXULElement("menuitem"); + item.id = "enableDeveloperTools"; + item.setAttribute( + "label", + StartupBundle.GetStringFromName("enableDevTools.label") + ); + item.setAttribute( + "accesskey", + StartupBundle.GetStringFromName("enableDevTools.accesskey") + ); + + // The menu item should open the install page for DevTools. + item.addEventListener("command", () => { + this.openInstallPage("SystemMenu"); + }); + + // Insert the menu item in the DevTools submenu. + const systemMenuItem = document.getElementById("menuWebDeveloperPopup"); + systemMenuItem.appendChild(item); + }, + + /** + * Update the visibility the menu item to enable DevTools. + */ + updateDevToolsMenuItems(window) { + const item = window.document.getElementById("enableDeveloperTools"); + item.hidden = Services.prefs.getBoolPref(DEVTOOLS_ENABLED_PREF); + }, + + /** + * Loop on all windows and update the hidden attribute of the "enable DevTools" menu + * item. + */ + onEnabledPrefChanged() { + for (const window of Services.wm.getEnumerator("navigator:browser")) { + if (window.gBrowserInit && window.gBrowserInit.delayedStartupFinished) { + this.updateDevToolsMenuItems(window); + } + } + }, + + /** + * Check if the user is a DevTools user by looking at our selfxss pref. + * This preference is incremented everytime the console is used (up to 5). + * + * @return {Boolean} true if the user can be considered as a devtools user. + */ + isDevToolsUser() { + const selfXssCount = Services.prefs.getIntPref("devtools.selfxss.count", 0); + return selfXssCount > 0; + }, + + hookKeyShortcuts(window) { + const doc = window.document; + + // hookKeyShortcuts can be called both from hookWindow and from the developer toggle + // onBeforeCreated. Make sure shortcuts are only added once per window. + if (doc.getElementById("devtoolsKeyset")) { + return; + } + + const keyset = doc.createXULElement("keyset"); + keyset.setAttribute("id", "devtoolsKeyset"); + + this.attachKeys(doc, KeyShortcuts, keyset); + + // Appending a <key> element is not always enough. The <keyset> needs + // to be detached and reattached to make sure the <key> is taken into + // account (see bug 832984). + const mainKeyset = doc.getElementById("mainKeyset"); + mainKeyset.parentNode.insertBefore(keyset, mainKeyset); + }, + + /** + * This method attaches on the key elements to the devtools keyset. + */ + attachKeys(doc, keyShortcuts, keyset = doc.getElementById("devtoolsKeyset")) { + const window = doc.defaultView; + for (const key of keyShortcuts) { + if (!key.shortcut) { + // Shortcuts might be missing when a user relies on a language packs + // which is missing a recently uplifted shortcut. Language packs are + // typically updated a few days after a code uplift. + continue; + } + const xulKey = this.createKey(doc, key, () => this.onKey(window, key)); + keyset.appendChild(xulKey); + } + }, + + /** + * This method removes keys from the devtools keyset. + */ + removeKeys(doc, keyShortcuts) { + for (const key of keyShortcuts) { + const keyElement = doc.getElementById(this.getKeyElementId(key)); + if (keyElement) { + keyElement.remove(); + } + } + }, + + /** + * We only want to have the keyboard shortcuts active when the menu button is on. + * This function either adds or removes the elements. + * @param {boolean} isEnabled + */ + toggleProfilerKeyShortcuts(isEnabled) { + const profilerKeyShortcuts = getProfilerKeyShortcuts(); + for (const { document } of Services.wm.getEnumerator(null)) { + const devtoolsKeyset = document.getElementById("devtoolsKeyset"); + const mainKeyset = document.getElementById("mainKeyset"); + + if (!devtoolsKeyset || !mainKeyset) { + // There may not be devtools keyset on this window. + continue; + } + + const areProfilerKeysPresent = !!document.getElementById( + "key_profilerStartStop" + ); + if (isEnabled === areProfilerKeysPresent) { + // Don't double add or double remove the shortcuts. + continue; + } + if (isEnabled) { + this.attachKeys(document, profilerKeyShortcuts); + } else { + this.removeKeys(document, profilerKeyShortcuts); + } + // Appending a <key> element is not always enough. The <keyset> needs + // to be detached and reattached to make sure the <key> is taken into + // account (see bug 832984). + mainKeyset.parentNode.insertBefore(devtoolsKeyset, mainKeyset); + } + }, + + async onKey(window, key) { + try { + // The profiler doesn't care if DevTools is loaded, so provide a quick check + // first to bail out of checking if DevTools is available. + switch (key.id) { + case "profilerStartStop": { + ProfilerPopupBackground.toggleProfiler("aboutprofiling"); + return; + } + case "profilerCapture": { + ProfilerPopupBackground.captureProfile("aboutprofiling"); + return; + } + } + if (!Services.prefs.getBoolPref(DEVTOOLS_ENABLED_PREF)) { + const id = key.toolId || key.id; + this.openInstallPage("KeyShortcut", id); + } else { + // Record the timing at which this event started in order to compute later in + // gDevTools.showToolbox, the complete time it takes to open the toolbox. + // i.e. especially take `initDevTools` into account. + const startTime = Cu.now(); + const require = this.initDevTools("KeyShortcut", key); + const { + gDevToolsBrowser, + } = require("devtools/client/framework/devtools-browser"); + await gDevToolsBrowser.onKeyShortcut(window, key, startTime); + } + } catch (e) { + console.error(`Exception while trigerring key ${key}: ${e}\n${e.stack}`); + } + }, + + getKeyElementId({ id, toolId }) { + return "key_" + (id || toolId); + }, + + // Create a <xul:key> DOM Element + createKey(doc, key, oncommand) { + const { shortcut, modifiers: mod } = key; + const k = doc.createXULElement("key"); + k.id = this.getKeyElementId(key); + + if (shortcut.startsWith("VK_")) { + k.setAttribute("keycode", shortcut); + if (shortcut.match(/^VK_\d$/)) { + // Add the event keydown attribute to ensure that shortcuts work for combinations + // such as ctrl shift 1. + k.setAttribute("event", "keydown"); + } + } else { + k.setAttribute("key", shortcut); + } + + if (mod) { + k.setAttribute("modifiers", mod); + } + + // Bug 371900: command event is fired only if "oncommand" attribute is set. + k.setAttribute("oncommand", ";"); + k.addEventListener("command", oncommand); + + return k; + }, + + initDevTools: function(reason, key = "") { + // If an entry point is fired and tools are not enabled open the installation page + if (!Services.prefs.getBoolPref(DEVTOOLS_ENABLED_PREF)) { + this.openInstallPage(reason); + return null; + } + + // In the case of the --jsconsole and --jsdebugger command line parameters + // there is no browser window yet so we don't send any telemetry yet. + if (reason !== "CommandLine") { + this.sendEntryPointTelemetry(reason, key); + } + + this.initialized = true; + const { require } = ChromeUtils.import( + "resource://devtools/shared/Loader.jsm" + ); + // Ensure loading main devtools module that hooks up into browser UI + // and initialize all devtools machinery. + require("devtools/client/framework/devtools-browser"); + return require; + }, + + /** + * Open about:devtools to start the onboarding flow. + * + * @param {String} reason + * One of "KeyShortcut", "SystemMenu", "HamburgerMenu", "ContextMenu", + * "CommandLine". + * @param {String} keyId + * Optional. If the onboarding flow was triggered by a keyboard shortcut, pass + * the shortcut key id (or toolId) to about:devtools. + */ + openInstallPage: function(reason, keyId) { + // If DevTools are completely disabled, bail out here as this might be called directly + // from other files. + if (this.isDisabledByPolicy()) { + return; + } + + const { gBrowser } = Services.wm.getMostRecentWindow("navigator:browser"); + + // Focus about:devtools tab if there is already one opened in the current window. + for (const tab of gBrowser.tabs) { + const browser = tab.linkedBrowser; + // browser.documentURI might be undefined if the browser tab is still loading. + const location = browser.documentURI ? browser.documentURI.spec : ""; + if ( + location.startsWith("about:devtools") && + !location.startsWith("about:devtools-toolbox") + ) { + // Focus the existing about:devtools tab and bail out. + gBrowser.selectedTab = tab; + return; + } + } + + let url = "about:devtools"; + + const params = []; + if (reason) { + params.push("reason=" + encodeURIComponent(reason)); + } + + const selectedBrowser = gBrowser.selectedBrowser; + if (selectedBrowser) { + params.push("tabid=" + selectedBrowser.outerWindowID); + } + + if (keyId) { + params.push("keyid=" + keyId); + } + + if (params.length > 0) { + url += "?" + params.join("&"); + } + + // Set relatedToCurrent: true to open the tab next to the current one. + gBrowser.selectedTab = gBrowser.addTrustedTab(url, { + relatedToCurrent: true, + }); + }, + + handleConsoleFlag: function(cmdLine) { + const window = Services.wm.getMostRecentWindow("devtools:webconsole"); + if (!window) { + const require = this.initDevTools("CommandLine"); + const { + BrowserConsoleManager, + } = require("devtools/client/webconsole/browser-console-manager"); + BrowserConsoleManager.toggleBrowserConsole().catch(console.error); + } else { + // the Browser Console was already open + window.focus(); + } + + if (cmdLine.state == Ci.nsICommandLine.STATE_REMOTE_AUTO) { + cmdLine.preventDefault = true; + } + }, + + // Open the toolbox on the selected tab once the browser starts up. + handleDevToolsFlag: async function(window) { + const require = this.initDevTools("CommandLine"); + const { gDevTools } = require("devtools/client/framework/devtools"); + const { TargetFactory } = require("devtools/client/framework/target"); + const target = await TargetFactory.forTab(window.gBrowser.selectedTab); + gDevTools.showToolbox(target); + }, + + _isRemoteDebuggingEnabled() { + let remoteDebuggingEnabled = false; + try { + remoteDebuggingEnabled = kDebuggerPrefs.every(pref => { + return Services.prefs.getBoolPref(pref); + }); + } catch (ex) { + console.error(ex); + return false; + } + if (!remoteDebuggingEnabled) { + const errorMsg = + "Could not run chrome debugger! You need the following " + + "prefs to be set to true: " + + kDebuggerPrefs.join(", "); + console.error(new Error(errorMsg)); + // Dump as well, as we're doing this from a commandline, make sure people + // don't miss it: + dump(errorMsg + "\n"); + } + return remoteDebuggingEnabled; + }, + + handleDebuggerFlag: function(cmdLine, binaryPath) { + if (!this._isRemoteDebuggingEnabled()) { + return; + } + + let devtoolsThreadResumed = false; + const pauseOnStartup = cmdLine.handleFlag("wait-for-jsdebugger", false); + if (pauseOnStartup) { + const observe = function(subject, topic, data) { + devtoolsThreadResumed = true; + Services.obs.removeObserver(observe, "devtools-thread-ready"); + }; + Services.obs.addObserver(observe, "devtools-thread-ready"); + } + + const { BrowserToolboxLauncher } = ChromeUtils.import( + "resource://devtools/client/framework/browser-toolbox/Launcher.jsm" + ); + BrowserToolboxLauncher.init(null, null, null, binaryPath); + + if (pauseOnStartup) { + // Spin the event loop until the debugger connects. + const tm = Cc["@mozilla.org/thread-manager;1"].getService(); + tm.spinEventLoopUntil(() => { + return devtoolsThreadResumed; + }); + } + + if (cmdLine.state == Ci.nsICommandLine.STATE_REMOTE_AUTO) { + cmdLine.preventDefault = true; + } + }, + + /** + * Handle the --start-debugger-server command line flag. The options are: + * --start-debugger-server + * The portOrPath parameter is boolean true in this case. Reads and uses the defaults + * from devtools.debugger.remote-port and devtools.debugger.remote-websocket prefs. + * The default values of these prefs are port 6000, WebSocket disabled. + * + * --start-debugger-server 6789 + * Start the non-WebSocket server on port 6789. + * + * --start-debugger-server /path/to/filename + * Start the server on a Unix domain socket. + * + * --start-debugger-server ws:6789 + * Start the WebSocket server on port 6789. + * + * --start-debugger-server ws: + * Start the WebSocket server on the default port (taken from d.d.remote-port) + */ + handleDevToolsServerFlag: function(cmdLine, portOrPath) { + if (!this._isRemoteDebuggingEnabled()) { + return; + } + + let webSocket = false; + const defaultPort = Services.prefs.getIntPref( + "devtools.debugger.remote-port" + ); + if (portOrPath === true) { + // Default to pref values if no values given on command line + webSocket = Services.prefs.getBoolPref( + "devtools.debugger.remote-websocket" + ); + portOrPath = defaultPort; + } else if (portOrPath.startsWith("ws:")) { + webSocket = true; + const port = portOrPath.slice(3); + portOrPath = Number(port) ? port : defaultPort; + } + + const { DevToolsLoader } = ChromeUtils.import( + "resource://devtools/shared/Loader.jsm" + ); + + try { + // Create a separate loader instance, so that we can be sure to receive + // a separate instance of the DebuggingServer from the rest of the + // devtools. This allows us to safely use the tools against even the + // actors and DebuggingServer itself, especially since we can mark + // serverLoader as invisible to the debugger (unlike the usual loader + // settings). + const serverLoader = new DevToolsLoader({ + invisibleToDebugger: true, + }); + const { DevToolsServer: devToolsServer } = serverLoader.require( + "devtools/server/devtools-server" + ); + const { SocketListener } = serverLoader.require( + "devtools/shared/security/socket" + ); + devToolsServer.init(); + devToolsServer.registerAllActors(); + devToolsServer.allowChromeProcess = true; + const socketOptions = { portOrPath, webSocket }; + + const listener = new SocketListener(devToolsServer, socketOptions); + listener.open(); + dump("Started devtools server on " + portOrPath + "\n"); + } catch (e) { + dump("Unable to start devtools server on " + portOrPath + ": " + e); + } + + if (cmdLine.state == Ci.nsICommandLine.STATE_REMOTE_AUTO) { + cmdLine.preventDefault = true; + } + }, + + /** + * Send entry point telemetry explaining how the devtools were launched. This + * functionality also lives inside `devtools/client/framework/browser-menus.js` + * because this codepath is only used the first time a toolbox is opened for a + * tab. + * + * @param {String} reason + * One of "KeyShortcut", "SystemMenu", "HamburgerMenu", "ContextMenu", + * "CommandLine". + * @param {String} key + * The key used by a key shortcut. + */ + sendEntryPointTelemetry(reason, key = "") { + if (!reason) { + return; + } + + let keys = ""; + + if (reason === "KeyShortcut") { + let { modifiers, shortcut } = key; + + modifiers = modifiers.replace(",", "+"); + + if (shortcut.startsWith("VK_")) { + shortcut = shortcut.substr(3); + } + + keys = `${modifiers}+${shortcut}`; + } + + const window = Services.wm.getMostRecentWindow("navigator:browser"); + + this.telemetry.addEventProperty( + window, + "open", + "tools", + null, + "shortcut", + keys + ); + this.telemetry.addEventProperty( + window, + "open", + "tools", + null, + "entrypoint", + reason + ); + + if (this.recorded) { + return; + } + + // Only save the first call for each firefox run as next call + // won't necessarely start the tool. For example key shortcuts may + // only change the currently selected tool. + try { + this.telemetry.getHistogramById("DEVTOOLS_ENTRY_POINT").add(reason); + } catch (e) { + dump("DevTools telemetry entry point failed: " + e + "\n"); + } + this.recorded = true; + }, + + // Used by tests and the toolbox to register the same key shortcuts in toolboxes loaded + // in a window window. + get KeyShortcuts() { + return KeyShortcuts; + }, + get wrappedJSObject() { + return this; + }, + + /* eslint-disable max-len */ + helpInfo: + " --jsconsole Open the Browser Console.\n" + + " --jsdebugger [<path>] Open the Browser Toolbox. Defaults to the local build\n" + + " but can be overridden by a firefox path.\n" + + " --wait-for-jsdebugger Spin event loop until JS debugger connects.\n" + + " Enables debugging (some) application startup code paths.\n" + + " Only has an effect when `--jsdebugger` is also supplied.\n" + + " --devtools Open DevTools on initial load.\n" + + " --start-debugger-server [ws:][ <port> | <path> ] Start the devtools server on\n" + + " a TCP port or Unix domain socket path. Defaults to TCP port\n" + + " 6000. Use WebSocket protocol if ws: prefix is specified.\n", + /* eslint-disable max-len */ + + classID: Components.ID("{9e9a9283-0ce9-4e4a-8f1c-ba129a032c32}"), + QueryInterface: ChromeUtils.generateQI(["nsICommandLineHandler"]), +}; + +/** + * Singleton object that represents the JSON View in-content tool. + * It has the same lifetime as the browser. + */ +const JsonView = { + initialized: false, + + initialize: function() { + // Prevent loading the frame script multiple times if we call this more than once. + if (this.initialized) { + return; + } + this.initialized = true; + + // Register for messages coming from the child process. + // This is never removed as there is no particular need to unregister + // it during shutdown. + Services.mm.addMessageListener("devtools:jsonview:save", this.onSave); + }, + + // Message handlers for events from child processes + + /** + * Save JSON to a file needs to be implemented here + * in the parent process. + */ + onSave: function(message) { + const browser = message.target; + const chrome = browser.ownerGlobal; + if (message.data === null) { + // Save original contents + chrome.saveBrowser(browser); + } else { + if ( + !message.data.startsWith("blob:null") || + !browser.contentPrincipal.isNullPrincipal + ) { + Cu.reportError("Got invalid request to save JSON data"); + return; + } + // The following code emulates saveBrowser, but: + // - Uses the given blob URL containing the custom contents to save. + // - Obtains the file name from the URL of the document, not the blob. + // - avoids passing the document and explicitly passes system principal. + // We have a blob created by a null principal to save, and the null + // principal is from the child. Null principals don't survive crossing + // over IPC, so there's no other principal that'll work. + const persistable = browser.frameLoader; + persistable.startPersistence(null, { + onDocumentReady(doc) { + const uri = chrome.makeURI(doc.documentURI, doc.characterSet); + const filename = chrome.getDefaultFileName(undefined, uri, doc, null); + chrome.internalSave( + message.data, + null, + filename, + null, + doc.contentType, + false /* bypass cache */, + null /* filepicker title key */, + null /* file chosen */, + null /* referrer */, + doc.cookieJarSettings, + null /* initiating document */, + false /* don't skip prompt for a location */, + null /* cache key */, + PrivateBrowsingUtils.isBrowserPrivate( + browser + ) /* private browsing ? */, + Services.scriptSecurityManager.getSystemPrincipal() + ); + }, + onError(status) { + throw new Error("JSON Viewer's onSave failed in startPersistence"); + }, + }); + } + }, +}; + +var EXPORTED_SYMBOLS = ["DevToolsStartup", "validateProfilerWebChannelUrl"]; diff --git a/devtools/startup/aboutdevtools/AboutDevToolsRegistration.jsm b/devtools/startup/aboutdevtools/AboutDevToolsRegistration.jsm new file mode 100644 index 0000000000..f3ae2ea4a9 --- /dev/null +++ b/devtools/startup/aboutdevtools/AboutDevToolsRegistration.jsm @@ -0,0 +1,40 @@ +/* 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/. */ + +"use strict"; + +// Register the about:devtools URL, that is opened whenever a user attempts to open +// DevTools for the first time. +const { Services } = ChromeUtils.import("resource://gre/modules/Services.jsm"); + +const { nsIAboutModule } = Ci; + +function AboutDevtools() {} + +AboutDevtools.prototype = { + uri: Services.io.newURI( + "chrome://devtools-startup/content/aboutdevtools/aboutdevtools.xhtml" + ), + classDescription: "about:devtools", + classID: Components.ID("3a16d383-92bd-4c24-ac10-0e2bd66883ab"), + contractID: "@mozilla.org/network/protocol/about;1?what=devtools", + + QueryInterface: ChromeUtils.generateQI([nsIAboutModule]), + + newChannel: function(uri, loadInfo) { + const chan = Services.io.newChannelFromURIWithLoadInfo(this.uri, loadInfo); + chan.owner = Services.scriptSecurityManager.getSystemPrincipal(); + return chan; + }, + + getURIFlags: function(uri) { + return nsIAboutModule.ALLOW_SCRIPT; + }, + + getChromeURI: function(_uri) { + return this.uri; + }, +}; + +var EXPORTED_SYMBOLS = ["AboutDevtools"]; diff --git a/devtools/startup/aboutdevtools/aboutdevtools.css b/devtools/startup/aboutdevtools/aboutdevtools.css new file mode 100644 index 0000000000..e054b7566f --- /dev/null +++ b/devtools/startup/aboutdevtools/aboutdevtools.css @@ -0,0 +1,189 @@ +/* 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/. */ + +:root { + --white: #ffffff; + + /* Shared variables */ + --line-height: 1.5em; +} + +html, body { + min-width: 600px; +} + +body { + margin-top: 17vh; +} + +p { + line-height: var(--line-height); +} + +.box { + max-width: 850px; + display: flex; + flex-shrink: 0; + padding: 0 0 50px 0; + /* Compensate for the optional scrollbar. */ + margin-right: calc(100% - 100vw); +} + +.wrapper { + display: flex; + flex-direction: column; + align-items: center; +} + +.left-pane { + width: 300px; + height: 300px; + margin-inline-end: 20px; + background-image: url(images/otter.svg); + background-size: 100%; + background-position: 50%; + background-repeat: no-repeat; + flex-shrink: 0; +} + +.features { + max-width: 980px; + border-top: 1px solid var(--in-content-border-color); +} + +.features-list { + display: grid; + grid-template-columns: repeat(3, 1fr); + grid-gap: 40px 20px; + margin: 60px 20px; + padding: 0; +} + +.feature-icon { + width: 60%; + max-width: 180px; + margin-bottom: 10px; +} + +.feature { + list-style: none; + text-align: center; + margin: 10px 0; +} + +.feature-name { + display: block; + margin: 10px 0; + font-size: 28px; + font-weight: 300; +} + +.feature-name span { + display: block; +} + +.feature-desc { + margin: 1em 20px; +} + +.feature-link { + display: block; + color: inherit; +} + +.feature-more-link { + display: block; + margin-top: 10px; +} + +.external::after { + content: ""; + + display: inline-block; + height: 16px; + width: 16px; + + margin: -.3rem .15rem 0 0.25rem; + vertical-align: middle; + + background-image: url(images/external-link.svg); + background-repeat: no-repeat; + background-size: 16px 16px; + + -moz-context-properties: fill; + fill: currentColor; +} + +.title { + font-weight: 300; + font-size: 32px; + margin-top: 16px; + line-height: 44px; +} + +.buttons-container { + display: flex; + margin-top: 5px; +} + +.buttons-container button:not(:last-child) { + margin-right: 10px; +} + +button { + margin: 20px 0 0 0; + padding: 10px 20px; + + font-size: 15px; + font-weight: 400; + line-height: 21px; + cursor: pointer; +} + +/* Remove light gray outline when clicking on the button */ +button::-moz-focus-inner { + border: 0; +} + +[hidden="true"] { + display: none; +} + +footer { + display: flex; + align-items: center; + justify-content: center; + width: 100%; + min-height: 300px; + flex-grow: 1; + padding-bottom: 15px; + color: var(--white); + background: linear-gradient(0, var(--blue-60), var(--blue-80)); +} + +.dev-edition-logo { + flex-shrink: 0; + width: 165px; + margin: 20px 50px 0 0; +} + +.footer-message { + max-width: 460px; +} + +.footer-message-title { + color: var(--white); +} + +.footer-link { + display: block; + margin-top: 10px; +} + +.footer-link, +.footer-link:hover, +.footer-link:visited, +.footer-link:hover:active { + color: var(--white); +} diff --git a/devtools/startup/aboutdevtools/aboutdevtools.js b/devtools/startup/aboutdevtools/aboutdevtools.js new file mode 100644 index 0000000000..9eac396675 --- /dev/null +++ b/devtools/startup/aboutdevtools/aboutdevtools.js @@ -0,0 +1,253 @@ +/* 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/. */ + +"use strict"; + +const { Services } = ChromeUtils.import("resource://gre/modules/Services.jsm"); + +const DEVTOOLS_ENABLED_PREF = "devtools.enabled"; + +const MESSAGES = { + AboutDebugging: "about-debugging-message", + ContextMenu: "inspect-element-message", + HamburgerMenu: "menu-message", + KeyShortcut: "key-shortcut-message", + SystemMenu: "menu-message", +}; + +// Google analytics parameters that should be added to all outgoing links. +const GA_PARAMETERS = [ + ["utm_source", "devtools"], + ["utm_medium", "onboarding"], +]; + +const KEY_SHORTCUTS_STRINGS = + "chrome://devtools-startup/locale/key-shortcuts.properties"; +const keyShortcutsBundle = Services.strings.createBundle(KEY_SHORTCUTS_STRINGS); + +// URL constructor doesn't support about: scheme, +// we have to use http in order to have working searchParams. +const url = new URL(window.location.href.replace("about:", "http://")); +const reason = url.searchParams.get("reason"); +const tabid = parseInt(url.searchParams.get("tabid"), 10); + +function getToolboxShortcut() { + const modifier = Services.appinfo.OS == "Darwin" ? "Cmd+Opt+" : "Ctrl+Shift+"; + return ( + modifier + keyShortcutsBundle.GetStringFromName("toggleToolbox.commandkey") + ); +} + +function onInstallButtonClick() { + Services.prefs.setBoolPref("devtools.enabled", true); +} + +function onCloseButtonClick() { + window.close(); +} + +function updatePage() { + const installPage = document.getElementById("install-page"); + const welcomePage = document.getElementById("welcome-page"); + const isEnabled = Services.prefs.getBoolPref("devtools.enabled"); + if (isEnabled) { + installPage.setAttribute("hidden", "true"); + welcomePage.removeAttribute("hidden"); + } else { + welcomePage.setAttribute("hidden", "true"); + installPage.removeAttribute("hidden"); + } +} + +/** + * Array of descriptors for features displayed on about:devtools. + * Each feature should contain: + * - icon: the name of the image to use + * - title: the key of the localized title (from aboutDevTools.ftl) + * - desc: the key of the localized description (from aboutDevTools.ftl) + * - link: the MDN documentation link + */ +const features = [ + { + icon: + "chrome://devtools-startup/content/aboutdevtools/images/feature-inspector.svg", + title: "features-inspector-title", + desc: "features-inspector-desc", + link: "https://developer.mozilla.org/docs/Tools/Page_Inspector", + }, + { + icon: + "chrome://devtools-startup/content/aboutdevtools/images/feature-console.svg", + title: "features-console-title", + desc: "features-console-desc", + link: "https://developer.mozilla.org/docs/Tools/Web_Console", + }, + { + icon: + "chrome://devtools-startup/content/aboutdevtools/images/feature-debugger.svg", + title: "features-debugger-title", + desc: "features-debugger-desc", + link: "https://developer.mozilla.org/docs/Tools/Debugger", + }, + { + icon: + "chrome://devtools-startup/content/aboutdevtools/images/feature-network.svg", + title: "features-network-title", + desc: "features-network-desc", + link: "https://developer.mozilla.org/docs/Tools/Network_Monitor", + }, + { + icon: + "chrome://devtools-startup/content/aboutdevtools/images/feature-storage.svg", + title: "features-storage-title", + desc: "features-storage-desc", + link: "https://developer.mozilla.org/docs/Tools/Storage_Inspector", + }, + { + icon: + "chrome://devtools-startup/content/aboutdevtools/images/feature-responsive.svg", + title: "features-responsive-title", + desc: "features-responsive-desc", + link: "https://developer.mozilla.org/docs/Tools/Responsive_Design_Mode", + }, + { + icon: + "chrome://devtools-startup/content/aboutdevtools/images/feature-visualediting.svg", + title: "features-visual-editing-title", + desc: "features-visual-editing-desc", + link: "https://developer.mozilla.org/docs/Tools/Style_Editor", + }, + { + icon: + "chrome://devtools-startup/content/aboutdevtools/images/feature-performance.svg", + title: "features-performance-title", + desc: "features-performance-desc", + link: "https://developer.mozilla.org/docs/Tools/Performance", + }, + { + icon: + "chrome://devtools-startup/content/aboutdevtools/images/feature-memory.svg", + title: "features-memory-title", + desc: "features-memory-desc", + link: "https://developer.mozilla.org/docs/Tools/Memory", + }, +]; + +/** + * Helper to create a DOM element to represent a DevTools feature. + */ +function createFeatureEl(feature) { + const li = document.createElement("li"); + li.classList.add("feature"); + + const { icon, link, title, desc } = feature; + // eslint-disable-next-line no-unsanitized/property + li.innerHTML = ` + <h3 class="feature-name"> + <a class="feature-link" href="${link}" target="_blank"> + <img class="feature-icon" src="${icon}" alt="" /> + <span data-l10n-id="${title}"></span> + </a> + </h3> + <p class="feature-desc" data-l10n-id="${desc}"> + <a class="feature-more-link external" href="${link}" + aria-hidden="true" tabindex="-1" + target="_blank" data-l10n-name="learn-more"></a> + </p>`; + + return li; +} + +window.addEventListener( + "load", + function() { + const inspectorShortcut = getToolboxShortcut(); + const welcomeMessage = document.getElementById("welcome-message"); + + // Set the welcome message content with the correct keyboard shortcut for the current + // platform. + document.l10n.setAttributes(welcomeMessage, "welcome-message", { + shortcut: inspectorShortcut, + }); + + // Set the appropriate title message. + if (reason == "ContextMenu") { + document.getElementById("inspect-title").removeAttribute("hidden"); + } else { + document.getElementById("common-title").removeAttribute("hidden"); + } + + // Display the message specific to the reason + const id = MESSAGES[reason]; + if (id) { + const message = document.getElementById(id); + message.removeAttribute("hidden"); + } + + // Attach event listeners + document + .getElementById("install") + .addEventListener("click", onInstallButtonClick); + document + .getElementById("close") + .addEventListener("click", onCloseButtonClick); + Services.prefs.addObserver(DEVTOOLS_ENABLED_PREF, updatePage); + + const featuresContainer = document.querySelector(".features-list"); + for (const feature of features) { + featuresContainer.appendChild(createFeatureEl(feature)); + } + + // Add Google Analytics parameters to all the external links. + const externalLinks = document.querySelectorAll("a[href*='mozilla.org']"); + for (const link of externalLinks) { + const linkUrl = new URL(link.getAttribute("href")); + GA_PARAMETERS.forEach(([key, value]) => + linkUrl.searchParams.set(key, value) + ); + link.setAttribute("href", linkUrl.href); + } + + // Update the current page based on the current value of DEVTOOLS_ENABLED_PREF. + updatePage(); + }, + { once: true } +); + +window.addEventListener( + "beforeunload", + function() { + // Focus the tab that triggered the DevTools onboarding. + if (document.visibilityState != "visible") { + // Only try to focus the correct tab if the current tab is the about:devtools page. + return; + } + + // Retrieve the original tab if it is still available. + const browserWindow = Services.wm.getMostRecentWindow("navigator:browser"); + const { gBrowser } = browserWindow; + const originalBrowser = gBrowser.getBrowserForOuterWindowID(tabid); + const originalTab = gBrowser.getTabForBrowser(originalBrowser); + + if (originalTab) { + // If the original tab was found, select it. + gBrowser.selectedTab = originalTab; + } + }, + { once: true } +); + +window.addEventListener( + "unload", + function() { + document + .getElementById("install") + .removeEventListener("click", onInstallButtonClick); + document + .getElementById("close") + .removeEventListener("click", onCloseButtonClick); + Services.prefs.removeObserver(DEVTOOLS_ENABLED_PREF, updatePage); + }, + { once: true } +); diff --git a/devtools/startup/aboutdevtools/aboutdevtools.xhtml b/devtools/startup/aboutdevtools/aboutdevtools.xhtml new file mode 100644 index 0000000000..5b0709e9a5 --- /dev/null +++ b/devtools/startup/aboutdevtools/aboutdevtools.xhtml @@ -0,0 +1,108 @@ +<?xml version="1.0" encoding="utf-8"?> +<!-- 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/. --> +<!DOCTYPE html [ +<!ENTITY % htmlDTD PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd"> %htmlDTD; +<!ENTITY % globalDTD SYSTEM "chrome://global/locale/global.dtd"> %globalDTD; +]> + +<html xmlns="http://www.w3.org/1999/xhtml" dir="&locale.dir;"> +<head> + <meta http-equiv="Content-Security-Policy" content="default-src chrome:; object-src 'none'" /> + <title data-l10n-id="head-title"></title> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>a + <link rel="stylesheet" href="chrome://global/skin/in-content/common.css" type="text/css"/> + <link rel="stylesheet" href="chrome://devtools-startup/content/aboutdevtools/aboutdevtools.css" type="text/css"/> + <link rel="stylesheet" href="chrome://devtools-startup/content/aboutdevtools/subscribe.css" type="text/css"/> + <script src="chrome://devtools-startup/content/aboutdevtools/aboutdevtools.js"></script> + <script src="chrome://devtools-startup/content/aboutdevtools/subscribe.js"></script> + <link rel="localization" href="devtools/startup/aboutDevTools.ftl" /> +</head> +<body> + <div id="install-page" class="wrapper" hidden="true"> + <div class="box"> + <div class="left-pane" /> + <div class="right-pane"> + <h1 class="title" id="common-title" hidden="true" data-l10n-id="enable-title"></h1> + <h1 class="title" id="inspect-title" hidden="true" data-l10n-id="enable-inspect-element-title"></h1> + + <!-- Include all the possible message, hidden by default + as we can't lazily load localized strings from dtd --> + <p id="about-debugging-message" hidden="true" data-l10n-id="enable-about-debugging-message"></p> + <p id="menu-message" hidden="true" data-l10n-id="enable-menu-message"></p> + <p id="key-shortcut-message" hidden="true" data-l10n-id="enable-key-shortcut-message"></p> + <p id="inspect-element-message" hidden="true" data-l10n-id="enable-inspect-element-message"></p> + + <p data-l10n-id="enable-common-message"></p> + <a class="external installpage-link" href="https://developer.mozilla.org/docs/Tools" target="_blank" data-l10n-id="enable-learn-more-link"></a> + <div class="buttons-container"> + <button class="primary" id="install" data-l10n-id="enable-enable-button"></button> + <button id="close" data-l10n-id="enable-close-button"></button> + </div> + </div> + </div> + </div> + + <!-- This page, hidden by default is displayed once the add-on is installed --> + <div id="welcome-page" class="wrapper" hidden="true"> + <div class="box"> + <div class="left-pane" /> + <div class="right-pane"> + <h1 class="title" data-l10n-id="welcome-title"></h1> + <!-- The welcome message is dynamically updated with a keyboard shortcut at + runtime and added in aboutdevtools.js --> + <p id="welcome-message"></p> + + <!-- Form dedicated to the newsletter subscription --> + <div class="newsletter"> + <h2 class="newsletter-title" data-l10n-id="newsletter-title"></h2> + <p data-l10n-id="newsletter-message"></p> + + <form id="newsletter-form" name="newsletter-form" action="https://www.mozilla.org/en-US/newsletter/" method="post"> + <!-- "H" stands for the HTML format (->fmt). Alternative is T for text. --> + <input type="hidden" id="fmt" name="fmt" value="H" /> + <!-- "app-dev" is the id of the Mozilla Developper newsletter --> + <input type="hidden" id="newsletters" name="newsletters" value="app-dev" /> + <div id="newsletter-errors"></div> + <section id="newsletter-email" class="newsletter-form-section"> + <input type="email" id="email" name="email" required="true" data-l10n-id="newsletter-email-placeholder" data-l10n-attrs="placeholder" /> + </section> + + <section id="newsletter-privacy" class="newsletter-form-section"> + <input type="checkbox" id="privacy" name="privacy" required="true" /> + <label for="privacy" data-l10n-id="newsletter-privacy-label"> + <a class="external" href="https://www.mozilla.org/privacy/" data-l10n-name="privacy-policy"></a> + </label> + </section> + <button type="submit" id="newsletter-submit" class="primary" data-l10n-id="newsletter-subscribe-button"></button> + </form> + <div id="newsletter-thanks"> + <h2 class="newsletter-title" data-l10n-id="newsletter-thanks-title"></h2> + <p data-l10n-id="newsletter-thanks-message"></p> + </div> + </div> + </div> + </div> + + <div class="features"> + <ul class="features-list"> + </ul> + </div> + + <footer> + <img class="dev-edition-logo" + src="chrome://devtools-startup/content/aboutdevtools/images/dev-edition-logo.svg" + alt="" /> + <div class="footer-message"> + <h1 class="footer-message-title" data-l10n-id="footer-title"></h1> + <p data-l10n-id="footer-message"></p> + <a class="external footer-link" + href="https://www.mozilla.org/firefox/developer/" + target="_blank" data-l10n-id="footer-learn-more-link"></a> + </div> + </footer> + </div> + +</body> +</html> diff --git a/devtools/startup/aboutdevtools/components.conf b/devtools/startup/aboutdevtools/components.conf new file mode 100644 index 0000000000..e9ea6846f8 --- /dev/null +++ b/devtools/startup/aboutdevtools/components.conf @@ -0,0 +1,14 @@ +# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*- +# 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/. + +Classes = [ + { + 'cid': '{3a16d383-92bd-4c24-ac10-0e2bd66883ab}', + 'contract_ids': ['@mozilla.org/network/protocol/about;1?what=devtools'], + 'jsm': 'resource:///modules/AboutDevToolsRegistration.jsm', + 'constructor': 'AboutDevtools', + }, +] diff --git a/devtools/startup/aboutdevtools/images/dev-edition-logo.svg b/devtools/startup/aboutdevtools/images/dev-edition-logo.svg new file mode 100644 index 0000000000..65d1c49759 --- /dev/null +++ b/devtools/startup/aboutdevtools/images/dev-edition-logo.svg @@ -0,0 +1,251 @@ +<!-- 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/. --> +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"> + <defs> + <linearGradient x1="42%" y1="-10%" x2="61%" y2="114%" id="f"> + <stop stop-color="#AAF2FF" offset="0%"/> + <stop stop-color="#0DF" offset="29%"/> + <stop stop-color="#0090ED" offset="61%"/> + <stop stop-color="#0250BB" offset="89%"/> + </linearGradient> + <linearGradient x1="38%" y1="0%" x2="63%" y2="124%" id="g"> + <stop stop-color="#AAF2FF" offset="0%"/> + <stop stop-color="#0DF" offset="29%"/> + <stop stop-color="#0090ED" offset="74%"/> + <stop stop-color="#0250BB" offset="100%"/> + </linearGradient> + <linearGradient x1="86%" y1="15%" x2="20%" y2="84%" id="k"> + <stop stop-color="#80EBFF" stop-opacity=".5" offset="24%"/> + <stop stop-color="#0DF" stop-opacity="0" offset="70%"/> + </linearGradient> + <linearGradient x1="61%" y1="-10%" x2="20%" y2="149%" id="l"> + <stop stop-color="#BFF3FF" stop-opacity=".9" offset="0%"/> + <stop stop-color="#80EBFF" stop-opacity=".5" offset="100%"/> + </linearGradient> + <linearGradient x1="51%" y1="-2%" x2="48%" y2="139%" id="m"> + <stop stop-color="#BFF3FF" offset="0%"/> + <stop stop-color="#0DF" stop-opacity="0" offset="100%"/> + </linearGradient> + <linearGradient x1="52%" y1="-4%" x2="47%" y2="143%" id="n"> + <stop stop-color="#BFF3FF" offset="0%"/> + <stop stop-color="#AAF2FF" stop-opacity=".5" offset="100%"/> + </linearGradient> + <linearGradient x1="53%" y1="-2%" x2="47%" y2="142%" id="o"> + <stop stop-color="#BFF3FF" offset="0%"/> + <stop stop-color="#0DF" stop-opacity="0" offset="100%"/> + </linearGradient> + <linearGradient x1="49%" y1="-2%" x2="57%" y2="123%" id="p"> + <stop stop-color="#BFF3FF" stop-opacity=".8" offset="0%"/> + <stop stop-color="#80EBFF" stop-opacity=".2" offset="100%"/> + </linearGradient> + <linearGradient x1="117%" y1="-23%" x2="24%" y2="128%" id="q"> + <stop stop-color="#BFF3FF" stop-opacity=".8" offset="0%"/> + <stop stop-color="#80EBFF" stop-opacity=".2" offset="100%"/> + </linearGradient> + <linearGradient x1="52%" y1="-1%" x2="47%" y2="137%" id="r"> + <stop stop-color="#0DF" stop-opacity=".4" offset="0%"/> + <stop stop-color="#0DF" stop-opacity="0" offset="100%"/> + </linearGradient> + <linearGradient x1="50%" y1="-12%" x2="50%" y2="99%" id="s"> + <stop stop-color="#BFF3FF" offset="0%"/> + <stop stop-color="#0DF" stop-opacity="0" offset="100%"/> + </linearGradient> + <linearGradient x1="53%" y1="-3%" x2="47%" y2="142%" id="t"> + <stop stop-color="#BFF3FF" stop-opacity=".8" offset="0%"/> + <stop stop-color="#0DF" stop-opacity="0" offset="100%"/> + </linearGradient> + <radialGradient cx="55%" cy="25%" r="60%" id="a"> + <stop stop-color="#0DF" stop-opacity=".4" offset="10%"/> + <stop stop-color="#7542E5" stop-opacity=".25" offset="90%"/> + </radialGradient> + <radialGradient cx="49.24%" cy="52.7%" fx="49%" fy="52.7%" r="51%" id="b"> + <stop stop-color="#7542E5" stop-opacity="0" offset="91%"/> + <stop stop-color="#0DF" stop-opacity=".4" offset="100%"/> + </radialGradient> + <radialGradient cx="86%" cy="-13%" fx="86%" fy="-13%" r="128%" gradientTransform="matrix(.81263 0 0 1 .16 0)" id="c"> + <stop stop-color="#80EBFF" offset="0%"/> + <stop stop-color="#0DF" offset="26%"/> + <stop stop-color="#0090ED" offset="53%"/> + <stop stop-color="#0060DF" offset="86%"/> + </radialGradient> + <radialGradient cx="47.73%" cy="40%" fx="48%" fy="40%" r="128%" gradientTransform="matrix(.81263 0 0 1 .09 0)" id="d"> + <stop stop-color="#321C64" stop-opacity=".8" offset="30%"/> + <stop stop-color="#212F83" stop-opacity=".5" offset="37%"/> + <stop stop-color="#0A47AC" stop-opacity=".14" offset="48%"/> + <stop stop-color="#0250BB" stop-opacity="0" offset="53%"/> + </radialGradient> + <radialGradient cx="90%" cy="-50%" r="210%" gradientTransform="matrix(.83857 0 0 1 .13 0)" id="e"> + <stop stop-color="#80EBFF" offset="0%"/> + <stop stop-color="#00B3F4" offset="47%"/> + <stop stop-color="#0060DF" offset="84%"/> + <stop stop-color="#592ACB" offset="100%"/> + </radialGradient> + <radialGradient cx="208%" cy="-104%" fx="208%" fy="-104%" r="300%" gradientTransform="matrix(1 0 0 .99746 0 0)" id="h"> + <stop stop-color="#0DF" offset="0%"/> + <stop stop-color="#0090ED" offset="82%"/> + </radialGradient> + <radialGradient cx="155%" cy="-45%" fx="155%" fy="-45%" r="313%" gradientTransform="matrix(.8937 0 0 1 .17 0)" id="i"> + <stop stop-color="#80EBFF" offset="29%"/> + <stop stop-color="#00B3F4" offset="100%"/> + </radialGradient> + <radialGradient cx="15%" cy="-43%" fx="15%" fy="-43%" r="230%" gradientTransform="matrix(.9814 0 0 1 0 0)" id="j"> + <stop stop-color="#AAF2FF" offset="18%"/> + <stop stop-color="#0DF" offset="43%"/> + <stop stop-color="#0060DF" offset="69%"/> + </radialGradient> + </defs> + <path fill="#09204d" d="M146.62 289.1l15.14 41.98 22.76 30.7 53.41 10.18 25.56 2.18 43.62-10.9 18.8-18.02-179.29-56.12z"/> + <path fill="#09204d" d="M372.69 227.18l-5.35-17.75-15.3-28.85-17.49-18.44-18.57-13.26-16.12-6.33-19.35-6.88-31.85-2.03-20.09 3.63-16.39 5.04-29.08 17.02-18.18 20.27-16.76 27.23-6.6 23.16-1.22 35.15 6.28 23.96 13.87 27.28 9.77 13.18 13.52 12.4 16.89 11.42 20.82 9.05 34.85 4.1 18.2.5 26.92-7.59 24.07-13.2 15.49-13.22 12-14.32L370 285.46l3.75-22.73-1.06-35.55z"/> + <path fill="#0e56d7" d="M249.24 149.62l-14.27 14.15 23.28 9.43 17.3-21.46-26.31-2.12z"/> + <path fill="#1053d1" d="M258.25 173.2l45.05-1.36-27.74-20.1-17.32 21.46z"/> + <path fill="#0b4fbf" d="M299.95 151.58l-24.4.15 27.75 20.1 25.65-1.67-29-18.58z"/> + <path fill="#0b48b0" d="M328.95 170.16l-14.58-20.11 20.18 12.1-5.6 8.01z"/> + <path fill="#0c45a7" d="M348.26 182.47l-19.3-12.31 5.6-8.02 13.7 20.34z"/> + <path fill="#0f46af" d="M328.95 170.16l-3.23 13.78 17.66 7.06-14.43-20.84z"/> + <path fill="#0c47ad" d="M328.95 170.16l19.32 12.31-4.88 8.53-14.44-20.84z"/> + <path fill="#0e4fc3" d="M303.3 171.84l25.65-1.68-3.23 13.78-22.42-12.1z"/> + <path fill="#174dca" d="M303.3 171.84l-20.27 18.34 26.09 12.78-5.82-31.12z"/> + <path fill="#1650d4" d="M258.25 173.2l45.05-1.36-20.27 18.34-24.78-16.98z"/> + <path fill="#1246b2" d="M325.72 183.94L338 207.73l5.4-16.73-17.67-7.06z"/> + <path fill="#133ea1" d="M337.99 207.73l5.4-16.73 12.85 30.57-18.25-13.84z"/> + <path fill="#103d98" d="M343.38 191l19.6 14.34-6.74 16.23L343.38 191z"/> + <path fill="#0b3785" d="M348.26 182.47l3.79-1.9 10.92 24.77-14.7-22.86z"/> + <path fill="#0b3685" d="M362.97 205.34l4.37 4.1-15.3-28.86 10.93 24.76z"/> + <path d="M362.97 205.34l-14.7-22.86-4.88 8.52zm-28.42-43.2l13.71 20.34 3.79-1.9z" fill="#0c3b91"/> + <path fill="#0b3279" d="M371.7 241.04l-4.36-31.6 5.35 17.74-1.06 13.86h.07z"/> + <path fill="#0f388d" d="M362.97 205.34l8.73 35.7-4.36-31.6-4.37-4.1z"/> + <path fill="#0d3481" d="M356.24 221.57l15.46 19.47-8.73-35.7-6.73 16.23z"/> + <path fill="#0b2e71" d="M371.63 241.04l1.06-13.86 1.06 35.55-2.05-21.69h-.07z"/> + <path fill="#0e2f77" d="M369.11 269.14l4.64-6.4-2.05-21.7-2.59 28.1z"/> + <path fill="#0e2969" d="M370 285.46l-3.7 1.8 7.45-24.53-3.75 22.73z"/> + <path fill="#0c2a69" d="M366.3 287.25l7.45-24.52-4.64 6.4-2.82 18.12z"/> + <path fill="#123180" d="M369.11 269.14l2.6-28.1-7.95 9.37 5.35 18.73z"/> + <path fill="#112b70" d="M366.3 287.25l2.81-18.11-15.32 25.75 12.5-7.64z"/> + <path fill="#12378c" d="M356.24 221.57l15.46 19.47-7.94 9.37-7.52-28.84z"/> + <path fill="#122e7b" d="M369.11 269.14l-5.35-18.73-8.08 23.07 13.43-4.34z"/> + <path fill="#11296c" d="M353.02 318.7l13.27-31.45-12.41 22.92-.85 8.53z"/> + <path fill="#142a72" d="M353.88 310.17l12.41-22.92-12.5 7.64.09 15.28z"/> + <path d="M366.3 287.25l-13.28 31.45L370 285.46zm-25.28 45.77l12-14.32.86-8.52zm-15.49 13.21l15.49-13.2-16.37 7.52z" fill="#112768"/> + <path fill="#1c226a" d="M235.15 355.44l-15.65 3.82.48-10.92 15.17 7.1z"/> + <path fill="#182b7a" d="M148.16 206.82l4.32-1.6L141.56 230l6.6-23.17z"/> + <path fill="#1f308d" d="M141.57 229.99l8.26-1.54 2.64-23.22-10.9 24.76z"/> + <path fill="#1e2b7f" d="M142.06 259.73l-.5-29.74 8.27-1.54-7.77 31.28z"/> + <path d="M325.72 183.94l-16.6 19.02 28.87 4.77zm-144.9-19.51l21.2-14.5-18.92 9.4z" fill="#1346b5"/> + <path fill="#1244ac" d="M183.1 159.33l29.08-17.02-10.17 7.62-18.91 9.4"/> + <path fill="#0e4ab6" d="M202.01 149.93l26.56-12.66-16.39 5.04-10.17 7.62z"/> + <path d="M303.3 171.84l5.82 31.12 16.6-19.02zm-85.11-23.39l24.74-9.89-14.36-1.29z" fill="#0e4bba"/> + <path fill="#0a4ebc" d="M248.66 133.65l-20.09 3.62 14.36 1.29 5.73-4.92z"/> + <path fill="#0c54cc" d="M267.65 138.31l-24.72.25 5.73-4.92"/> + <path d="M314.37 150.05l-14.42 1.53 29 18.58zm-46.72-11.74l32.2 4.24-19.34-6.88z" fill="#0b4bb4"/> + <path fill="#0c3889" d="M314.37 150.05l-14.51-7.5 16.12 6.33-1.61 1.17z"/> + <path d="M146.62 289.1l9.52 7.83-14.08-37.2zm131.4 73.98l8.37-19.7-30.5 8.2zm8.37-19.7l25.5 7.08 1.54-19.72z" fill="#202575"/> + <path fill="#1b2773" d="M324.65 340.55l-11.22-9.81 27.11-18.02-15.89 27.83z"/> + <path fill="#15276d" d="M340.54 312.72l-15.89 27.83 16.37-7.53 12.86-22.85-13.34 2.55z"/> + <path d="M315.98 148.88l-1.61 1.17 20.18 12.1zm-16.03 2.7l14.42-1.53-14.51-7.5z" fill="#0c409d"/> + <path d="M248.66 133.65l19 4.66 12.85-2.64zm51.2 8.9l-32.2-4.24 32.3 13.27z" fill="#0b4cb7"/> + <path fill="#0b55ce" d="M267.65 138.31l7.9 13.42 24.4-.15-32.3-13.27z"/> + <path fill="#0a52c5" d="M267.65 138.31l7.9 13.42-26.31-2.11 18.41-11.3z"/> + <path fill="#0951c4" d="M242.93 138.56l6.31 11.06 18.41-11.3-24.72.24z"/> + <path fill="#0b50c4" d="M218.19 148.45l24.74-9.89 6.31 11.06-31.05-1.17z"/> + <path d="M202.01 149.93l16.18-1.48 10.38-11.18zm16.18-1.48l16.78 15.32 14.27-14.16z" fill="#0f4dbf"/> + <path fill="#1546b6" d="M218.19 148.45l-27.33 25.63 11.15-24.15 16.18-1.48z"/> + <path fill="#1549bd" d="M190.86 174.07l17.44 2.9 9.89-28.52-27.33 25.63z"/> + <path fill="#144bc3" d="M208.3 176.97l9.89-28.52 16.79 15.32-26.68 13.2z"/> + <path fill="#173794" d="M164.92 179.6l1.06 10.31 14.84-25.48-15.9 15.17z"/> + <path fill="#192f84" d="M152.47 205.23l12.45-25.62 1.06 10.3-13.5 15.32z"/> + <path fill="#1a389b" d="M165.98 189.91l14.84-25.48 10.04 9.64-24.88 15.84z"/> + <path fill="#1d3089" d="M165.09 212l.9-22.09-13.52 15.32L165.1 212z"/> + <path fill="#1e389f" d="M165.09 212l.9-22.09 17.52 14.23-18.42 7.87z"/> + <path fill="#1c40af" d="M183.51 204.14l7.35-30.06-24.88 15.83 17.53 14.23z"/> + <path fill="#1e41b7" d="M183.51 204.14l7.35-30.06 17.44 2.9-24.79 27.16z"/> + <path fill="#192c7d" d="M149.83 228.45l2.64-23.22L165.1 212l-15.26 16.44z"/> + <path d="M278.02 363.08l23.44-3.64 10.42-8.99zm-137.68-97.94l1.72-5.41-.5-29.74zm9.49-36.69l-7.77 31.28 14.08 37.2-6.87-43.1z" fill="#162467"/> + <path fill="#1a236a" d="M156.14 296.93l11.62 1.63-8.14-18.99-3.48 17.36z"/> + <path d="M324.65 340.55l-12.77 9.9-10.42 9 24.07-13.22zm-68.31 25.97l18.2.5 26.92-7.58-23.44 3.64zm-89.36-48l12.2 2.35-11.42-22.3z" fill="#132668"/> + <path d="M219.98 348.34l-20.67-15.9-8.59 8.25 28.78 18.57zm-73.36-59.24l13.87 27.28-4.35-19.45zm-6.28-23.96l6.28 23.96-4.56-29.37zm115.54 86.44l-35.9-3.23 15.17 7.09-15.65 3.82-18.83-5.88 20.82 9.05 34.84 4.1 21.68-3.45zm-88.12-53.02l-11.62-1.63 10.84 21.59zm-18.49-44.73l6.87 43.1 3.48-17.36zm29.92 67.03l-12.21-2.34-6.5-2.14 9.78 13.18 13.52 12.4 16.89 11.42-9.95-12.69z" fill="#1b2268"/> + <path fill="#212a81" d="M149.83 228.45l16.39 25.36-1.13-41.8-15.26 16.44z"/> + <path fill="#21267a" d="M149.27 253.83l10.35 25.74 6.6-25.77-16.95.03z"/> + <path fill="#262781" d="M159.62 279.57l6.6-25.77 8.19 20.37-14.79 5.4z"/> + <path fill="#272379" d="M167.76 298.56l31.42 19.47-24.77-43.86-6.65 24.4z"/> + <path d="M160.49 316.38l6.49 2.14-10.84-21.59zm69.4 11.2l-9.91 20.76 35.9 3.23zm-62.13-29.02l11.43 22.3 11.53 19.83 8.6-8.26-.14-14.4z" fill="#1e226d"/> + <path d="M313.43 330.74l-1.55 19.71 12.77-9.9zm-54.94-2.83l-2.6 23.66 30.5-8.2-1.1-26.6z" fill="#222475"/> + <path d="M149.27 253.83l16.94-.03-16.38-25.35zm136.03 62.95l1.09 26.6 27.04-12.64z" fill="#23277d"/> + <path fill="#1e2776" d="M285.3 316.78l17.4-15.76 10.73 29.72-28.13-13.96z"/> + <path fill="#222b86" d="M313.43 330.74l13.15-39.85-23.88 10.13 10.73 29.72z"/> + <path fill="#192974" d="M340.54 312.72l-27.11 18.02 13.16-39.84 13.95 21.82z"/> + <path fill="#172a75" d="M353.79 294.9l-27.2-4 13.95 21.82 13.34-2.55-.1-15.28z"/> + <path fill="#172d7d" d="M355.68 273.48l-29.1 17.41 27.2 4 15.33-25.75-13.43 4.34z"/> + <path d="M152.47 205.23l12.45-25.62-16.76 27.22zm192.36 31.71l10.85 36.54 8.08-23.07z" fill="#18338a"/> + <path fill="#153791" d="M363.76 250.41l-7.52-28.84-11.41 15.37 18.93 13.47z"/> + <path fill="#1b318b" d="M326.58 290.9l29.1-17.42-28.2-12.55-.9 29.96z"/> + <path fill="#242d8d" d="M326.58 290.9l-26.36-26.65 2.48 36.77 23.88-10.12z"/> + <path fill="#2a2b8f" d="M285.3 316.78l-20.24-17.93 37.64 2.17-17.4 15.76z"/> + <path d="M167.76 298.56l6.65-24.4-14.79 5.41zm97.3.3l-6.57 29.05 26.81-11.13z" fill="#27267f"/> + <path fill="#2d2381" d="M223.15 304.8l-19.49-9.9-4.48 23.13 30.72 9.55 28.6.33-35.35-23.11z"/> + <path fill="#2f2485" d="M258.5 327.9l6.56-29.05-41.91 5.95 35.34 23.1z"/> + <path fill="#233196" d="M166.22 253.8l8.4-26.83-9.53-14.96 1.13 41.8z"/> + <path fill="#293cb7" d="M183.51 204.14l36.9-10.75-19.49 39.8-17.4-29.05z"/> + <path fill="#25339c" d="M326.58 290.9l-26.36-26.65 27.26-3.32-.9 29.96z"/> + <path fill="#19348f" d="M355.68 273.48l-10.85-36.54-17.35 23.99 28.2 12.55z"/> + <path fill="#2a309a" d="M302.7 301.02l-30.15-29.16 27.67-7.6 2.48 36.76z"/> + <path fill="#302b96" d="M265.06 298.85l37.64 2.17-30.15-29.16-7.5 27z"/> + <path fill="#3630a7" d="M265.06 298.85l-20.63-16.79 28.12-10.2-7.5 27z"/> + <path d="M180.82 164.43l2.28-5.1-18.18 20.27zm157.17 43.3l6.84 29.21 11.4-15.37z" fill="#173da2"/> + <path fill="#2a36a8" d="M183.51 204.14l17.41 29.06-26.3-6.23 8.9-22.83z"/> + <path fill="#312e9f" d="M174.62 226.97l26.3 6.23-17.78 28-8.52-34.23z"/> + <path fill="#184dcd" d="M220.4 193.39l14.58-29.62-26.68 13.2 12.1 16.42z"/> + <path fill="#272986" d="M166.22 253.8l16.92 7.4-8.73 12.97-8.2-20.36z"/> + <path fill="#2c2584" d="M183.14 261.2l-8.73 12.97 24.77 43.86 4.48-23.14-20.52-33.68z"/> + <path fill="#32268b" d="M203.66 294.9l2.75-40.76-23.27 7.07 20.52 33.68z"/> + <path fill="#372999" d="M203.66 294.9l40.77-12.84-38.02-27.92-2.75 40.75z"/> + <path fill="#392da5" d="M244.43 282.06l-3.97-31.5-34.05 3.58 38.02 27.92z"/> + <path fill="#3338bc" d="M240.46 250.56l28.76-10.76 3.33 32.06-32.09-21.3z"/> + <path fill="#362896" d="M223.15 304.8l41.9-5.95-20.62-16.79-21.28 22.74z"/> + <path fill="#35268f" d="M223.15 304.8l-19.49-9.9 40.77-12.84-21.28 22.74z"/> + <path fill="#2648d3" d="M220.4 193.39l24.98 2.64-10.4-32.26-14.57 29.62z"/> + <path fill="#1057dc" d="M258.25 173.2l-23.27-9.43 10.4 32.26 12.87-22.83z"/> + <path fill="#1653da" d="M258.25 173.2l24.78 16.98-37.65 5.85 12.87-22.83z"/> + <path fill="#2b46d5" d="M245.38 196.03l36.93 19.58-13.1 24.2-23.83-43.78z"/> + <path fill="#244ad7" d="M282.31 215.61l.72-25.43-37.65 5.85 36.93 19.58z"/> + <path fill="#2547cf" d="M282.31 215.61l.72-25.43 26.09 12.78-26.81 12.65z"/> + <path fill="#333cc5" d="M245.38 196.03l23.84 43.77-41.81-20.94 17.97-22.83z"/> + <path fill="#3833b6" d="M240.46 250.56l28.76-10.76-41.81-20.94 13.05 31.7z"/> + <path fill="#2a41c6" d="M269.22 239.8l36.87-6.73-23.78-17.46-13.1 24.2z"/> + <path fill="#2045c1" d="M309.12 202.96l-3.03 30.1-23.78-17.45 26.8-12.65z"/> + <path fill="#1b43b7" d="M309.12 202.96l17.4 23.63-20.43 6.48 3.03-30.11z"/> + <path fill="#1742af" d="M337.99 207.73l-28.87-4.77 17.4 23.64L338 207.73z"/> + <path d="M190.86 174.07l11.15-24.14-21.2 14.5zM338 207.73l-11.47 18.87 18.3 10.35z" fill="#1740a9"/> + <path fill="#1b3ca4" d="M327.48 260.93l17.35-24-18.3-10.34.95 34.34z"/> + <path fill="#1f3dad" d="M327.48 260.93l-.96-34.34-20.43 6.48 21.4 27.86z"/> + <path d="M183.51 204.14l36.9-10.75-12.11-16.41zm85.7 35.66l31 24.45 5.88-31.18z" fill="#2543c3"/> + <path fill="#2e37b2" d="M272.55 271.86l27.67-7.6-31-24.46 3.33 32.06z"/> + <path fill="#2d40c7" d="M220.4 193.39l7 25.47 17.98-22.83-24.97-2.64z"/> + <path fill="#3537b8" d="M220.4 193.39l-19.48 39.8 26.49-14.33-7-25.47z"/> + <path fill="#3931b0" d="M227.4 218.86l-21 35.28 34.06-3.58-13.05-31.7z"/> + <path d="M240.46 250.56l3.97 31.5 28.12-10.2zm-34.05 3.58l21-35.28-26.49 14.34z" fill="#3735b8"/> + <path fill="#342892" d="M183.14 261.2l17.78-28 5.49 20.94-23.27 7.07z"/> + <path d="M200.67 353.38l18.83 5.88-28.78-18.57zm-1.36-20.94l20.67 15.9 9.92-20.76-30.72-9.55zm56.57 19.13l2.61-23.66-28.6-.33zm30.5-8.2l-8.36 19.7 33.86-12.62z" fill="#232372"/> + <path fill="#2a2f96" d="M166.22 253.8l8.4-26.83 8.52 34.24-16.92-7.4z"/> + <path d="M174.62 226.97l8.9-22.83-18.43 7.87zm131.47 6.1l-5.87 31.18 27.26-3.32z" fill="#2636a5"/> + <path d="M374.27 262.76v-.05l-1.06-35.55v-.04-.03l-.02-.05v-.01l-5.34-17.74v-.01l-.01-.03-.02-.04v-.01l-15.3-28.86v-.01l-.03-.03-.01-.03-.01-.01-.02-.02-.01-.02-17.5-18.44h-.01l-.01-.02-.04-.03-.02-.02-18.57-13.25-.02-.01a.36.36 0 00-.04-.02.3.3 0 00-.04-.02l-16.12-6.33h-.03l-19.34-6.88h-.05l-.04-.01h-.05l-31.86-2.03h-.05a.46.46 0 00-.05 0h-.02l-20.1 3.63h-.07l-16.37 5.04-.04.01-.04.02-.02.01-29.09 17.02-.03.02-.02.01-.02.02-.02.01-.02.03-.02.01-18.17 20.28-.02.02-.01.02-.02.02v.01l-.01.01-16.78 27.2v.02l-.02.02-.01.04-.02.03v.02l-6.6 23.17v.07a.26.26 0 000 .04v.01l-1.23 35.15v.08a.3.3 0 000 .05v.03l6.28 23.95v.01l.01.02a.52.52 0 00.02.05l.01.02 13.86 27.28.01.01a.5.5 0 00.03.05l9.78 13.18v.01l.04.03a.25.25 0 00.02.03l13.52 12.4.03.02.03.02 16.89 11.43.05.03h.02l20.83 9.06.02.01a.35.35 0 00.05.01l.02.01h.06l34.84 4.1h.05l18.2.5h.01a.57.57 0 00.1 0l.03-.01h.01l26.93-7.59h.04l.02-.02h.02l.03-.02 24.06-13.2h.01l.01-.01a.35.35 0 00.04-.03l.03-.02 15.49-13.21.01-.02.02-.02.02-.02h.01l12-14.32h.01a.53.53 0 00.04-.07l.02-.02 17.01-33.23.01-.02.02-.04v-.02a.3.3 0 000-.05l.02-.02 3.74-22.73v-.04zm-190.16 78.78l-3.5-3.21 7.88 6.17zm51.1 13.35l-12.3-5.76 29.13 2.62zm4.5-104.78l-32.32 3.4 19.93-33.48zm-11.28-30.15l39.48 19.77-27.16 10.16zM240 251.13l3.76 29.79-35.95-26.4zm3.29 30.74l-39.05 12.29 2.63-39.03zm-2.17-30.24l30.27 20.1-26.52 9.62zm.49-.94l27.15-10.16 3.15 30.28zm41.72-34.98l25.17-11.88-2.84 28.27zm21.47 17.06l-34.6 6.32 12.29-22.69zm-35.58 5.93l-22.54-41.38 34.92 18.51zm-1.27-.12l-39.73-19.9 17.08-21.7zM206.6 252.8l-5.06-19.33 24.44-13.23zm-3.35 40.41l-19.31-31.69 21.89-6.65zm39.43-10.04l-19.64 20.99-18-9.14zm29.1-10.46l-7.02 25.24-19.27-15.7zm-1.9-31.72l29.2 23.04L273 271.2zm.58-.87l34.98-6.4-5.58 29.59zm36.24-7.79l2.8-27.95 16.16 21.95zm19.32-5.02l.89 32.02-19.94-25.98zm-43.16-12.53l.67-23.76 24.37 11.94zm-1.05-.02l-34.79-18.44 35.47-5.51zm-54.17 2.96L221.12 194l23.26 2.46zm-.85.88l-24.67 13.36 18.15-37.08zm-21.02 35.2l-21.43 6.5 16.38-25.79zm-3.88 39.2l-26.76-18.96 7.98-11.85zm2.16 2.68l17.98 9.14-22.12 12.22zm40.43-12.9l19.31 15.73-39.24 5.56zm28.34-9.92l28.5 27.56-35.58-2.05zm.76-.73l26.16-7.2 2.35 34.76zm32.81-37.8l20.11 26.2-25.63 3.12zm20.68-6.81l16.99 9.6-16.1 22.25zm.18-1.11l10.52-17.3 6.27 26.79zm-.77-.75l-16.17-21.97 26.83 4.43zm-42.52-35.6l19-17.2 5.45 29.17zm-37.59 5.3l12.05-21.39 23.22 15.9zm-25.16-2.4l13.66-27.78 9.76 30.25zm-20.34 39.15l-16.56-27.64 35.1-10.23zm-17.52 27.79l-8-32.2 24.73 5.85zm-8.82 13.16l-7.35-18.25 15.17 6.63zm28.55 22.07l-4.15 21.4-22.9-40.57zm19.75 10.45l6.28 21.22-28.6-8.9zm41.54-6.09l-6.22 27.57-33.54-21.93zm37.05 1.99l-16.12 14.6-18.76-16.6zm-.58-35.84l24.83 25.08-22.5 9.54zm.5-.99l25.6-3.12-.85 28.13zm43.29-26.53l10.22 34.42-26.56-11.82zm-5.8-29.08l16.68 12.64-10.43 14.04zm-28.7-6.44l15.48-17.72 11.43 22.17zm-.7-.8l-5.41-28.97 20.87 11.27zm-26.45-12.28l-23.11-15.83 42.02-1.28zm-37.47 5.21l-9.69-30.04 21.67 8.78zm-25.2-2.34l-11.22-15.21 24.72-12.24zm-.78.72l-34.37 10.02 23.1-25.32zm-19.7 39.3l-24.5-5.8 8.28-21.27zm-17.47 27.9l-15.5-6.79 7.7-24.6zm-8.64 13.56l-13.34 4.88 5.94-23.25zm23.99 42.64l-29.35-18.18 6.22-22.78zm29.88 10.91l-27.76 4.4-.12-13.07zm-3.53-21.4l32.64 21.35-26.4-.3zm41.3-6.18l18.96 16.78-25.09 10.42zm37.1 2.1l10.02 27.75-26.26-13.03zm.9-.63l22.36-9.47-12.32 37.3zm24.62-39.58l26.56 11.82-27.4 16.4zm17.78-23.47l17.37 12.36-7.42 21.15zm-.2-1.43L356 222.76l6.88 26.38zm-6.96-29.29l4.84-15.02L355 219.96zm-.73-1.17l-11.04-21.42 15.9 6.36zm-32.71-34.12l23.12-1.51-2.91 12.42zm-45.79.4l16.28-20.19 26.1 18.9zm-.96-.48l-8.38-21.96 24.5 1.98zm-1.09.1l-21.41-8.68 13.13-13.03zm-48.1 3.67l9.2-26.56 15.63 14.26zm-24.7 26.33l6.74-27.6 16 2.67zm-10 23.55l-8.65-13.57 16.7-7.13zm-.47 1.23l-7.4 23.6-.98-36.75zm-8.51 27.29l-6.03 23.55-9.46-23.53zm-15.73-1.03l.5-23.13 14.94 23.1zm23.83 21.7l-6 21.96-7.31-17.09zm24.03 42.71l-18.19 2.58-10.4-20.29zm.99.92l.12 12.89-18-10.35zm30.33 9.62l-9.2 19.28-19.19-14.77zm1.08.2l24.32 22.46-33.6-3.03zm1.19-.33l26.65.3-2.43 22.05zm53.54-10.57l1.02 24.92-26.12-14.5zm1.06.1l26.35 13.07-25.34 11.85zm40.87-25.54l13.09 20.46-25.42 16.89zm.92-.53l25.19 3.7-12.26 16.52zm.46-1l26.95-16.12-1.75 19.83zm35.6-38.43l4.75 16.65-11.94 3.85zm-6.34-28.3l13.65 17.18-7.01 8.27zm-12.77-31.3l17.73 12.97-6.1 14.68zm-18.27-8.93l2.86-12.18 12.77 18.42zm-22.6-12.34l-3.07-18.61 26.66 17.07zm-1.17-.62l-25.4-18.41 22.35-.14zm-51.68-21.44l16.59-10.18 7.11 12.1zm-15.93 13.83l-15.35-14.02 28.41 1.07zm-27.01 13.34L192 173.73l25-23.43zM183.2 203.2l-16.32-13.25 23.16-14.74zm-.7.8l-16.85 7.19.82-20.21zm-16.86 47.93l-15.15-23.43 14.1-15.2zm-6.56 27.69l-2.88 14.33-5.67-35.6zm.73 1.7l7.1 16.58-10.14-1.42zm18.42 38.82l-10.7-2.06.68-17.5zm20.21 12.4l-7.6 7.3-10.21-17.55zm.91.58l18.26 14.05-25.85-6.76zm59.58-4.38L285 343.21l-28.5 7.66zm53.9 2.85l-1.43 18.18-23.5-6.53zm26.15-17.21l-14.47 25.34-10.22-8.93zm14.29-17.92l.08 13.27-11.58 2.21zm2.9-22.6l11.77-3.8-13.43 22.57zm8.17-23.33l6.68-7.89-2.18 23.64zm-7.5-29.06l6-14.45 7.77 31.8zm-12.77-30.63l4.22-7.36L361 203.24zm-.73-.84l-12.47-18 16.69 10.64zm-41.85-38.06l12.63-1.35 12.77 17.61zm-25.63-.74l-6.96-11.82 28.43 11.69zm-26.43-2.33l-5.6-9.8 21.93-.22zm-1.12.18l-27.63-1.04 22.02-8.8zm-55.84 22.79l9.9-21.43 14.34-1.3zm-1.78 1.33l-9.04-8.68 19.09-13.06zm-.67.81l-22.5 14.32 13.42-23.04zm-25.43 37.16l-11.28-6.07 12.09-13.7zm-.35 1l-13.7 14.77 2.37-20.86zm-15.49 41.43l-5.8 4.74 6.25-25.14zm.15 1.24l5.91 37.1-12.12-32.02zm18.31 44.2l-.68 17.44-9.47-18.87zm11.64 22.32l9.62 16.53-19.8-18.5zm40.59 27.4l-.42 9.58-25.25-16.29zm1.03.41l13.1 6.13-13.51 3.3zm34.9 3.05l.4 13.44-19.04-9.97zm30.1-8.03l-7.72 18.18-20.43-10.62zm1.21-.16l23.5 6.52-31.2 11.63zm27.18-12.19l9.96 8.7-11.32 8.79zm27.01-18.63l11.49-2.19-25.15 26.14zm13.52-5.07l-.08-12.94 10.58-6.46zm.93-14.78l12.85-21.6-2.36 15.19zm16.38-46.63l1.5 15.87-3.4 4.7zm-7.8-39.77l2.94 2.75 2.94 21.27zm-14.88-24.26l2.76-1.38 7.99 18.1zm-19.32-12.67l4.85-6.94 11.87 17.6zm-.75-.76l-12.65-17.43 17.5 10.48zM300.47 151l-.08-7.58 12.18 6.3zm-1.05-.2l-27.84-11.44 27.76 3.65zm-55.06-12.78l4.43-3.8 14.7 3.61zm-24.2 9.08l8.62-9.29 11.91 1.08zm-2.22.85l-13.05 1.19 21.42-10.21zm-35.88 15l1.44-3.24 11.97-5.95zm-15.72 25.3l-.87-8.44 13.03-12.44zm-.9 1.49l-10.8 12.24 9.95-20.48zM149.34 228l-6.9 1.28 9.11-20.68zm-.22 1.1l-6.6 26.58-.42-25.27zm5.83 66.16l-7.84-6.45-3.76-24.18zm10.99 22.35l-5-1.65-3.36-15zm21.4 20.63l-16.63-9.05-2.67-8.97zm3.03 2.85l7.2 9.18-22.01-17.24zm2.7 1.73l22.9 14.78-14.99-4.69zM235.08 356l17.8 9.31-30.94-6.1zm21.36-3.54l19.92 10.36-19.52 3.1zm52.88-.48l-8.09 6.98-18.2 2.82zm14.95-10.46l.67 4.35-10.45 3.24zm27.12-28l-10.75 19.1-13.68 6.3zm3-3.18l7.2-13.3-7.7 18.24zm15.22-40.99l2.72-3.76-4.37 14.37zm2.62-28.34v-.03l-.04-.28.27-3.56.28 9.22zm-.73-5.24l-2.72-19.7 3.37 11.18zm-8.09-30.73l-4.96-11.25 6.95 13.11zm-14.97-23.23l-9.91-14.7 12.65 13.33zm-33.12-31.79l.67-.48 7.62 5.44zm-1-.57l-5.15-2.67 5.72 2.25zm-43.5-11.24l9.65-1.99 14.54 5.17zm-3.16-.42l-13.15-3.24 22.05 1.4zm-24.9.24l-10.27-.93 14.36-2.59zm-36.2 9.16l5.86-4.4 9.46-2.9zm-4.83 2.3l-5.09 2.53 7.83-4.58zm-21.35 14.64l-6.04 5.77 6.9-7.7zm-28.29 40.69l-2.68 1 10.43-16.94zm-3.5 2.41l2.9-1.07-7.32 16.64zm-7.21 43.17l.15 9.26-.53 1.68zm.5 11.63l2.64 17.02-3.64-13.89zm13.78 35.2l3.4 15.2-10.83-21.32zm10.89 21.71l2.35 7.92-7-9.45zm52.6 40.77l.99 1.57-10.3-4.47zm2.65 2.24l-1.21-1.93 22.4 4.41zm54.85 1.9l-2.35 2.66-12.3-.34zm1.63-.27l14.65-2.27-16.83 4.74zm33.86-12.65l8.59-2.66-15.15 8.32zm13.76-5.7l-.67-4.36 12.55-5.77zm27.2-32.6l-.59 5.86-8.26 9.85zm13.6-24.98l2.12-1.02-9.7 19zm2.83-2.53l-2.38 1.15 4.78-15.75z" fill="url(#a)"/> + <path d="M374.27 262.76v-.05l-1.06-35.55v-.04-.03l-.02-.05v-.01l-5.34-17.74v-.01l-.01-.03-.02-.04v-.01l-15.3-28.86v-.01l-.03-.03-.01-.03-.01-.01-.02-.02-.01-.02-17.5-18.44h-.01l-.01-.02-.04-.03-.02-.02-18.57-13.25-.02-.01a.36.36 0 00-.04-.02.3.3 0 00-.04-.02l-16.12-6.33h-.03l-19.34-6.88h-.05l-.04-.01h-.05l-31.86-2.03h-.05a.46.46 0 00-.05 0h-.02l-20.1 3.63h-.07l-16.37 5.04-.04.01-.04.02-.02.01-29.09 17.02-.03.02-.02.01-.02.02-.02.01-.02.03-.02.01-18.17 20.28-.02.02-.01.02-.02.02v.01l-.01.01-16.78 27.2v.02l-.02.02-.01.04-.02.03v.02l-6.6 23.17v.07a.26.26 0 000 .04v.01l-1.23 35.15v.08a.3.3 0 000 .05v.03l6.28 23.95v.01l.01.02a.52.52 0 00.02.05l.01.02 13.86 27.28.01.01a.5.5 0 00.03.05l9.78 13.18v.01l.04.03a.25.25 0 00.02.03l13.52 12.4.03.02.03.02 16.89 11.43.05.03h.02l20.83 9.06.02.01a.35.35 0 00.05.01l.02.01h.06l34.84 4.1h.05l18.2.5h.01a.57.57 0 00.1 0l.03-.01h.01l26.93-7.59h.04l.02-.02h.02l.03-.02 24.06-13.2h.01l.01-.01a.35.35 0 00.04-.03l.03-.02 15.49-13.21.01-.02.02-.02.02-.02h.01l12-14.32h.01a.53.53 0 00.04-.07l.02-.02 17.01-33.23.01-.02.02-.04v-.02a.3.3 0 000-.05l.02-.02 3.74-22.73v-.04zm-190.16 78.78l-3.5-3.21 7.88 6.17zm51.1 13.35l-12.3-5.76 29.13 2.62zm4.5-104.78l-32.32 3.4 19.93-33.48zm-11.28-30.15l39.48 19.77-27.16 10.16zM240 251.13l3.76 29.79-35.95-26.4zm3.29 30.74l-39.05 12.29 2.63-39.03zm-2.17-30.24l30.27 20.1-26.52 9.62zm.49-.94l27.15-10.16 3.15 30.28zm41.72-34.98l25.17-11.88-2.84 28.27zm21.47 17.06l-34.6 6.32 12.29-22.69zm-35.58 5.93l-22.54-41.38 34.92 18.51zm-1.27-.12l-39.73-19.9 17.08-21.7zM206.6 252.8l-5.06-19.33 24.44-13.23zm-3.35 40.41l-19.31-31.69 21.89-6.65zm39.43-10.04l-19.64 20.99-18-9.14zm29.1-10.46l-7.02 25.24-19.27-15.7zm-1.9-31.72l29.2 23.04L273 271.2zm.58-.87l34.98-6.4-5.58 29.59zm36.24-7.79l2.8-27.95 16.16 21.95zm19.32-5.02l.89 32.02-19.94-25.98zm-43.16-12.53l.67-23.76 24.37 11.94zm-1.05-.02l-34.79-18.44 35.47-5.51zm-54.17 2.96L221.12 194l23.26 2.46zm-.85.88l-24.67 13.36 18.15-37.08zm-21.02 35.2l-21.43 6.5 16.38-25.79zm-3.88 39.2l-26.76-18.96 7.98-11.85zm2.16 2.68l17.98 9.14-22.12 12.22zm40.43-12.9l19.31 15.73-39.24 5.56zm28.34-9.92l28.5 27.56-35.58-2.05zm.76-.73l26.16-7.2 2.35 34.76zm32.81-37.8l20.11 26.2-25.63 3.12zm20.68-6.81l16.99 9.6-16.1 22.25zm.18-1.11l10.52-17.3 6.27 26.79zm-.77-.75l-16.17-21.97 26.83 4.43zm-42.52-35.6l19-17.2 5.45 29.17zm-37.59 5.3l12.05-21.39 23.22 15.9zm-25.16-2.4l13.66-27.78 9.76 30.25zm-20.34 39.15l-16.56-27.64 35.1-10.23zm-17.52 27.79l-8-32.2 24.73 5.85zm-8.82 13.16l-7.35-18.25 15.17 6.63zm28.55 22.07l-4.15 21.4-22.9-40.57zm19.75 10.45l6.28 21.22-28.6-8.9zm41.54-6.09l-6.22 27.57-33.54-21.93zm37.05 1.99l-16.12 14.6-18.76-16.6zm-.58-35.84l24.83 25.08-22.5 9.54zm.5-.99l25.6-3.12-.85 28.13zm43.29-26.53l10.22 34.42-26.56-11.82zm-5.8-29.08l16.68 12.64-10.43 14.04zm-28.7-6.44l15.48-17.72 11.43 22.17zm-.7-.8l-5.41-28.97 20.87 11.27zm-26.45-12.28l-23.11-15.83 42.02-1.28zm-37.47 5.21l-9.69-30.04 21.67 8.78zm-25.2-2.34l-11.22-15.21 24.72-12.24zm-.78.72l-34.37 10.02 23.1-25.32zm-19.7 39.3l-24.5-5.8 8.28-21.27zm-17.47 27.9l-15.5-6.79 7.7-24.6zm-8.64 13.56l-13.34 4.88 5.94-23.25zm23.99 42.64l-29.35-18.18 6.22-22.78zm29.88 10.91l-27.76 4.4-.12-13.07zm-3.53-21.4l32.64 21.35-26.4-.3zm41.3-6.18l18.96 16.78-25.09 10.42zm37.1 2.1l10.02 27.75-26.26-13.03zm.9-.63l22.36-9.47-12.32 37.3zm24.62-39.58l26.56 11.82-27.4 16.4zm17.78-23.47l17.37 12.36-7.42 21.15zm-.2-1.43L356 222.76l6.88 26.38zm-6.96-29.29l4.84-15.02L355 219.96zm-.73-1.17l-11.04-21.42 15.9 6.36zm-32.71-34.12l23.12-1.51-2.91 12.42zm-45.79.4l16.28-20.19 26.1 18.9zm-.96-.48l-8.38-21.96 24.5 1.98zm-1.09.1l-21.41-8.68 13.13-13.03zm-48.1 3.67l9.2-26.56 15.63 14.26zm-24.7 26.33l6.74-27.6 16 2.67zm-10 23.55l-8.65-13.57 16.7-7.13zm-.47 1.23l-7.4 23.6-.98-36.75zm-8.51 27.29l-6.03 23.55-9.46-23.53zm-15.73-1.03l.5-23.13 14.94 23.1zm23.83 21.7l-6 21.96-7.31-17.09zm24.03 42.71l-18.19 2.58-10.4-20.29zm.99.92l.12 12.89-18-10.35zm30.33 9.62l-9.2 19.28-19.19-14.77zm1.08.2l24.32 22.46-33.6-3.03zm1.19-.33l26.65.3-2.43 22.05zm53.54-10.57l1.02 24.92-26.12-14.5zm1.06.1l26.35 13.07-25.34 11.85zm40.87-25.54l13.09 20.46-25.42 16.89zm.92-.53l25.19 3.7-12.26 16.52zm.46-1l26.95-16.12-1.75 19.83zm35.6-38.43l4.75 16.65-11.94 3.85zm-6.34-28.3l13.65 17.18-7.01 8.27zm-12.77-31.3l17.73 12.97-6.1 14.68zm-18.27-8.93l2.86-12.18 12.77 18.42zm-22.6-12.34l-3.07-18.61 26.66 17.07zm-1.17-.62l-25.4-18.41 22.35-.14zm-51.68-21.44l16.59-10.18 7.11 12.1zm-15.93 13.83l-15.35-14.02 28.41 1.07zm-27.01 13.34L192 173.73l25-23.43zM183.2 203.2l-16.32-13.25 23.16-14.74zm-.7.8l-16.85 7.19.82-20.21zm-16.86 47.93l-15.15-23.43 14.1-15.2zm-6.56 27.69l-2.88 14.33-5.67-35.6zm.73 1.7l7.1 16.58-10.14-1.42zm18.42 38.82l-10.7-2.06.68-17.5zm20.21 12.4l-7.6 7.3-10.21-17.55zm.91.58l18.26 14.05-25.85-6.76zm59.58-4.38L285 343.21l-28.5 7.66zm53.9 2.85l-1.43 18.18-23.5-6.53zm26.15-17.21l-14.47 25.34-10.22-8.93zm14.29-17.92l.08 13.27-11.58 2.21zm2.9-22.6l11.77-3.8-13.43 22.57zm8.17-23.33l6.68-7.89-2.18 23.64zm-7.5-29.06l6-14.45 7.77 31.8zm-12.77-30.63l4.22-7.36L361 203.24zm-.73-.84l-12.47-18 16.69 10.64zm-41.85-38.06l12.63-1.35 12.77 17.61zm-25.63-.74l-6.96-11.82 28.43 11.69zm-26.43-2.33l-5.6-9.8 21.93-.22zm-1.12.18l-27.63-1.04 22.02-8.8zm-55.84 22.79l9.9-21.43 14.34-1.3zm-1.78 1.33l-9.04-8.68 19.09-13.06zm-.67.81l-22.5 14.32 13.42-23.04zm-25.43 37.16l-11.28-6.07 12.09-13.7zm-.35 1l-13.7 14.77 2.37-20.86zm-15.49 41.43l-5.8 4.74 6.25-25.14zm.15 1.24l5.91 37.1-12.12-32.02zm18.31 44.2l-.68 17.44-9.47-18.87zm11.64 22.32l9.62 16.53-19.8-18.5zm40.59 27.4l-.42 9.58-25.25-16.29zm1.03.41l13.1 6.13-13.51 3.3zm34.9 3.05l.4 13.44-19.04-9.97zm30.1-8.03l-7.72 18.18-20.43-10.62zm1.21-.16l23.5 6.52-31.2 11.63zm27.18-12.19l9.96 8.7-11.32 8.79zm27.01-18.63l11.49-2.19-25.15 26.14zm13.52-5.07l-.08-12.94 10.58-6.46zm.93-14.78l12.85-21.6-2.36 15.19zm16.38-46.63l1.5 15.87-3.4 4.7zm-7.8-39.77l2.94 2.75 2.94 21.27zm-14.88-24.26l2.76-1.38 7.99 18.1zm-19.32-12.67l4.85-6.94 11.87 17.6zm-.75-.76l-12.65-17.43 17.5 10.48zM300.47 151l-.08-7.58 12.18 6.3zm-1.05-.2l-27.84-11.44 27.76 3.65zm-55.06-12.78l4.43-3.8 14.7 3.61zm-24.2 9.08l8.62-9.29 11.91 1.08zm-2.22.85l-13.05 1.19 21.42-10.21zm-35.88 15l1.44-3.24 11.97-5.95zm-15.72 25.3l-.87-8.44 13.03-12.44zm-.9 1.49l-10.8 12.24 9.95-20.48zM149.34 228l-6.9 1.28 9.11-20.68zm-.22 1.1l-6.6 26.58-.42-25.27zm5.83 66.16l-7.84-6.45-3.76-24.18zm10.99 22.35l-5-1.65-3.36-15zm21.4 20.63l-16.63-9.05-2.67-8.97zm3.03 2.85l7.2 9.18-22.01-17.24zm2.7 1.73l22.9 14.78-14.99-4.69zM235.08 356l17.8 9.31-30.94-6.1zm21.36-3.54l19.92 10.36-19.52 3.1zm52.88-.48l-8.09 6.98-18.2 2.82zm14.95-10.46l.67 4.35-10.45 3.24zm27.12-28l-10.75 19.1-13.68 6.3zm3-3.18l7.2-13.3-7.7 18.24zm15.22-40.99l2.72-3.76-4.37 14.37zm2.62-28.34v-.03l-.04-.28.27-3.56.28 9.22zm-.73-5.24l-2.72-19.7 3.37 11.18zm-8.09-30.73l-4.96-11.25 6.95 13.11zm-14.97-23.23l-9.91-14.7 12.65 13.33zm-33.12-31.79l.67-.48 7.62 5.44zm-1-.57l-5.15-2.67 5.72 2.25zm-43.5-11.24l9.65-1.99 14.54 5.17zm-3.16-.42l-13.15-3.24 22.05 1.4zm-24.9.24l-10.27-.93 14.36-2.59zm-36.2 9.16l5.86-4.4 9.46-2.9zm-4.83 2.3l-5.09 2.53 7.83-4.58zm-21.35 14.64l-6.04 5.77 6.9-7.7zm-28.29 40.69l-2.68 1 10.43-16.94zm-3.5 2.41l2.9-1.07-7.32 16.64zm-7.21 43.17l.15 9.26-.53 1.68zm.5 11.63l2.64 17.02-3.64-13.89zm13.78 35.2l3.4 15.2-10.83-21.32zm10.89 21.71l2.35 7.92-7-9.45zm52.6 40.77l.99 1.57-10.3-4.47zm2.65 2.24l-1.21-1.93 22.4 4.41zm54.85 1.9l-2.35 2.66-12.3-.34zm1.63-.27l14.65-2.27-16.83 4.74zm33.86-12.65l8.59-2.66-15.15 8.32zm13.76-5.7l-.67-4.36 12.55-5.77zm27.2-32.6l-.59 5.86-8.26 9.85zm13.6-24.98l2.12-1.02-9.7 19zm2.83-2.53l-2.38 1.15 4.78-15.75z" fill="url(#b)"/> + <path d="M478.98 166.36c-10.46-25.12-31.64-52.25-48.27-60.82 13.54 26.5 21.37 53.1 24.37 72.93l.03.23.04.26c22.7 61.47 10.34 123.97-7.49 162.17-27.57 59.1-94.32 119.67-198.8 116.71-112.9-3.19-212.34-86.85-230.9-196.43-3.39-17.28 0-26.05 1.7-40.08-2.08 10.82-2.87 13.94-3.9 33.16 0 .4-.03.81-.03 1.22C15.73 388.42 123.45 496 256.33 496A240.56 240.56 0 00493.5 296.37c.4-3.07.73-6.16 1.1-9.27 4.78-41.2-.54-84.52-15.61-120.74z" fill="url(#c)"/> + <path d="M478.98 166.36c-10.46-25.12-31.64-52.25-48.27-60.82 13.54 26.5 21.37 53.1 24.37 72.93l.03.23.04.26c22.7 61.47 10.34 123.97-7.49 162.17-27.57 59.1-94.32 119.67-198.8 116.71-112.9-3.19-212.34-86.85-230.9-196.43-3.39-17.28 0-26.05 1.7-40.08-2.08 10.82-2.87 13.94-3.9 33.16 0 .4-.03.81-.03 1.22C15.73 388.42 123.45 496 256.33 496A240.56 240.56 0 00493.5 296.37c.4-3.07.73-6.16 1.1-9.27 4.78-41.2-.54-84.52-15.61-120.74z" fill="url(#d)"/> + <path d="M17.96 261.41c18.56 109.58 118 193.24 230.9 196.43 104.48 2.96 171.23-57.61 198.8-116.7 17.83-38.2 30.2-100.7 7.5-162.18l-.02-.03-.03-.23a.98.98 0 00-.03-.23l.04.4c8.54 55.66-19.81 109.58-64.12 146.04l-.14.32c-86.34 70.22-168.97 42.36-185.7 30.96a137.2 137.2 0 01-3.5-1.74c-50.34-24.03-71.13-69.84-66.67-109.12-42.51 0-57-35.81-57-35.81s38.16-27.18 88.46-3.54c46.58 21.9 90.33 3.54 90.33 3.54-.09-1.95-41.96-18.59-58.29-34.66-8.72-8.58-12.86-12.72-16.53-15.82a71.5 71.5 0 00-6.23-4.7 281.91 281.91 0 00-4.99-3.3c-17.55-11.4-52.45-10.77-53.6-10.74h-.11c-9.54-12.06-8.87-51.87-8.32-60.18-.12-.52-7.12 3.63-8.03 4.25a175.24 175.24 0 00-23.52 20.13 210.38 210.38 0 00-22.47 26.91l-.01.04v-.04a202.7 202.7 0 00-32.28 72.8c-.11.53-8.66 37.85-4.44 57.2z" fill="url(#e)"/> + <path d="M341.21 166.6a130.73 130.73 0 0122.34 29.1c1.32 1 2.56 1.99 3.61 2.96 54.55 50.2 25.97 121.2 23.84 126.25 44.3-36.46 72.66-90.38 64.12-146.04-27.2-67.73-73.34-95.04-111.01-154.5-1.9-3.01-3.81-6.03-5.67-9.2a73.15 73.15 0 01-2.65-4.98A43.74 43.74 0 01332.2.7a.63.63 0 00-.55-.65.82.82 0 00-.45 0l-.12.07-.17.1c-9.31 4.43-64.49 91.69 10.3 166.38z" fill="url(#f)"/> + <path d="M248.66 133.65l31.85 2.02 19.35 6.88 16.12 6.33 18.57 13.26 17.5 18.44 6.07 11.47c.82.5 2.5 1.58 3.93 2.55.53.37 1 .74 1.5 1.1a130.73 130.73 0 00-22.33-29.1C266.42 91.9 321.6 4.63 330.9.2l.1-.14c-60.44 35.36-80.95 100.76-82.83 133.49v.18z" fill="url(#g)"/> + <path d="M170.74 151.04a243.33 243.33 0 014.99 3.3 111.2 111.2 0 01-.68-58.73c-24.71 11.24-43.94 29.01-57.91 44.7 1.15-.03 36.05-.66 53.6 10.73z" fill="url(#h)"/> + <path d="M148.32 277.45s11.11-41.34 79.53-41.34c7.4 0 28.54-20.61 28.93-26.59 0 0-43.75 18.35-90.33-3.54-50.3-23.64-88.45 3.54-88.45 3.54s14.5 35.81 57 35.81c-4.45 39.28 16.34 85.09 66.68 109.12 1.13.54 2.19 1.12 3.34 1.64-29.4-15.17-53.66-43.83-56.7-78.64z" fill="url(#i)"/> + <path d="M367.16 198.66a47.53 47.53 0 00-3.61-2.95c-.49-.37-.97-.74-1.5-1.1-12.85-9.02-35.85-17.92-58.01-14.07 86.54 43.21 63.3 192.02-56.62 186.4a106.97 106.97 0 01-31.3-6.03 133 133 0 01-7.07-2.89 90.84 90.84 0 01-4.05-1.93l.16.1c16.73 11.4 99.35 39.25 185.7-30.97l.13-.31c2.14-5.05 30.72-76.05-23.83-126.25z" fill="url(#j)"/> + <path d="M478.96 166.35c-10.46-25.12-31.64-52.25-48.27-60.82 13.54 26.5 21.37 53.1 24.37 72.93l.04.4c-27.2-67.73-73.34-95.04-111.01-154.5-1.9-3.01-3.81-6.03-5.67-9.2a73.11 73.11 0 01-2.65-4.98 43.76 43.76 0 01-3.59-9.5.63.63 0 00-.54-.64.82.82 0 00-.46 0l-.12.07-.17.1.1-.14c-60.44 35.36-80.94 100.95-82.82 133.67l.49-.08 31.85 2.02 17.93 6.38 17.55 6.83 18.57 13.26 17.47 18.43s6.01 11.29 6.1 11.48c-13.95-8.3-34.21-14.98-54.1-11.52 86.54 43.21 63.3 192.02-56.61 186.4a106.94 106.94 0 01-31.32-6.04 131.8 131.8 0 01-7.07-2.88 91.96 91.96 0 01-4.05-1.94l.16.1a137.2 137.2 0 01-3.5-1.74c1.13.54 2.18 1.12 3.34 1.64-29.39-15.17-53.65-43.83-56.68-78.64 0 0 11.1-41.34 79.53-41.34 7.4 0 28.54-20.61 28.93-26.59-.09-1.95-41.97-18.59-58.29-34.65-8.72-8.59-12.87-12.73-16.53-15.83a71.5 71.5 0 00-6.24-4.7 111.2 111.2 0 01-.67-58.73c-24.72 11.24-43.94 29-57.92 44.7h-.1c-9.55-12.07-8.87-51.87-8.33-60.18-.11-.52-7.12 3.63-8.03 4.25a175.3 175.3 0 00-23.52 20.12 210.46 210.46 0 00-22.46 26.91.26.26 0 01-.02.04.27.27 0 00.02-.04 202.72 202.72 0 00-32.29 72.8l-.32 1.59a397.49 397.49 0 00-2.77 15.15c-.03.18.02-.18 0 0a279.13 279.13 0 00-3.55 33.53l-.03 1.23c0 132.7 107.72 240.28 240.6 240.28a240.57 240.57 0 00237.16-199.62c.4-3.07.73-6.16 1.1-9.27 4.78-41.2-.54-84.52-15.61-120.74zm-23.87 12.34l.04.26v-.03l-.04-.23z" fill="url(#k)"/> + <path d="M256.78 209.52s-1.02.43-2.9 1.07c-4.7 7.95-21.4 23.1-27.8 23.08-68.42-.3-79.7 40.58-79.7 40.58a87.34 87.34 0 0013.4 39.27 88.03 88.03 0 01-11.46-36.07s11.11-41.34 79.53-41.34c7.4 0 28.54-20.6 28.93-26.59z" fill="url(#l)"/> + <path d="M455.15 178.96v-.03l-.04-.23a2.12 2.12 0 00-.03-.23 5.8 5.8 0 00.04.4 239.04 239.04 0 00-5.17-11.9c-.6-1.31-1.27-2.54-1.9-3.82-1.2-2.47-2.4-4.94-3.65-7.3-.78-1.45-1.6-2.83-2.39-4.25-1.16-2.07-2.31-4.16-3.51-6.16-.88-1.47-1.79-2.87-2.68-4.3-1.17-1.86-2.33-3.72-3.53-5.53-.95-1.43-1.92-2.81-2.89-4.2-1.2-1.73-2.39-3.45-3.6-5.13-1-1.4-2.03-2.75-3.05-4.1a349.15 349.15 0 00-3.68-4.83q-1.58-2.03-3.2-4.03a486.63 486.63 0 00-3.75-4.62q-1.64-2-3.3-3.96l-1.8-2.16c.26.3.5.63.77.94-20.85-24.6-43.47-47.26-63.68-79.15-1.9-3-3.81-6.02-5.67-9.2a72.06 72.06 0 01-2.65-4.97 49.1 49.1 0 01-3.3-8.44l-.15-.5-.13-.57a.63.63 0 00-.55-.64.85.85 0 00-.45 0c-.04.01-.09.05-.12.07l-.18.09a7.4 7.4 0 00-1.46 1.07 17.27 17.27 0 00-.35.31 25.04 25.04 0 00-1.9 2.01l-.07.07.02-.01c-14.41 16.94-51.23 90.58 8.1 156.63-55.54-65.34-20.54-135.96-5.33-154.46a53.66 53.66 0 002.96 7.27 74.3 74.3 0 002.65 4.97c1.86 3.18 3.77 6.2 5.67 9.2 37.68 59.46 83.8 86.78 111.02 154.5a9.12 9.12 0 01-.05-.4 1.7 1.7 0 01.03.23l.04.24v.02c22.7 61.47 10.34 123.98-7.48 162.17a199.36 199.36 0 01-38.22 54.8 199.8 199.8 0 0041.13-57.7c17.82-38.2 30.18-100.7 7.48-162.17z" fill="url(#m)"/> + <path d="M330.9.2c.04-.04.1-.12.1-.14-54.44 31.85-76.47 88.08-81.68 122.84 5.98-32.12 26.57-81.17 72.7-112.14 3.8-6 7.15-9.73 8.89-10.56z" fill="url(#n)"/> + <path d="M390.86 325.23l.14-.32c2.13-5.05 30.7-76.05-23.84-126.25a47.53 47.53 0 00-3.61-2.96c-.49-.36-.97-.73-1.5-1.1-12.42-8.7-34.32-17.31-55.78-14.4h-.05q-1.1.15-2.18.34c85.56 42.72 63.8 188.67-52.6 186.53l.95.05c118 4.62 141.26-140.09 59.27-185.46 17.77-.17 34.95 6.32 45.57 13.16.54.35 1.03.7 1.53 1.04a47.2 47.2 0 013.73 2.81c56.47 48.03 30.7 120.1 28.76 125.23a72.28 72.28 0 01-.12.32" fill="url(#o)"/> + <path d="M167.09 208.38c39.38 17.06 75.93 6.22 87 2.14-10.2 3.52-47.89 14.14-87.64-4.54-45.22-21.25-80.62-1.44-87.32 2.78l-.32.2-.26.17-.2.13-.13.08-.09.06.12.26.14.31v.06l.21.45c.34.72.86 1.75 1.58 3 5.34 9.45 21.43 31.63 54.89 31.63-4.32 38.11 15.12 82.35 62.24 106.9-45-26-64-73-58.7-110.49-34.76-.92-50.31-21.76-54.75-30.59a95.75 95.75 0 0183.23-2.55z" fill="url(#p)"/> + <path d="M175.69 154.2l-1.18-.68 1.22.82-.04-.13zm-.25-.88a111.35 111.35 0 01-.39-57.71c-23.43 10.65-41.92 27.17-55.68 42.23 13.1-12.77 30.1-26.47 50.78-35.86-1.28 9.82-2.39 29.93 5.3 51.34z" fill="url(#q)"/> + <path d="M23.76 286.6l-.2-.69a220.74 220.74 0 01-5.6-24.5c-1.84-8.43-1.25-20.27 0-30.99-.93 5.57-1.51 11.23-2.2 24.07 0 .4-.03.81-.03 1.22C15.73 360.73 83.2 450 177.2 482.68 95.72 451.48 35.35 376.8 23.76 286.6z" fill="url(#r)"/> + <path d="M21.83 262.38c-4.21-19.35 4.33-56.67 4.45-57.2a202.7 202.7 0 0132.28-72.8v0a210.46 210.46 0 0122.47-26.9 175.23 175.23 0 0123.51-20.13 29.2 29.2 0 011.02-.63c-.08 18.28.95 49.12 9.42 59.23h.11c1.16-.06 36.18-1.6 54.1 9.33a273.28 273.28 0 015.09 3.16 71.85 71.85 0 016.38 4.53c3.76 3.01 8.03 7.04 17 15.4 13 12.08 41.36 24.11 53.6 29.84-11.92-6-40.07-18.84-52.77-31.34-8.72-8.58-12.86-12.72-16.53-15.83a71.5 71.5 0 00-6.23-4.7 281.91 281.91 0 00-4.99-3.3c-17.55-11.39-52.45-10.76-53.6-10.73h-.11c-8.72-11.03-8.9-45.22-8.46-57.36l.06-1.3.02-.43a119.8 119.8 0 01.02-.36l.04-.73c0-.03-.04-.05-.1-.04h-.07a1.02 1.02 0 00-.15.04l-.13.05a4.26 4.26 0 00-.39.15l-.23.11a16.6 16.6 0 00-.5.24l-.3.15-.24.13-.36.19-.2.1a95.1 95.1 0 00-5.36 3.13 175.24 175.24 0 00-23.52 20.12 210.38 210.38 0 00-22.47 26.91l-.01.04v-.04a202.7 202.7 0 00-32.28 72.8c-.11.52-8.66 37.84-4.44 57.2 15.8 93.25 90.17 167.72 181.56 189.81-89.6-23.23-162.11-96.9-177.69-188.84z" fill="url(#s)"/> + <path d="M478.98 166.36c-9.23-22.17-26.8-45.88-42.23-57.05l-.43-.3q-.71-.5-1.43-.98l-.54-.36q-.67-.43-1.34-.83l-.51-.31a42.52 42.52 0 00-1.79-.99c.65 1.27 1.28 2.55 1.9 3.82a394.89 394.89 0 011.15 2.37c11.67 24.42 18.56 48.45 21.32 66.75l.04.4c8.54 55.66-19.81 109.58-64.12 146.04l-.14.3c-55.08 44.8-108.64 49.69-144.55 44.4 35.78 6.68 92.23 3.86 150.37-43.42l.13-.31c44.31-36.46 72.66-90.39 64.13-146.04a12.55 12.55 0 01-.05-.4c-2.45-16.25-8.16-37.01-17.57-58.54a159 159 0 0126.32 37.48c17.04 34.76 24.73 77.04 22.23 117.82-.19 3.07-.34 6.13-.58 9.17-13.07 112.5-106.97 202.84-225.78 209.5a245.66 245.66 0 01-47.5-1.93 242.63 242.63 0 0038.32 3.05c119 0 217.82-86.29 237.16-199.63.4-3.07.73-6.16 1.1-9.27 4.78-41.2-.54-84.52-15.61-120.74zm-23.83 12.6v-.03l-.04-.23.04.26z" fill="url(#t)"/> +</svg> diff --git a/devtools/startup/aboutdevtools/images/external-link.svg b/devtools/startup/aboutdevtools/images/external-link.svg new file mode 100644 index 0000000000..956c09ba63 --- /dev/null +++ b/devtools/startup/aboutdevtools/images/external-link.svg @@ -0,0 +1,7 @@ +<!-- 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/. --> +<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"> + <path fill="context-fill #003eaa" d="M14.923 1.618A1 1 0 0 0 14 1H9a1 1 0 0 0 0 2h2.586L8.293 6.293a1 1 0 1 0 1.414 1.414L13 4.414V7a1 1 0 0 0 2 0V2a1 1 0 0 0-.077-.382z"/> + <path fill="context-fill #0060df" d="M14 10a1 1 0 0 0-1 1v2H3V3h2a1 1 0 0 0 0-2H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-3a1 1 0 0 0-1-1z"/> +</svg> diff --git a/devtools/startup/aboutdevtools/images/feature-console.svg b/devtools/startup/aboutdevtools/images/feature-console.svg new file mode 100644 index 0000000000..f24cad3606 --- /dev/null +++ b/devtools/startup/aboutdevtools/images/feature-console.svg @@ -0,0 +1,9 @@ +<!-- 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/. --> +<svg viewBox="0 0 220 120" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path fill-rule="evenodd" d="M159.832 106.154c6.121 0 11.427-4.63 11.427-10.749v-72a4.896 4.896 0 00-3.024-4.532 4.904 4.904 0 00-1.876-.373H54.399a4.899 4.899 0 00-4.9 4.903v.001l.001 72c0 6.12 5.306 10.75 11.427 10.75h98.905zM54.5 95.404c0 2.994 2.688 5.75 6.427 5.75h98.905c3.739 0 6.427-2.756 6.427-5.749V37.462H54.5v57.942z" fill="#0080FF"/> + <path fill-rule="evenodd" d="M61.117 28.88a3.19 3.19 0 01-3.187 3.191 3.19 3.19 0 010-6.381 3.19 3.19 0 013.187 3.19zm10.628 0a3.188 3.188 0 11-5.442-2.254 3.19 3.19 0 013.474-.693 3.188 3.188 0 011.968 2.947zm10.385 0a3.19 3.19 0 01-3.187 3.191 3.19 3.19 0 010-6.381 3.19 3.19 0 013.187 3.19" fill="#fff"/> + <path d="M77.575 88h12.586M65.863 74.33l6.123 6.127-6.123 6.13V74.33z" stroke="#00C7D8" stroke-width="3" stroke-linecap="round"/> + <path d="M156.5 47h-43a1.5 1.5 0 000 3h43a1.5 1.5 0 000-3zM102.5 47h-37a1.5 1.5 0 000 3h37a1.5 1.5 0 000-3zM144.5 59h-23a1.5 1.5 0 000 3h23a1.5 1.5 0 000-3zM112.5 59h-47a1.5 1.5 0 000 3h47a1.5 1.5 0 000-3z" fill="#1C2142"/> +</svg> diff --git a/devtools/startup/aboutdevtools/images/feature-debugger.svg b/devtools/startup/aboutdevtools/images/feature-debugger.svg new file mode 100644 index 0000000000..d38a1aff6b --- /dev/null +++ b/devtools/startup/aboutdevtools/images/feature-debugger.svg @@ -0,0 +1,9 @@ +<!-- 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/. --> +<svg viewBox="0 0 220 120" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path d="M169.5 73.68h-119a2.5 2.5 0 000 5h119a2.5 2.5 0 100-5z" fill="#00C7D8"/> + <path d="M81.73 89.91H51.5a2.5 2.5 0 000 5h30.23a2.5 2.5 0 000-5z" fill="#0080FF"/> + <path d="M136.15 89.91H95.78a2.5 2.5 0 000 5h40.37a2.5 2.5 0 100-5z" fill="#1C2142"/> + <path d="M153.2 45.44v-3.97c0-3.04 2.45-5.5 5.47-5.5h10.62M141.37 55h7.78m7.17 0h7.78m-67.83 0h8.88m8.17 0h8.88M99.57 27h4.5c3.45 0 6.24 2.8 6.24 6.27v12.2M55.85 55h3.46m-7.22-11.82l2.7-4.15a6.8 6.8 0 019.43-2l11.1 7.3m-1.47-10.54l2.32 11.09-11.03 2.33m98.58-17.66l6.38 6.42-6.38 6.42V29.55zm-46.13 9.53l-7.29 7.32-7.29-7.32h14.58z" stroke="#0080FF" stroke-width="4" stroke-linecap="round"/> +</svg> diff --git a/devtools/startup/aboutdevtools/images/feature-inspector.svg b/devtools/startup/aboutdevtools/images/feature-inspector.svg new file mode 100644 index 0000000000..953c498983 --- /dev/null +++ b/devtools/startup/aboutdevtools/images/feature-inspector.svg @@ -0,0 +1,9 @@ +<!-- 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/. --> +<svg viewBox="0 0 220 120" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path d="M134.97 77.52h-64.4a8.92 8.92 0 01-8.87-8.96V44.42a8.92 8.92 0 018.88-8.96h64.4c4.9 0 8.87 4 8.87 8.96v24.14a8.91 8.91 0 01-8.88 8.96" fill="#0080FF"/> + <path d="M175.4 90.58H30.6M49.64 8.61v97.13V8.61zm105.54 0v97.13V8.61zm20.22 12.95H30.6h144.8z" stroke="#0080FF" stroke-width="4" stroke-linecap="round"/> + <path d="M122.97 113.11a15.27 15.27 0 01-15.25-15.32V58.96h66.7c8.42 0 15.25 6.86 15.25 15.32v23.51c0 8.46-6.83 15.32-15.25 15.32h-51.45z" fill="#1C2142"/> + <path d="M179.15 72.36h-12.7a1.47 1.47 0 100 2.94h12.7a1.47 1.47 0 100-2.94zM129.31 96.9h-12.7a1.47 1.47 0 100 2.94h12.7a1.47 1.47 0 100-2.94zM149.83 96.9h-12.7a1.47 1.47 0 100 2.94h12.7a1.47 1.47 0 100-2.94zM157.65 72.36h-41.04a1.47 1.47 0 100 2.94h41.04a1.47 1.47 0 100-2.94zM179.15 85.12h-62.54a1.47 1.47 0 100 2.94h62.54a1.47 1.47 0 100-2.94z" fill="#00C7D8"/> +</svg> diff --git a/devtools/startup/aboutdevtools/images/feature-memory.svg b/devtools/startup/aboutdevtools/images/feature-memory.svg new file mode 100644 index 0000000000..f2bc1e4fbc --- /dev/null +++ b/devtools/startup/aboutdevtools/images/feature-memory.svg @@ -0,0 +1,9 @@ +<!-- 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/. --> +<svg viewBox="0 0 220 120" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path d="M152.49 65.74h2.5V64.2l-1.38-.7-1.12 2.24zm0-19.47l1.13 2.23 1.37-.7v-1.53h-2.5zM71 45.52h-2.5v1.54l1.37.7L71 45.51zm0 19.46l-1.13-2.23-1.37.7v1.53H71zm4.87 42.44h71.75v-5H75.87v5zm71.75 0c4.07 0 7.37-3.3 7.37-7.36h-5c0 1.3-1.06 2.36-2.37 2.36v5zm7.37-7.36V65.74h-5v34.32h5zM153.6 63.5c-3.3-1.67-5.17-4.07-5.17-7.5h-5c0 5.84 3.46 9.7 7.92 11.96l2.25-4.46zm-5.17-7.5c0-3.45 1.88-5.84 5.18-7.5l-2.26-4.47c-4.46 2.25-7.92 6.12-7.92 11.96h5zm6.55-9.74v-24.4h-5v24.4h5zm0-24.4c0-4.07-3.3-7.37-7.37-7.37v5c1.31 0 2.37 1.06 2.37 2.36h5zm-7.37-7.37H75.87v5h71.75v-5zm-71.75 0a7.36 7.36 0 00-7.37 7.36h5c0-1.3 1.06-2.36 2.37-2.36v-5zm-6 33.25c3.3 1.66 5.18 4.06 5.18 7.5h5c0-5.84-3.46-9.7-7.92-11.96l-2.26 4.46zm5.18 7.5c0 3.44-1.88 5.84-5.18 7.5l2.26 4.47c4.46-2.26 7.92-6.12 7.92-11.97h-5zm-6.55 9.73v35.52h5V64.98h-5zm0-43.12v23.66h5V21.86h-5zm0 78.64c0 1.63.49 3.41 1.82 4.8 1.35 1.42 3.28 2.12 5.55 2.12v-5c-1.23 0-1.73-.36-1.94-.57-.23-.24-.43-.67-.43-1.35h-5z" fill="#0080FF"/> + <path d="M118 85v5.22M129 85v5.22M107 85v5.22M96 85v5.22" stroke="#00C7D8" stroke-width="3" stroke-linecap="round"/> + <path d="M130.32 45h4.65m-4.65 8h4.65m-4.65 9h4.65M91 45h4.65M91 53h4.65M91 62h4.65M104 37.08v-4.63m8.5 4.63v-4.63m8.5 4.63v-4.63m-17 41.84v-4.63m8.5 4.63v-4.63m8.5 4.63v-4.63" stroke="#0022A9" stroke-width="4" stroke-linecap="round"/> + <path d="M125.9 37H99.76A3.76 3.76 0 0096 40.75v23.84a3.76 3.76 0 003.75 3.74h26.16a3.76 3.76 0 003.75-3.74V40.75a3.76 3.76 0 00-3.75-3.75z" stroke="#0022A9" stroke-width="4" stroke-linecap="round"/> +</svg> diff --git a/devtools/startup/aboutdevtools/images/feature-network.svg b/devtools/startup/aboutdevtools/images/feature-network.svg new file mode 100644 index 0000000000..d37e7d5db7 --- /dev/null +++ b/devtools/startup/aboutdevtools/images/feature-network.svg @@ -0,0 +1,10 @@ +<!-- 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/. --> +<svg viewBox="0 0 220 120" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path d="M48.47 33.67H170.1M164 38.7V30m-36 8.7V30m-37 8.7V30m-34 8.7V30" stroke="#031537" stroke-width="5" stroke-linecap="round"/> + <path d="M102.57 55H51.5a2.5 2.5 0 000 5h51.07a2.5 2.5 0 100-5z" fill="#0080FF"/> + <path d="M163.58 87H135.5a2.5 2.5 0 100 5h28.08a2.5 2.5 0 100-5z" fill="#00C7D8"/> + <path d="M144.58 55H116.5a2.5 2.5 0 100 5h28.08a2.5 2.5 0 100-5z" fill="#0080FF"/> + <path fill-rule="evenodd" d="M89 73.5a2.5 2.5 0 012.51-2.5h82.78a2.5 2.5 0 110 5H91.51A2.5 2.5 0 0189 73.5z" fill="#1C2142"/> +</svg> diff --git a/devtools/startup/aboutdevtools/images/feature-performance.svg b/devtools/startup/aboutdevtools/images/feature-performance.svg new file mode 100644 index 0000000000..520527c91a --- /dev/null +++ b/devtools/startup/aboutdevtools/images/feature-performance.svg @@ -0,0 +1,14 @@ +<!-- 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/. --> +<svg viewBox="0 0 220 120" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path d="M156.54 32.33v57.72c0 4.05-3.45 7.34-7.7 7.34H57.16c-4.26 0-7.7-3.29-7.7-7.34V32.33" stroke="#0080FF" stroke-width="5"/> + <path fill-rule="evenodd" d="M154.44 18.45H51.55a2.1 2.1 0 00-2.1 2.1v10.33h107.09V20.56a2.1 2.1 0 00-2.1-2.1z" fill="#0080FF"/> + <path d="M154.44 18.45H51.55a2.1 2.1 0 00-2.1 2.1v10.33h107.09V20.56a2.1 2.1 0 00-2.1-2.1z" stroke="#0080FF" stroke-width="5"/> + <path fill-rule="evenodd" d="M57.32 25.44a2.8 2.8 0 01-2.75 2.84 2.8 2.8 0 01-2.75-2.84 2.8 2.8 0 012.75-2.84 2.8 2.8 0 012.75 2.84zm9.17 0a2.8 2.8 0 01-2.75 2.84A2.8 2.8 0 0161 25.44a2.8 2.8 0 012.75-2.84 2.8 2.8 0 012.75 2.84zm8.96 0a2.8 2.8 0 01-2.75 2.84 2.8 2.8 0 01-2.75-2.84 2.8 2.8 0 012.75-2.84 2.8 2.8 0 012.75 2.84zM128.79 103.63h49.97a34.28 34.28 0 002.85-13.73A34.54 34.54 0 00147 55.4h-.17a34.54 34.54 0 00-34.6 34.49c0 4.88 1.02 9.52 2.85 13.73h13.7z" fill="#fff"/> + <path d="M128.79 103.63h49.97a34.28 34.28 0 002.85-13.73A34.54 34.54 0 00147 55.4h-.17a34.54 34.54 0 00-34.6 34.49c0 4.88 1.02 9.52 2.85 13.73h13.7v0z" stroke="#00C7D8" stroke-width="5" stroke-linecap="round"/> + <path d="M124.08 91.3h6.04m16.42-25.26v6.5-6.5zm-17.5 8.33l4.27 4.25-4.27-4.25z" stroke="#0080FF" stroke-width="3" stroke-linecap="round"/> + <path fill-rule="evenodd" d="M155.2 87.76c0 4.56-3.7 8.24-8.28 8.24a8.26 8.26 0 01-8.26-8.24 8.25 8.25 0 0116.54 0z" fill="#0022A9"/> + <path fill-rule="evenodd" d="M146.92 87.76l17.37-17.3z" fill="#005482"/> + <path d="M146.92 87.76l17.37-17.3" stroke="#137EFF" stroke-width="3" stroke-linecap="round"/> +</svg> diff --git a/devtools/startup/aboutdevtools/images/feature-responsive.svg b/devtools/startup/aboutdevtools/images/feature-responsive.svg new file mode 100644 index 0000000000..e76870ea7b --- /dev/null +++ b/devtools/startup/aboutdevtools/images/feature-responsive.svg @@ -0,0 +1,14 @@ +<!-- 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/. --> +<svg viewBox="0 0 220 120" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path d="M119.5 52h-60a1.5 1.5 0 000 3h60a1.5 1.5 0 000-3zM114.5 65h-55a1.5 1.5 0 000 3h55a1.5 1.5 0 000-3zM97.5 40h-38a1.5 1.5 0 000 3h38a1.5 1.5 0 000-3zM97.5 77h-38a1.5 1.5 0 000 3h38a1.5 1.5 0 000-3z" fill="#00C7D8"/> + <path d="M156.53 28.7v59.15c0 4.16-3.55 7.52-7.92 7.52H54.38c-4.37 0-7.92-3.36-7.92-7.52V28.69" stroke="#0080FF" stroke-width="5"/> + <path fill-rule="evenodd" d="M154.37 14.46H48.63c-1.2 0-2.17.97-2.17 2.16V27.2h110.07V16.62c0-1.2-.97-2.16-2.16-2.16" fill="#0080FF"/> + <path d="M154.37 14.46H48.63c-1.2 0-2.17.97-2.17 2.16V27.2h110.07V16.62c0-1.2-.97-2.16-2.16-2.16v0z" stroke="#0080FF" stroke-width="5"/> + <path fill-rule="evenodd" d="M54.55 21.63c0 1.6-1.27 2.91-2.83 2.91a2.87 2.87 0 01-2.82-2.91c0-1.6 1.26-2.91 2.82-2.91 1.56 0 2.83 1.3 2.83 2.91zm9.43 0c0 1.6-1.27 2.91-2.83 2.91a2.87 2.87 0 01-2.83-2.91c0-1.6 1.27-2.91 2.83-2.91s2.83 1.3 2.83 2.91zm9.2 0c0 1.6-1.26 2.91-2.82 2.91a2.87 2.87 0 01-2.83-2.91c0-1.6 1.27-2.91 2.83-2.91s2.83 1.3 2.83 2.91zM131.85 25.85h51.02v82.53h-51.02V25.85z" fill="#fff"/> + <path d="M173.5 47.27h-32.2a1.5 1.5 0 000 3h32.2a1.5 1.5 0 100-3zM168.6 56.27h-27.3a1.5 1.5 0 000 3h27.3a1.5 1.5 0 100-3zM164.32 37.27H141.3a1.5 1.5 0 000 3h23.02a1.5 1.5 0 100-3zM160.32 66.27H141.3a1.5 1.5 0 000 3h19.02a1.5 1.5 0 100-3z" fill="#1C2142"/> + <path d="M174.15 106.93h-34.49a9.27 9.27 0 01-9.26-9.23V33.64a9.27 9.27 0 019.26-9.24h34.49c5.1 0 9.26 4.16 9.26 9.24V97.7a9.28 9.28 0 01-9.26 9.23v0z" stroke="#0E59E1" stroke-width="5" stroke-linecap="round"/> + <path d="M183.41 82h-53" stroke="#0E59E1" stroke-width="4" stroke-linecap="round"/> + <path fill-rule="evenodd" d="M156.4 97.68a3.94 3.94 0 110-7.88 3.94 3.94 0 010 7.88z" fill="#0080FF"/> +</svg> diff --git a/devtools/startup/aboutdevtools/images/feature-storage.svg b/devtools/startup/aboutdevtools/images/feature-storage.svg new file mode 100644 index 0000000000..f816ee5ca4 --- /dev/null +++ b/devtools/startup/aboutdevtools/images/feature-storage.svg @@ -0,0 +1,9 @@ +<!-- 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/. --> +<svg viewBox="0 0 220 120" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path d="M146.02 101.91h-69.6c-4.95 0-8.99-3.22-8.99-7.15V81.88c0-3.93 4.04-7.15 8.99-7.15h69.6c4.94 0 8.98 3.22 8.98 7.15v12.88c0 3.93-4.04 7.15-8.98 7.15h0z" stroke="#0022A9" stroke-width="5" stroke-linecap="round"/> + <path d="M146.02 74.73h-69.6c-4.95 0-8.99-3.21-8.99-7.15V54.7c0-3.93 4.04-7.15 8.99-7.15h69.6c4.94 0 8.98 3.22 8.98 7.15v12.88c0 3.94-4.04 7.15-8.98 7.15h0z" stroke="#137EFF" stroke-width="5" stroke-linecap="round"/> + <path d="M146.02 47.56h-69.6c-4.95 0-8.99-3.22-8.99-7.15V27.53c0-3.94 4.04-7.15 8.99-7.15h69.6c4.94 0 8.98 3.21 8.98 7.15V40.4c0 3.93-4.04 7.15-8.98 7.15h0z" stroke="#00C7D8" stroke-width="5" stroke-linecap="round"/> + <path fill-rule="evenodd" d="M81.8 37.63a3.8 3.8 0 11.01-7.62 3.8 3.8 0 010 7.62zm3.8 23.18a3.8 3.8 0 11-7.61.02 3.8 3.8 0 017.61-.02zm-3.8 30.82a3.8 3.8 0 11.01-7.62 3.8 3.8 0 010 7.62z" fill="#1C2142"/> +</svg> diff --git a/devtools/startup/aboutdevtools/images/feature-visualediting.svg b/devtools/startup/aboutdevtools/images/feature-visualediting.svg new file mode 100644 index 0000000000..18c0834916 --- /dev/null +++ b/devtools/startup/aboutdevtools/images/feature-visualediting.svg @@ -0,0 +1,9 @@ +<!-- 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/. --> +<svg viewBox="0 0 220 120" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path d="M74.9 77.01l76.85-33.52" stroke="#00C7D8" stroke-width="3" stroke-linecap="round"/> + <path d="M119.1 27h-15.8 15.8zm-17.28.38a7.38 7.38 0 10-14.76 0 7.38 7.38 0 0014.76 0h0zM108.83 90.88h15.8-15.8zm17.28 1.38a7.38 7.38 0 1114.75 0 7.38 7.38 0 01-14.75 0h0z" stroke="#0022A9" stroke-width="4" stroke-linecap="round"/> + <path d="M71 93.02c18.14 4.2 36.25-7.22 40.47-25.47l.9-3.94 2-8.6c4.2-18.25 17.2-30.19 35.33-26" stroke="#0080FF" stroke-width="5" stroke-linecap="round"/> + <path d="M71.16 99.3a6.15 6.15 0 100-12.3 6.15 6.15 0 000 12.3zM150.16 33.3a6.15 6.15 0 100-12.3 6.15 6.15 0 000 12.3z" fill="#0080FF"/> +</svg> diff --git a/devtools/startup/aboutdevtools/images/otter.svg b/devtools/startup/aboutdevtools/images/otter.svg new file mode 100644 index 0000000000..25e251c83b --- /dev/null +++ b/devtools/startup/aboutdevtools/images/otter.svg @@ -0,0 +1,29 @@ +<!-- 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/. --> +<svg width="566" height="368" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path d="M115.24 184.24a35.8 35.8 0 00-17.78 5.28 32.24 32.24 0 01-17.78 4.82 32.22 32.22 0 01-17.78-4.82 36 36 0 00-19.7-5.32 36 36 0 00-19.68 5.3 32.22 32.22 0 01-17.78 4.82 2 2 0 000 4 36 36 0 0019.68-5.3 32.22 32.22 0 0117.78-4.82 32.22 32.22 0 0117.8 4.82 36 36 0 0019.68 5.3 36 36 0 0019.68-5.3 32.22 32.22 0 0117.78-4.82h.76v-.76c-.96-1-1.84-2.08-2.66-3.2zm-22.5-3.56a1 1 0 00.4 0l1.84-.88A1.02 1.02 0 1094 178l-1.76.84a1.02 1.02 0 10.4 2l.1-.16zm-51.72-7.34a33.04 33.04 0 0118.26 4.94c1.26.68 2.54 1.38 3.9 2a1 1 0 00.42 0 1.02 1.02 0 10.42-2 56.9 56.9 0 01-3.8-2 35.16 35.16 0 00-19.2-5.18 1 1 0 100 2v.24zm38.1 8.14a1 1 0 100 2c2.05-.02 4.1-.2 6.12-.52a1 1 0 00.43-1.82 1.01 1.01 0 00-.75-.18c-1.92.32-3.86.5-5.8.52zm37.7 18.22a1 1 0 100 2c1.38 0 2.62 0 3.8.18a8 8 0 01-1.38-2c-.8-.14-1.56-.18-2.42-.18zm294.46 27.5a36 36 0 00-19.68 5.3 32.22 32.22 0 01-17.78 4.82 2 2 0 000 4 36 36 0 0019.68-5.3 32.22 32.22 0 0117.6-4.82c.28-1.36.58-2.7.92-4h-.74zm149.84 0a36 36 0 00-19.68 5.3 35.15 35.15 0 01-35.56 0 36 36 0 00-19.68-5.3 34.64 34.64 0 00-16.1 3.44 135 135 0 01.88 4 30.75 30.75 0 0115.22-3.48A32.22 32.22 0 01504 236a39.12 39.12 0 0039.36 0 32.22 32.22 0 0117.78-4.82 2 2 0 100-4l-.02.02zm-80.9-12.6a1 1 0 00-.62 1.74 1 1 0 00.72.26h.1c1.51-.16 3.04-.24 4.56-.24a1 1 0 00.7-1.7 1 1 0 00-.7-.3c-1.59 0-3.18.08-4.76.24zm-70.22-.26a1 1 0 100 2c1.85 0 3.7.12 5.54.36.28-.68.56-1.3.84-2-2.11-.28-4.25-.4-6.38-.36zm98.9 35.5a56.9 56.9 0 01-3.8-2 35.16 35.16 0 00-19.2-5.18 1 1 0 100 2 33.06 33.06 0 0118.26 4.94c1.26.68 2.54 1.38 3.9 2a1 1 0 00.42 0 1.02 1.02 0 10.42-2v.24zm51.88-7.14c-1.58 0-3.16.08-4.74.24a1 1 0 00-.62 1.74 1 1 0 00.72.26h.1a38.6 38.6 0 014.56-.22 1 1 0 00.7-1.7 1 1 0 00-.7-.3l-.02-.02zm-21.8 6.58l-1.76.84a1 1 0 00.08 1.8c.24.1.5.11.74.02l1.84-.88a1 1 0 10-.9-1.78zm-9.16 3.06c-1.93.3-3.87.47-5.82.48a1 1 0 100 2c2.05-.02 4.1-.2 6.12-.52a1.01 1.01 0 10-.32-2l.02.04zm-379.48 11.38A64.28 64.28 0 01138 221.54c-23.52 8-38.3 19.48-38.3 32.3 0 24 52 43.5 116 43.5 3.75 0 7.45-.07 11.12-.2-1.52-.88-3-1.78-4.4-2.7-30.86.88-57.04-10.18-72.08-30.72zm164.1 70.78a36 36 0 00-19.68 5.3 35.15 35.15 0 01-35.56 0 39.12 39.12 0 00-39.36 0 35.15 35.15 0 01-35.56 0 36 36 0 00-19.68-5.3 36 36 0 00-19.68 5.3 32.22 32.22 0 01-17.78 4.82 2 2 0 000 4 36 36 0 0019.68-5.3 35.14 35.14 0 0135.56 0 39.14 39.14 0 0039.36 0 35.16 35.16 0 0135.56 0 39.12 39.12 0 0039.36 0 32.22 32.22 0 0117.78-4.82 2 2 0 100-4zm-80.68-10.62c1.52-.16 3.04-.24 4.56-.24a1 1 0 00.7-1.7 1 1 0 00-.7-.3c-1.6 0-3.2.07-4.78.24a1 1 0 00-.62 1.74 1 1 0 00.72.26h.12zM215.12 331a1 1 0 00.4 0l1.84-.88a1 1 0 10-.9-1.78l-1.76.84a1.02 1.02 0 10.4 2l.02-.18z" fill="#EAEAEE"/> + <path d="M201.54 333.8c2.05-.02 4.1-.2 6.12-.52a1.03 1.03 0 00.66-.4 1.02 1.02 0 00.04-1.13 1.02 1.02 0 00-1.02-.47c-1.93.3-3.87.47-5.82.48a1 1 0 100 2l.02.04zm-19.88-5.2c1.26.68 2.54 1.38 3.9 2a1 1 0 00.42 0 1.02 1.02 0 10.42-2 56.9 56.9 0 01-3.8-2 35.16 35.16 0 00-19.2-5.18 1 1 0 100 2c6.46-.1 12.81 1.7 18.26 5.18zm101.48 31.06c-1.93.3-3.87.47-5.82.48a1 1 0 100 2c2.05-.02 4.1-.2 6.12-.52a1.03 1.03 0 00.66-.4 1.02 1.02 0 00.04-1.13 1 1 0 00-1.02-.47l.02.04zm-20.92-2.5a56.9 56.9 0 01-3.8-2 35.16 35.16 0 00-19.2-5.18 1 1 0 100 2 33.06 33.06 0 0118.26 4.94c1.26.68 2.54 1.38 3.9 2a1 1 0 00.42 0 1.02 1.02 0 10.42-2v.24zm30.08-.56l-1.76.84a1 1 0 00.08 1.8c.24.1.5.11.74.02l1.84-.88a.99.99 0 00.55-.58 1.01 1.01 0 00-.3-1.11.98.98 0 00-.76-.23 1 1 0 00-.39.14zM314 350c-1.58 0-3.17.08-4.74.24a1 1 0 00-.62 1.74 1 1 0 00.72.26h.1c1.51-.16 3.04-.24 4.56-.22a1 1 0 00.7-1.7 1 1 0 00-.7-.3L314 350z" fill="#EAEAEE"/> + <path d="M321.2 223.08c.24-.44.52-.86.78-1.28l-.66-.48 1.38-.6a20.29 20.29 0 014.58-4.58l-1.3-4.3c-4.94 4-13.38 6.24-19.56 7.38 4.61 2.24 9 4.92 13.1 8 .4-1.44.97-2.82 1.68-4.14zM338.04 215.34c9.45 0 17.12-9.35 17.12-20.88s-7.67-20.88-17.12-20.88c-9.46 0-17.12 9.35-17.12 20.88s7.66 20.88 17.12 20.88z" fill="#fff"/> + <path d="M335.84 233.84s-15.95-40.36-16.8-44.88l-1.76-5.84c-.37.15-.72.33-1.06.54-4.34 2.9-15.6 4.22-26.94 1.42a39.14 39.14 0 01-16.54-8.24 10.2 10.2 0 001.39-7.18 10.33 10.33 0 00-1.51-3.86c4.82-7.72 6.46-17.16 4.76-27.74a62 62 0 00-3.6-12.86 28.52 28.52 0 005-21.82 19.48 19.48 0 00-12.9-15c-10.74-3.64-19.76 1.68-25.5 7.7a75.22 75.22 0 00-34.82-8 25.34 25.34 0 00-18.96-7.86 8 8 0 00-7.58 5.78 41.85 41.85 0 00-17.32 1.74 8 8 0 00-5.42 6.26c-.25 1.6-.2 3.24.18 4.82a87.1 87.1 0 00-34.28 22c-8.56-2.54-20.18-2.82-27.76 6.52a19.48 19.48 0 00-2.8 19.58 28.44 28.44 0 0015.36 15.44 44 44 0 008.24 21.88 31.32 31.32 0 002.78 3.22v.76c-.41 3.55-.1 7.14.94 10.56.37 1.15.98 2.2 1.78 3.1a8 8 0 006.5 2.6c.38 0 .88 0 1.44-.2.7 2.53 1.83 4.93 3.34 7.08a8 8 0 005.56 3.4l1.18.12a82.59 82.59 0 00-.68 6.66 64.28 64.28 0 0012.36 42.18c15.06 20.54 41.24 31.62 72 30.72 1.4.9 2.88 1.8 4.4 2.7a175.42 175.42 0 0084.12 22.42c20.7 0 41.4-4.38 59.02-15.44a8 8 0 003.2-9.7c-11.34-28.88-24.96-48-37.32-60.58z" fill="#fff"/> + <path d="M287.86 190.92c-10.56-2.6-18.9-7.86-23.84-14.96a5.06 5.06 0 004.2-3.56c.3-1.28.16-3.6-3.38-6 6.1-7.04 8.42-16.42 6.66-27.3a55.73 55.73 0 00-4.64-14.8 22.6 22.6 0 006-19.62A13.44 13.44 0 00264 94.14c-11.02-3.74-19.16 5.62-22 9.56a71.74 71.74 0 00-37.4-9.52h-1.58c-4.42-4.86-8.82-7.84-16.38-7.84a2 2 0 00-2 2c-.02 1.85.1 3.7.36 5.54-8.72-4.46-20.82-.64-21.46-.44a2 2 0 00-1.36 1.56 7.2 7.2 0 001.46 5.34 8.54 8.54 0 002 1.84c-25.26 6.94-38 21.2-41.6 25.68-4.48-1.84-17.46-6-24.92 3.24a13.44 13.44 0 00-1.88 13.68A22.58 22.58 0 00112.7 158c.48 16.16 8.12 24.5 11.76 27.1 0 .36-.12.78-.2 1.22-.79 3.56-.67 7.27.34 10.78a2 2 0 002 1.42c2.57-.41 5.11-.97 7.62-1.66a13.2 13.2 0 002.64 11.14 2.01 2.01 0 001.4.86 12 12 0 008.28-2.18c-5.42 19.6-2.42 38.4 8.66 53.54 14.16 19.32 39.24 29.54 68.92 28.2 17.34 11.74 42.2 20.64 66.68 23.82 6.63.88 13.31 1.32 20 1.34 17.72 0 38-3.3 55.88-14.5a2 2 0 00.8-2.42c-9.52-24.34-20.6-41.42-31.02-53.36l-2-6.84a2.02 2.02 0 01.13-1.57 2 2 0 011.23-.99l8.94-2.72c.65.38 1.14 1 1.36 1.72l4.52 14.94a1.01 1.01 0 00.88.72c.13.01.27 0 .4-.04.12 0 .22-.16.36-.2a4.4 4.4 0 002.18-1.04.96.96 0 00.58-.3 21.37 21.37 0 00-14.3-35.58l-.32-1.04h.2a2 2 0 001-.26c9.08-5.18 10.36-17.1 5.84-24.98a12.17 12.17 0 00-6.46-5.72 11.18 11.18 0 00-9.38 1.24c-.1.07-.18.15-.26.24l-1.08-3.54a21.51 21.51 0 008.3-16.12 21.38 21.38 0 00-16.04-21.52.96.96 0 00-.44 0c-.66 0-.9.14-1.72 0-.44.12-.88.27-1.3.44a1.03 1.03 0 00-.72.88c-.01.14 0 .27.04.4l4.52 14.94c.22.73.15 1.52-.18 2.2l-9 2.72a1.99 1.99 0 01-2.2-.64 2 2 0 01-.36-.72l-4.42-14.56a.93.93 0 00-1-.7.95.95 0 00-.42.14.98.98 0 00-1.3 0 20.4 20.4 0 0012.44 36l.72 2.4 1.76 5.84c-5.62 3.38-17.92 5.14-31.1 1.88zm49.06 62a1 1 0 00.4 0 1.04 1.04 0 00.6-.5v-.14a.98.98 0 00.46-.16 180.84 180.84 0 0124.78 44.4c-42 25.08-106.46 9.44-137.38-11.82a2 2 0 00-1.14-.36h-.1c-28.58 1.52-52.7-8.16-66.16-26.52-11.58-15.8-13.66-36-5.86-56.76a2 2 0 00-2.36-2.64l-.66.16a2 2 0 00-1.16.82s-3.88 5.5-8.72 5.52c-3.76-6.14-.28-9.34.12-9.68a2 2 0 00-1.74-3.5c-2.88.78-7.42 2-10 2.48-.41-2.4-.35-4.86.18-7.24.23-1.03.34-2.08.32-3.14a2 2 0 00-1.14-1.66c-1.76-.82-10.68-8.6-10.68-25.86a2 2 0 00-1.68-2 18.79 18.79 0 01-14-11.02 9.55 9.55 0 011.26-9.76c6.28-7.86 18.9-2.66 21.16-1.64a44.42 44.42 0 00-6.7 15.18 1 1 0 00.78 1.18h.2a1 1 0 00.98-.8c1.38-5.82 4-11.27 7.66-16 .7-.84 1.45-1.63 2.26-2.36a.99.99 0 00.32-.78c5.38-6 19.44-18.84 44.5-23.86a2 2 0 00-.2-4A9.1 9.1 0 01166.9 98a3.55 3.55 0 01-.6-1.14c4.34-1.06 16.84-3.28 21.46 4.98a2.04 2.04 0 001.22.94 2.02 2.02 0 002.28-2.94 20.13 20.13 0 01-2.54-9.44c5.18.5 8.3 2.94 12 7.04a2 2 0 001.46.68h2.5c11-.3 21.9 2.12 31.72 7.08a65.3 65.3 0 0112.56 8.8 1 1 0 001.71-.71 1 1 0 00-.3-.71 47.06 47.06 0 00-6.37-4.88c.12-.1.23-.23.32-.36 0-.14 8-12.98 18.36-9.44a9.54 9.54 0 016.32 7.54 18.77 18.77 0 01-5.88 16.84 2 2 0 00-.58 2l.16.54c.04.14.1.27.16.4.14.24 13.1 24.84-2.64 40.12a2.01 2.01 0 00-.22 2.61 2 2 0 00.72.61c2.92 1.46 3.54 2.66 3.58 2.84.04.18-1.06.88-3.68.88a2 2 0 00-2 1.96c-.01.35.07.7.24 1 5.12 9.4 15.06 16.34 28 19.52 12 2.94 24.84 2.26 32.64-1.54l4.88 14.62c-5.22 5.44-20.32 8-26 8.44a2 2 0 00-1.64 1.2 65.03 65.03 0 00-17.18-3.22 1 1 0 100 2c6.04.31 12 1.49 17.7 3.48a2 2 0 00.8.46c.18 0 8.82 2.4 20.64 11.76a20.34 20.34 0 0018 20.9l.22.06zM326 211.84l1.3 4.3a20.31 20.31 0 00-4.58 4.58c-.26.34-.48.7-.72 1.08-.24.38-.54.84-.78 1.28a20.5 20.5 0 00-1.68 4.24 79.6 79.6 0 00-13.1-8c6.16-1.32 14.6-3.48 19.56-7.48zm31.74 15.22a19.22 19.22 0 01-2.98 17.12l-3.88-12.78a3.98 3.98 0 00-5.04-2.7l-10.62 3.3a4 4 0 00-2.7 5.04l3.88 12.78a19.39 19.39 0 01-4.74-33.96 1 1 0 00.38-1.1l-2.72-8.96c2.67 1.5 5.58 2.5 8.6 2.98l1.2 3.88a1 1 0 00.92.7 19.37 19.37 0 0117.68 13.7h.02zm-23.08-43.46c1.57-.8 3.4-.96 5.08-.44a8.26 8.26 0 014.3 4c2.62 4.6 3.08 12.82-2 17.68a2 2 0 00-1.08 0c-1.54.52-7.24-.5-11.58-3.62a7.85 7.85 0 01-3.8-5.82c.08-6.1 7.54-10.88 9.08-11.8zm-16.8-22.5l.6-.18-.6.18zm-15.38 3.74a19.26 19.26 0 013.04-17.2l3.88 12.78a4.02 4.02 0 005.04 2.7L325 160a4 4 0 002.7-5.04l-3.88-12.78a19.38 19.38 0 014.74 33.96 1 1 0 00-.38 1.1l1.52 4.92a25.02 25.02 0 00-5.74 6l-2.68-8.86a1 1 0 00-.92-.72 19.34 19.34 0 01-17.88-13.74z" fill="url(#paint0_linear)"/> + <path d="M319.68 238.6a20.34 20.34 0 01-.86-6.56c-11.82-9.36-20.46-11.72-20.64-11.76a2 2 0 01-.8-.46c-5.7-2-11.66-3.17-17.7-3.48a1 1 0 110-2c5.85.3 11.63 1.38 17.18 3.22a2 2 0 011.64-1.2c5.62-.52 20.7-3 26-8.44l-4.88-14.62c-7.8 3.8-20.7 4.48-32.64 1.54-12.92-3.18-22.86-10.12-28-19.52a2.01 2.01 0 01.77-2.7 2 2 0 01.99-.26c2.62 0 3.58-.7 3.68-.88.1-.18-.64-1.38-3.58-2.84a2 2 0 01-.5-3.22c15.74-15.26 2.76-39.86 2.64-40.12a2.04 2.04 0 01-.16-.4l-.16-.54a2 2 0 01.58-2 18.77 18.77 0 005.88-16.84 9.53 9.53 0 00-6.38-7.52c-10.44-3.54-18.28 9.3-18.36 9.44-.1.13-.2.25-.32.36a47.11 47.11 0 016.3 4.92.98.98 0 01.3.71 1 1 0 01-.63.93 1.02 1.02 0 01-1.09-.22 65.27 65.27 0 00-12.66-8.78 66.28 66.28 0 00-31.72-7.08h-2.5a2 2 0 01-1.46-.68c-3.62-4.12-6.74-6.56-12-7.04.06 3.3.93 6.55 2.54 9.44a2.01 2.01 0 11-3.5 2c-4.64-8.24-17.14-6-21.46-4.98.13.41.33.8.6 1.14a9.1 9.1 0 006.3 2.52 2 2 0 01.2 4c-25.04 5.04-39.12 17.88-44.5 23.86a.98.98 0 01-.32.78c-.8.73-1.56 1.52-2.26 2.36a42 42 0 00-7.66 16 1 1 0 01-.98.8h-.2a1 1 0 01-.78-1.18 44.43 44.43 0 016.8-15.3c-2.26-1.02-14.88-6.22-21.16 1.64a9.54 9.54 0 00-1.26 9.76 18.79 18.79 0 0014 11.02 2 2 0 011.68 2c0 17.24 8.92 25.04 10.68 25.86a2 2 0 011.14 1.66c.02 1.06-.09 2.11-.32 3.14-.5 2.35-.55 4.77-.14 7.14 2.56-.54 7.08-1.7 10-2.48a2 2 0 011.78 3.5c-.4.34-3.88 3.54-.12 9.68 4.84 0 8.68-5.48 8.72-5.52a2 2 0 011.16-.82l.66-.16a2 2 0 012.36 2.64c-7.8 20.8-5.72 40.96 5.86 56.76 13.46 18.36 37.58 28 66.16 26.52h.1a2 2 0 011.14.36c30.92 21.26 95.44 36.9 137.38 11.82a180.84 180.84 0 00-24.78-44.4c-.14.1-.3.15-.46.16v.14a1.01 1.01 0 01-.6.5 1 1 0 01-.4 0 20.38 20.38 0 01-17.28-14.32zm25 41.74c2.3 7.66-8 17.1-32 16-44-2-62.64-13.8-70-18a144.85 144.85 0 01-24-16.24c-.44 2.6-.44 5.25 0 7.84a2 2 0 01-1.56 2.36h-.4a2 2 0 01-2-1.6 29.83 29.83 0 017.28-24.56c3.64-3.72 10.26-7.74 20.98-5.78h.2a1 1 0 011.34.44 17.36 17.36 0 0012.32 9.22 4.3 4.3 0 004-1.36c5.42-7.22-1.6-14.4-2-14.7-9.66-8.16-28.2-13.16-51.12-2.54-12.66 5.88-21.18 14.64-21.18 21.84a1 1 0 01-1.7.7 1 1 0 01-.3-.7c0-5.34 3.84-11.2 10.36-16.38-9.62-13.14-17.3-24.76-14.36-30.62 0 0 15 3 37-6 11.02-4.5 17.28-13.54 20.68-19.7a86.97 86.97 0 01-33.58 14.28c-35 7.06-67.28-6.58-72-30.46-4.72-23.88 19.64-48.98 54.64-56 35-7.02 67.28 6.58 72 30.46 2.76 13.64-4 27.66-16.9 38.5 2.52 8.5 10.32 32.42 20.14 38.96 12 8 18 6 36 12s40.14 32.04 46.14 52.04h.02z" fill="url(#paint1_linear)"/> + <path d="M227.14 168.4a2 2 0 00-2.42 1.46 8.76 8.76 0 01-3.78 5.26 6.2 6.2 0 01-5.38-.58 1.99 1.99 0 00-2.74 1.04 6.45 6.45 0 01-3.72 4 10.6 10.6 0 01-7.44-1.08 2.01 2.01 0 00-2 3.48 16.4 16.4 0 007.28 2 9.7 9.7 0 008.68-5.1 9.1 9.1 0 007-.16c4.5-2 6-7.7 6-8a2 2 0 00-1.48-2.32zM164.28 159.36a3.04 3.04 0 003.92 1.8 3.05 3.05 0 001.8-3.92s-1.2-3.18-2.92-7.88a3 3 0 00-5.64 2c1.64 4.8 2.84 8 2.84 8zM230 141.48a3 3 0 004.8 1.4 3 3 0 00.96-3.2l-2.1-6.74a3 3 0 00-5.72 1.78l2.06 6.76zM175.82 158.7a2 2 0 00-2.28 1.66 5.8 5.8 0 01-2.58 4.54c-2.33.86-4.9.77-7.16-.24a2 2 0 10-1.58 3.68c1.9.77 3.94 1.18 6 1.2a9.73 9.73 0 004.74-1.12 9.6 9.6 0 004.62-7.42 2 2 0 00-1.76-2.3zM242.32 141.38a2 2 0 00-2.44 1.42 5.8 5.8 0 01-3.04 4.26c-2.4.62-4.95.28-7.1-.96a2.02 2.02 0 00-2 3.5 16 16 0 006.98 1.84 9.2 9.2 0 003.62-.7 9.62 9.62 0 005.36-6.92 2 2 0 00-1.38-2.44zM211.42 172.32c.23.03.45.03.68 0 1.45-.51 2.8-1.27 4-2.24a33.53 33.53 0 009.46-10.22 7.8 7.8 0 00.72-6 4 4 0 00-3.16-2.66c-5.12-1.2-20.44 2.48-27.12 10.54a4 4 0 00-.48 4.48c1.64 3.22 10.22 5.58 14.48 6 .47.06.94.1 1.42.1z" fill="#01C8D7"/> + <path d="M242.3 244.3a2 2 0 001.66-.48 18.95 18.95 0 0012.72 8.28 6.15 6.15 0 005.76-2.16c6.44-8.6-2-17.22-2.16-17.36-15.54-13.16-37.72-10.12-53.32-2.88a59.5 59.5 0 00-12 7.28c-6.52 5.18-10.36 11.04-10.36 16.38a1 1 0 001.7.7 1 1 0 00.3-.7c0-7.18 8.5-16 21.18-21.84 22.92-10.62 41.46-5.62 51.12 2.54.3.3 7.32 7.48 2 14.7a4.32 4.32 0 01-4 1.36 17.33 17.33 0 01-12.32-9.22 1 1 0 00-1.34-.44h-.2c-10.72-2-17.34 2-20.98 5.78a29.82 29.82 0 00-7.34 24.58 2 2 0 002 1.6h.4a1.99 1.99 0 001.56-1.58c.05-.26.05-.52 0-.78-.45-2.6-.45-5.25 0-7.84a24.4 24.4 0 016.2-13.14c4.34-4.52 10.2-6.1 17.42-4.78z" fill="#00C8D7"/> + <path d="M452 177.26a8 8 0 00-13.54-2 153.95 153.95 0 00-17 25.54 17.82 17.82 0 00-1.84 7.7 73.99 73.99 0 00-4.04 8.34A79.59 79.59 0 00412 227.2c-.34 1.3-.66 2.62-.92 4-.12.6-.24 1.2-.34 1.82a20.97 20.97 0 000 6.54 34.54 34.54 0 00-3.22 10c-.2.92-.44 2-.68 3.02-1.6 6.8 1.4 11.18 3.58 14.38a21.64 21.64 0 014.28 10.46c-.68 3.48-14.26 11.06-30.12 15.26a8 8 0 00-5.4 4.76c-2.12 5.3 0 10.98 5.22 14.48s14.2 5.32 24.12 5.32c14.34 0 30.56-4 39.74-13.18 16.84-16.84 24.34-34 24.34-55.66-.12-4.6-.68-9.17-1.68-13.66-.26-1.32-.56-2.66-.88-4-5.08-22.14-16.36-49.6-18.04-53.48zm-8 122.5c-8.16 8.16-22.66 11.36-35.24 11.36-9.04 0-17.1-1.64-21.08-4.28-3.98-2.64-3.46-6-2.96-7.24a2 2 0 011.34-1.2c9.42-2.48 36-11.8 34.52-21.78a27.66 27.66 0 00-5.28-13.12c-1.9-2.78-3.68-5.4-2.7-9.62.26-1.12.5-2.14.7-3.06 1.08-4.82 1.74-7.74 3.76-9.82a16.83 16.83 0 01-.48-6.98 72.14 72.14 0 018.26-22.7 2 2 0 01.78-.74c-.3-2.43.09-4.9 1.14-7.12a147.29 147.29 0 0116.26-24.38 2 2 0 013.38.5c.82 2 20.16 48.6 20.16 68.76 0 20.16-6.86 35.78-22.56 51.4v.02z" fill="#fff"/> + <path d="M444.96 178.36a2 2 0 00-1.84.7 147.35 147.35 0 00-16.26 24.38 12.87 12.87 0 00-1.14 7.12c-.32.17-.6.43-.78.74a72.11 72.11 0 00-8.24 22.7c-.33 2.34-.17 4.71.48 6.98-2 2-2.68 5-3.76 9.82-.22.94-.44 2-.7 3.06-1 4.22.8 6.84 2.7 9.62a27.66 27.66 0 015.28 13.12c1.42 10-25.12 19.3-34.52 21.78a2.01 2.01 0 00-1.34 1.2c-.5 1.26-1.22 4.48 2.96 7.24s12 4.28 21.08 4.28c12.58 0 27.08-3.18 35.24-11.36 15.62-15.62 22.58-31.48 22.58-51.42s-19.34-66.8-20.16-68.76a2 2 0 00-1.58-1.2z" fill="#00C8D7"/> + <path d="M430.46 205.22c-4.4 8.78 9.78 25.86 15.62 31.7a2 2 0 01-2.82 2.82c-.68-.68-12.28-12.4-16.26-23.8a68.4 68.4 0 00-6.36 18.72c-.3 3.4.4 6.8 2 9.82l13.58 18.68a2 2 0 01-3.04 2.58 80.6 80.6 0 01-14-19.22l-.44-.6c-.6 1.89-1.1 3.81-1.48 5.76-.22.94-.44 2-.7 3.1-.56 2.42.24 3.72 2.1 6.46a31.53 31.53 0 016 14.8c2 14.26-28.6 23.74-36.18 25.86.31.68.84 1.23 1.5 1.58 8.48 5.58 39.16 5.54 51.28-6.58 14.8-14.82 21.42-29.8 21.42-48.58 0-16.46-14.18-53.12-18.56-64a138.1 138.1 0 00-13.66 20.9z" fill="#CCFBFF"/> + <path d="M293.76 83.8H503.3a2.36 2.36 0 000-4.7h-48.68c-4.34-8-15.14-25.14-28.62-27.72-18-3.42-21.48 14.44-21.48 14.44s-12-30.96-42-26.86c-14.4 2-19.76 9.56-21.18 17.6a1.2 1.2 0 011.13 0c.34.18.58.55.61.94 0 .78.14 1.54.26 2.28a1.18 1.18 0 01-1 1.32c-.34 0-.66-.06-.93-.3-.3-.26-.39-.6-.39-.98-.2 3.75.14 7.52.98 11.18h1.72c-.16-.42-.34-.94-.54-1.52a1.18 1.18 0 012.22-.76c.62 1.82 1.12 2.94 1.12 2.96a1.19 1.19 0 01-.09 1.12 1.18 1.18 0 01-.99.54h-2.86a46.2 46.2 0 002 5.74h-50.82a2.36 2.36 0 000 4.7v.02z" fill="#fff"/> + <path d="M321.28 179.32l2.72 8.86c1.57-2.3 3.5-4.33 5.74-6l-1.52-4.92a1 1 0 01.38-1.1 19.46 19.46 0 008.03-14.53 19.39 19.39 0 00-12.77-19.43l3.88 12.78A4 4 0 01325 160l-10.62 3.22a3.99 3.99 0 01-5.04-2.7l-3.88-12.78c-.54.72-1.03 1.47-1.46 2.26a19.4 19.4 0 0016.42 28.52 1.01 1.01 0 01.86.8zM339.08 212.62l-1.2-3.88a25.8 25.8 0 01-8.6-2.98l2.72 8.96a1 1 0 01-.38 1.1 19.49 19.49 0 00-8.03 14.53 19.38 19.38 0 0012.77 19.43L332.48 237a4 4 0 012.7-5.04l10.62-3.22a3.99 3.99 0 015.04 2.7l3.88 12.78a19.38 19.38 0 00-14.72-30.9 1 1 0 01-.92-.7zM325.66 195.34a7.83 7.83 0 003.8 5.82c4.32 3.12 10 4.14 11.58 3.62a2 2 0 011.08 0c5-4.86 4.54-13.08 2-17.68a8.26 8.26 0 00-4.3-4 6.76 6.76 0 00-5.08.44c-1.62.98-9.08 5.76-9.08 11.8z" fill="#CCFBFF"/> + <path d="M70.86 36.18H187.8a2.36 2.36 0 000-4.72h-27.68c-2.4-4.42-8.44-14-16-15.5a9.24 9.24 0 00-5.45.2c-3.13 1.1-5.76 4.64-6.53 7.84 0 0-6.66-17.24-23.46-14.96-12.36 1.68-12.8 10.8-11.64 16.86h2.5a1.18 1.18 0 110 2.36h-2c.3 1.08.66 2.15 1.1 3.18H70.86a2.36 2.36 0 000 4.72v.02z" fill="#fff"/> + <defs> + <linearGradient id="paint0_linear" x1="57.78" y1="17.22" x2="465.72" y2="425.14" gradientUnits="userSpaceOnUse"> + <stop stop-color="#00C8D7"/> + <stop offset="1" stop-color="#0A84FF"/> + </linearGradient> + <linearGradient id="paint1_linear" x1="82.96" y1="50.04" x2="441.7" y2="408.76" gradientUnits="userSpaceOnUse"> + <stop stop-color="#CCFBFF"/> + <stop offset="1" stop-color="#C9E4FF"/> + </linearGradient> + </defs> +</svg> diff --git a/devtools/startup/aboutdevtools/moz.build b/devtools/startup/aboutdevtools/moz.build new file mode 100644 index 0000000000..2b25782368 --- /dev/null +++ b/devtools/startup/aboutdevtools/moz.build @@ -0,0 +1,15 @@ +# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*- +# 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/. + +EXTRA_JS_MODULES += [ + "AboutDevToolsRegistration.jsm", +] + +XPCOM_MANIFESTS += [ + "components.conf", +] + +BROWSER_CHROME_MANIFESTS += ["test/browser.ini"] diff --git a/devtools/startup/aboutdevtools/subscribe.css b/devtools/startup/aboutdevtools/subscribe.css new file mode 100644 index 0000000000..0096bc1e8f --- /dev/null +++ b/devtools/startup/aboutdevtools/subscribe.css @@ -0,0 +1,94 @@ +/* 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/. */ + +/** + * This file contains the styles for the newsletter subscription form on about:devtools. + * It is largely inspired from https://mozilla.github.io/basket-example/ + */ + +.newsletter-title { + font-size: 17px; + font-weight: 500; + margin-top: 26px; + margin-bottom: -4px; +} + +#newsletter-errors { + /* Hidden by default */ + display: none; + + margin-bottom: 20px; + padding: 10px; + border-radius: 2px; + + background-color: var(--red-50); + color: var(--white); +} + +#newsletter-errors.show { + display: block; +} + +#newsletter-errors .error { + margin: 0; + margin-bottom: 10px; +} + +#newsletter-errors .error:last-child { + margin-bottom: 0; +} + +#newsletter-thanks { + /* Hidden by default */ + display: none; +} + +#newsletter-thanks.show { + display: block; +} + +.newsletter-form-section { + display: block; + margin-bottom: 20px; + width: 320px; +} + +#newsletter-privacy { + display: flex; + + /* The privacy section is hidden by default and only displayed on focus */ + height: 0; + overflow: hidden; + + padding: 3px 0 0 3px; + margin: -3px 0 -20px -3px; +} + +#newsletter-privacy.animate { + transition: all 0.25s cubic-bezier(.15,.75,.35,.9); +} + +#newsletter-privacy label { + line-height: var(--line-height); +} + +#privacy { + width: 20px; + height: 20px; + margin-top: 2px; + margin-inline-end: 10px; + flex-shrink: 0; +} + +#email { + width: 100%; + box-sizing: border-box; + margin: 4px 0; + padding: 8px; +} + +#newsletter-submit { + display: block; + padding: 8px 20px; +} diff --git a/devtools/startup/aboutdevtools/subscribe.js b/devtools/startup/aboutdevtools/subscribe.js new file mode 100644 index 0000000000..7e18b5a578 --- /dev/null +++ b/devtools/startup/aboutdevtools/subscribe.js @@ -0,0 +1,158 @@ +/* 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/. */ + +"use strict"; + +/** + * This file handles the newsletter subscription form on about:devtools. + * It is largely inspired from https://mozilla.github.io/basket-example/ + */ + +window.addEventListener( + "load", + function() { + // Timeout for the subscribe XHR. + const REQUEST_TIMEOUT = 5000; + + const emailInput = document.getElementById("email"); + const newsletterErrors = document.getElementById("newsletter-errors"); + const newsletterForm = document.getElementById("newsletter-form"); + const newsletterPrivacySection = document.getElementById( + "newsletter-privacy" + ); + const newsletterThanks = document.getElementById("newsletter-thanks"); + + /** + * Update the error panel to display the provided errors. If the argument is null or + * empty, a default error message will be displayed. + * + * @param {Array} errors + * Array of strings, each item being an error message to display. + */ + async function updateErrorPanel(errors) { + clearErrorPanel(); + + if (!errors || errors.length == 0) { + errors = [ + await document.l10n.formatValues([ + { id: "newsletter-error-unknown" }, + ]), + ]; + } + + // Create errors markup. + const fragment = document.createDocumentFragment(); + for (const error of errors) { + const item = document.createElement("p"); + item.classList.add("error"); + item.appendChild(document.createTextNode(error)); + fragment.appendChild(item); + } + + newsletterErrors.appendChild(fragment); + newsletterErrors.classList.add("show"); + } + + /** + * Hide the error panel and remove all errors. + */ + function clearErrorPanel() { + newsletterErrors.classList.remove("show"); + newsletterErrors.innerHTML = ""; + } + + // Show the additional form fields on focus of the email input. + function onEmailInputFocus() { + // Create a hidden measuring container, append it to the parent of the privacy section + const container = document.createElement("div"); + container.style.cssText = + "visibility: hidden; overflow: hidden; position: absolute"; + newsletterPrivacySection.parentNode.appendChild(container); + + // Clone the privacy section, append the clone to the measuring container. + const clone = newsletterPrivacySection.cloneNode(true); + container.appendChild(clone); + + // Measure the target height of the privacy section. + clone.style.height = "auto"; + const height = clone.offsetHeight; + + // Cleanup the measuring container. + container.remove(); + + // Set the animate class and set the height to the measured height. + newsletterPrivacySection.classList.add("animate"); + newsletterPrivacySection.style.cssText = `height: ${height}px; margin-bottom: 0;`; + } + + // XHR subscribe; handle errors; display thanks message on success. + function onFormSubmit(evt) { + evt.preventDefault(); + evt.stopPropagation(); + + // New submission, clear old errors + clearErrorPanel(); + + const xhr = new XMLHttpRequest(); + + xhr.onload = async function(r) { + if (r.target.status >= 200 && r.target.status < 300) { + const { response } = r.target; + + if (response.success === true) { + // Hide form and show success message. + newsletterForm.style.display = "none"; + newsletterThanks.classList.add("show"); + } else { + // We trust the error messages from the service to be meaningful for the user. + updateErrorPanel(response.errors); + } + } else { + const { status, statusText } = r.target; + const statusInfo = `${status} - ${statusText}`; + const error = await document.l10n.formatValues([ + { + id: "newsletter-error-common", + args: { errorDescription: statusInfo }, + }, + ]); + updateErrorPanel([error]); + } + }; + + xhr.onerror = () => { + updateErrorPanel(); + }; + + xhr.ontimeout = async () => { + const error = await document.l10n.formatValues([ + { id: "newsletter-error-timeout" }, + ]); + updateErrorPanel([error]); + }; + + const url = newsletterForm.getAttribute("action"); + + xhr.open("POST", url, true); + xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); + xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest"); + xhr.timeout = REQUEST_TIMEOUT; + xhr.responseType = "json"; + + // Create form data. + const formData = new FormData(newsletterForm); + formData.append("source_url", document.location.href); + + const params = new URLSearchParams(formData); + + // Send the request. + xhr.send(params.toString()); + } + + // Attach event listeners. + newsletterForm.addEventListener("submit", onFormSubmit); + emailInput.addEventListener("focus", onEmailInputFocus); + }, + { once: true } +); diff --git a/devtools/startup/aboutdevtools/test/.eslintrc.js b/devtools/startup/aboutdevtools/test/.eslintrc.js new file mode 100644 index 0000000000..3d0bd99e1b --- /dev/null +++ b/devtools/startup/aboutdevtools/test/.eslintrc.js @@ -0,0 +1,6 @@ +"use strict"; + +module.exports = { + // Extend from the shared list of defined globals for mochitests. + extends: "../../../.eslintrc.mochitests.js", +}; diff --git a/devtools/startup/aboutdevtools/test/browser.ini b/devtools/startup/aboutdevtools/test/browser.ini new file mode 100644 index 0000000000..bcac4d3fbf --- /dev/null +++ b/devtools/startup/aboutdevtools/test/browser.ini @@ -0,0 +1,11 @@ +[DEFAULT] +tags = devtools +subsuite = devtools +support-files = + head.js + +[browser_aboutdevtools_closes_page.js] +[browser_aboutdevtools_enables_devtools.js] +[browser_aboutdevtools_focus_owner_tab.js] +[browser_aboutdevtools_reuse_existing.js] +skip-if = (verify && (os == 'mac' || os == 'linux')) diff --git a/devtools/startup/aboutdevtools/test/browser_aboutdevtools_closes_page.js b/devtools/startup/aboutdevtools/test/browser_aboutdevtools_closes_page.js new file mode 100644 index 0000000000..baa8f3f43e --- /dev/null +++ b/devtools/startup/aboutdevtools/test/browser_aboutdevtools_closes_page.js @@ -0,0 +1,25 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +/* eslint-env browser */ + +add_task(async function() { + pushPref("devtools.enabled", false); + + const { doc, win } = await openAboutDevTools(); + + info("Check that the close button is available on the page"); + const closeButton = doc.getElementById("close"); + ok(closeButton, "close button is displayed"); + + const onWindowUnload = new Promise(r => + win.addEventListener("unload", r, { once: true }) + ); + info("Click on the install button to enable DevTools."); + EventUtils.synthesizeMouseAtCenter(closeButton, {}, win); + + info("Wait for the about:devtools tab to be closed"); + await onWindowUnload; +}); diff --git a/devtools/startup/aboutdevtools/test/browser_aboutdevtools_enables_devtools.js b/devtools/startup/aboutdevtools/test/browser_aboutdevtools_enables_devtools.js new file mode 100644 index 0000000000..e0f7324ed8 --- /dev/null +++ b/devtools/startup/aboutdevtools/test/browser_aboutdevtools_enables_devtools.js @@ -0,0 +1,39 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +/* eslint-env browser */ + +add_task(async function() { + pushPref("devtools.enabled", false); + + const { tab, doc, win } = await openAboutDevTools(); + + const installPage = doc.getElementById("install-page"); + const welcomePage = doc.getElementById("welcome-page"); + + info( + "Check that about:devtools is in the correct state with devtools.enabled=false" + ); + ok(!installPage.hasAttribute("hidden"), "install screen is visible"); + ok(welcomePage.hasAttribute("hidden"), "welcome screen is hidden"); + + info("Click on the install button to enable DevTools."); + const installButton = doc.getElementById("install"); + EventUtils.synthesizeMouseAtCenter(installButton, {}, win); + + info("Wait until the UI updates"); + await waitUntil(() => installPage.hasAttribute("hidden") === true); + ok(!welcomePage.hasAttribute("hidden"), "welcome screen is visible"); + ok( + Services.prefs.getBoolPref("devtools.enabled"), + "The preference devtools.enabled has been flipped to true." + ); + + // Flip the devtools.enabled preference back to false, otherwise the pushPref cleanup + // times out. + Services.prefs.setBoolPref("devtools.enabled", false); + + await removeTab(tab); +}); diff --git a/devtools/startup/aboutdevtools/test/browser_aboutdevtools_focus_owner_tab.js b/devtools/startup/aboutdevtools/test/browser_aboutdevtools_focus_owner_tab.js new file mode 100644 index 0000000000..d0d9a96d79 --- /dev/null +++ b/devtools/startup/aboutdevtools/test/browser_aboutdevtools_focus_owner_tab.js @@ -0,0 +1,91 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +/* eslint-env browser */ + +/** + * When closing about:devtools, test that the tab where the user triggered about:devtools + * is selected again. + */ +add_task(async function() { + await pushPref("devtools.enabled", false); + + info("Add an about:blank tab"); + const tab1 = await addTab("data:text/html;charset=utf-8,tab1"); + const tab2 = await addTab("data:text/html;charset=utf-8,tab2"); + ok( + tab1 === gBrowser.tabs[1], + "tab1 is the second tab in the current browser window" + ); + + info("Select the first tab"); + gBrowser.selectedTab = tab1; + + synthesizeToggleToolboxKey(); + + info("Wait for the about:devtools tab to be selected"); + await waitUntil(() => isAboutDevtoolsTab(gBrowser.selectedTab)); + info("about:devtools was opened as expected."); + + const aboutDevtoolsTab = gBrowser.selectedTab; + ok( + aboutDevtoolsTab === gBrowser.tabs[2], + "about:devtools was opened next to its owner tab" + ); + + info("Move the owner tab to the end of the tabs array."); + gBrowser.moveTabTo(tab1, gBrowser.tabs.length - 1); + await removeTab(aboutDevtoolsTab); + + await waitUntil(() => tab1 == gBrowser.selectedTab); + info("The correct tab was selected after closing about:devtools."); + + await removeTab(tab1); + await removeTab(tab2); +}); + +/** + * When closing about:devtools, test that the current tab is not updated if + * about:devtools was not the selectedTab. + */ +add_task(async function() { + await pushPref("devtools.enabled", false); + + info("Add an about:blank tab"); + const tab1 = await addTab("data:text/html;charset=utf-8,tab1"); + const tab2 = await addTab("data:text/html;charset=utf-8,tab2"); + ok( + tab1 === gBrowser.tabs[1], + "tab1 is the second tab in the current browser window" + ); + + info("Select the first tab"); + gBrowser.selectedTab = tab1; + + synthesizeToggleToolboxKey(); + + info("Wait for the about:devtools tab to be selected"); + await waitUntil(() => isAboutDevtoolsTab(gBrowser.selectedTab)); + info("about:devtools was opened as expected."); + + const aboutDevtoolsTab = gBrowser.selectedTab; + ok( + aboutDevtoolsTab === gBrowser.tabs[2], + "about:devtools was opened next to its owner tab" + ); + + info("Select the second tab"); + gBrowser.selectedTab = tab2; + + const aboutDevtoolsDocument = aboutDevtoolsTab.linkedBrowser.contentDocument; + await waitUntil(() => aboutDevtoolsDocument.visibilityState === "hidden"); + + await removeTab(aboutDevtoolsTab); + + ok(tab2 == gBrowser.selectedTab, "Tab 2 should still be selected."); + + await removeTab(tab1); + await removeTab(tab2); +}); diff --git a/devtools/startup/aboutdevtools/test/browser_aboutdevtools_reuse_existing.js b/devtools/startup/aboutdevtools/test/browser_aboutdevtools_reuse_existing.js new file mode 100644 index 0000000000..96c7ddc10c --- /dev/null +++ b/devtools/startup/aboutdevtools/test/browser_aboutdevtools_reuse_existing.js @@ -0,0 +1,46 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +/* eslint-env browser */ + +/** + * Test that only one tab of about:devtools is used for a given window. + */ +add_task(async function() { + await pushPref("devtools.enabled", false); + + info("Add an about:blank tab"); + const tab = await addTab("about:blank"); + + synthesizeToggleToolboxKey(); + + info("Wait for the about:devtools tab to be selected"); + await waitUntil(() => isAboutDevtoolsTab(gBrowser.selectedTab)); + + // Keep a reference on this tab to assert it later on. + const aboutDevtoolsTab = gBrowser.selectedTab; + + info("Select the about:blank tab again"); + gBrowser.selectedTab = tab; + + synthesizeToggleToolboxKey(); + + info("Wait for the about:devtools tab to be selected"); + await waitUntil(() => isAboutDevtoolsTab(gBrowser.selectedTab)); + + // filter is not available on gBrowser.tabs. + const aboutDevtoolsTabs = [...gBrowser.tabs].filter(isAboutDevtoolsTab); + ok( + aboutDevtoolsTabs.length === 1, + "Only one tab of about:devtools was opened." + ); + ok( + aboutDevtoolsTabs[0] === aboutDevtoolsTab, + "The existing about:devtools tab was reused." + ); + + await removeTab(aboutDevtoolsTab); + await removeTab(tab); +}); diff --git a/devtools/startup/aboutdevtools/test/head.js b/devtools/startup/aboutdevtools/test/head.js new file mode 100644 index 0000000000..d5f85d0aca --- /dev/null +++ b/devtools/startup/aboutdevtools/test/head.js @@ -0,0 +1,113 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ +/* eslint no-unused-vars: [2, {"vars": "local"}] */ + +"use strict"; + +// All test are asynchronous +waitForExplicitFinish(); + +/** + * Waits until a predicate returns true. + * + * @param function predicate + * Invoked once in a while until it returns true. + * @param number interval [optional] + * How often the predicate is invoked, in milliseconds. + */ +const waitUntil = function(predicate, interval = 100) { + if (predicate()) { + return Promise.resolve(true); + } + return new Promise(resolve => { + setTimeout(function() { + waitUntil(predicate, interval).then(() => resolve(true)); + }, interval); + }); +}; + +/** + * Open the provided url in a new tab. + */ +const addTab = async function(url) { + info("Adding a new tab with URL: " + url); + + const { gBrowser } = window; + + const tab = BrowserTestUtils.addTab(gBrowser, url); + gBrowser.selectedTab = tab; + + await BrowserTestUtils.browserLoaded(tab.linkedBrowser); + + info("Tab added and finished loading"); + + return tab; +}; + +/** + * Remove the given tab. + * @param {Object} tab The tab to be removed. + * @return Promise<undefined> resolved when the tab is successfully removed. + */ +const removeTab = async function(tab) { + info("Removing tab."); + + const { gBrowser } = tab.ownerGlobal; + + await new Promise(resolve => { + gBrowser.tabContainer.addEventListener("TabClose", resolve, { once: true }); + gBrowser.removeTab(tab); + }); + + info("Tab removed and finished closing"); +}; + +/** + * Open a new tab on about:devtools + */ +const openAboutDevTools = async function() { + info("Open about:devtools programmatically in a new tab"); + const tab = await addTab("about:devtools"); + + const browser = tab.linkedBrowser; + const doc = browser.contentDocument; + const win = browser.contentWindow; + + return { tab, doc, win }; +}; + +/** + * Copied from devtools shared-head.js. + * Set a temporary value for a preference, that will be cleaned up after the test. + */ +const pushPref = function(preferenceName, value) { + return new Promise(resolve => { + const options = { set: [[preferenceName, value]] }; + SpecialPowers.pushPrefEnv(options, resolve); + }); +}; + +/** + * Helper to call the toggle devtools shortcut. + */ +function synthesizeToggleToolboxKey() { + info("Trigger the toogle toolbox shortcut"); + if (Services.appinfo.OS == "Darwin") { + EventUtils.synthesizeKey("i", { accelKey: true, altKey: true }); + } else { + EventUtils.synthesizeKey("i", { accelKey: true, shiftKey: true }); + } +} + +/** + * Helper to check if a given tab is about:devtools. + */ +function isAboutDevtoolsTab(tab) { + const browser = tab.linkedBrowser; + // browser.documentURI might be unavailable if the tab is loading. + if (browser && browser.documentURI) { + const location = browser.documentURI.spec; + return location.startsWith("about:devtools"); + } + return false; +} diff --git a/devtools/startup/components.conf b/devtools/startup/components.conf new file mode 100644 index 0000000000..f91c54c550 --- /dev/null +++ b/devtools/startup/components.conf @@ -0,0 +1,30 @@ +# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*- +# 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/. + +Classes = [] + +if buildconfig.substs['MOZ_DEVTOOLS'] == 'all': + Classes += [ + { + 'cid': '{9e9a9283-0ce9-4e4a-8f1c-ba129a032c32}', + 'contract_ids': ['@mozilla.org/devtools/startup-clh;1'], + 'jsm': 'resource:///modules/DevToolsStartup.jsm', + 'constructor': 'DevToolsStartup', + 'categories': {'command-line-handler': 'm-devtools'}, + }, + { + 'cid': '{1060afaf-dc9e-43da-8646-23a2faf48493}', + 'contract_ids': ['@mozilla.org/network/protocol/about;1?what=debugging'], + 'jsm': 'resource:///modules/AboutDebuggingRegistration.jsm', + 'constructor': 'AboutDebugging', + }, + { + 'cid': '{11342911-3135-45a8-8d71-737a2b0ad469}', + 'contract_ids': ['@mozilla.org/network/protocol/about;1?what=devtools-toolbox'], + 'jsm': 'resource:///modules/AboutDevToolsToolboxRegistration.jsm', + 'constructor': 'AboutDevtoolsToolbox', + }, + ] diff --git a/devtools/startup/enableDevToolsPopup.inc.xhtml b/devtools/startup/enableDevToolsPopup.inc.xhtml new file mode 100644 index 0000000000..ca0cfdd3ce --- /dev/null +++ b/devtools/startup/enableDevToolsPopup.inc.xhtml @@ -0,0 +1,14 @@ +<!-- 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/. --> + +<!-- Wrap the arrow panel in a template to avoid loading images on startup --> +<html:template id="wrapper-enable-devtools-popup"> + <panel id="enable-devtools-popup" + type="arrow" + role="alert" + noautofocus="true" + orient="vertical"> + <description data-l10n-id="enable-devtools-popup-description"></description> + </panel> +</html:template> diff --git a/devtools/startup/jar.mn b/devtools/startup/jar.mn new file mode 100644 index 0000000000..1e14a43481 --- /dev/null +++ b/devtools/startup/jar.mn @@ -0,0 +1,27 @@ +# 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/. + +devtools-startup.jar: +% content devtools-startup %content/ + content/aboutdevtools/aboutdevtools.xhtml (aboutdevtools/aboutdevtools.xhtml) + content/aboutdevtools/aboutdevtools.css (aboutdevtools/aboutdevtools.css) + content/aboutdevtools/aboutdevtools.js (aboutdevtools/aboutdevtools.js) + content/aboutdevtools/subscribe.css (aboutdevtools/subscribe.css) + content/aboutdevtools/subscribe.js (aboutdevtools/subscribe.js) + + content/aboutdevtools/images/otter.svg (aboutdevtools/images/otter.svg) + + content/aboutdevtools/images/dev-edition-logo.svg (aboutdevtools/images/dev-edition-logo.svg) + content/aboutdevtools/images/external-link.svg (aboutdevtools/images/external-link.svg) + content/aboutdevtools/images/feature-inspector.svg (aboutdevtools/images/feature-inspector.svg) + content/aboutdevtools/images/feature-console.svg (aboutdevtools/images/feature-console.svg) + content/aboutdevtools/images/feature-debugger.svg (aboutdevtools/images/feature-debugger.svg) + content/aboutdevtools/images/feature-network.svg (aboutdevtools/images/feature-network.svg) + content/aboutdevtools/images/feature-memory.svg (aboutdevtools/images/feature-memory.svg) + content/aboutdevtools/images/feature-visualediting.svg (aboutdevtools/images/feature-visualediting.svg) + content/aboutdevtools/images/feature-responsive.svg (aboutdevtools/images/feature-responsive.svg) + content/aboutdevtools/images/feature-storage.svg (aboutdevtools/images/feature-storage.svg) + content/aboutdevtools/images/feature-performance.svg (aboutdevtools/images/feature-performance.svg) + + content/DevToolsShim.jsm (DevToolsShim.jsm) diff --git a/devtools/startup/locales/en-US/aboutDevTools.ftl b/devtools/startup/locales/en-US/aboutDevTools.ftl new file mode 100644 index 0000000000..db2146d39c --- /dev/null +++ b/devtools/startup/locales/en-US/aboutDevTools.ftl @@ -0,0 +1,57 @@ +# 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/. + +head-title = About Developer Tools +enable-title = Enable Firefox Developer Tools +enable-inspect-element-title = Enable Firefox Developer Tools to use Inspect Element +enable-inspect-element-message = Examine and edit HTML and CSS with the Developer Tools’ Inspector. +enable-about-debugging-message = Develop and debug WebExtensions, web workers, service workers and more with Firefox Developer Tools. +enable-key-shortcut-message = You activated a Developer Tools shortcut. If that was a mistake, you can close this Tab. +enable-menu-message = Perfect your website’s HTML, CSS, and JavaScript with tools like Inspector and Debugger. +enable-common-message = Firefox Developer Tools are disabled by default to give you more control over your browser. +enable-learn-more-link = Learn more about Developer Tools +enable-enable-button = Enable Developer Tools +enable-close-button = Close this Tab + +welcome-title = Welcome to Firefox Developer Tools! +newsletter-title = Mozilla Developer Newsletter +newsletter-message = Get developer news, tricks and resources sent straight to your inbox. +newsletter-email-placeholder = + .placeholder = Email +newsletter-privacy-label = I’m okay with Mozilla handling my info as explained in this <a data-l10n-name="privacy-policy">Privacy Policy</a>. +newsletter-subscribe-button = Subscribe +newsletter-thanks-title = Thanks! +newsletter-thanks-message = If you haven’t previously confirmed a subscription to a Mozilla-related newsletter you may have to do so. Please check your inbox or your spam filter for an email from us. + +footer-title = Firefox Developer Edition +footer-message = Looking for more than just Developer Tools? Check out the Firefox browser that is built specifically for developers and modern workflows. +footer-learn-more-link = Learn more + +features-learn-more = Learn more +features-inspector-title = Inspector +features-inspector-desc = Inspect and refine code to build pixel-perfect layouts. <a data-l10n-name="learn-more">{ features-learn-more }</a> +features-console-title = Console +features-console-desc = Track CSS, JavaScript, security and network issues. <a data-l10n-name="learn-more">{ features-learn-more }</a> +features-debugger-title = Debugger +features-debugger-desc = Powerful JavaScript debugger with support for your framework. <a data-l10n-name="learn-more">{ features-learn-more }</a> +features-network-title = Network +features-network-desc = Monitor network requests that can slow or block your site. <a data-l10n-name="learn-more">{ features-learn-more }</a> +features-storage-title = Storage +features-storage-desc = Add, modify and remove cache, cookies, databases and session data. <a data-l10n-name="learn-more">{ features-learn-more }</a> +features-responsive-title = Responsive Design Mode +features-responsive-desc = Test sites on emulated devices in your browser. <a data-l10n-name="learn-more">{ features-learn-more }</a> +features-visual-editing-title = Visual Editing +features-visual-editing-desc = Fine-tune animations, alignment and padding. <a data-l10n-name="learn-more">{ features-learn-more }</a> +features-performance-title = Performance +features-performance-desc = Unblock bottlenecks, streamline processes, optimize assets. <a data-l10n-name="learn-more">{ features-learn-more }</a> +features-memory-title = Memory +features-memory-desc = Find memory leaks and make your application zippy. <a data-l10n-name="learn-more">{ features-learn-more }</a> +# Variables: +# $errorDescription (String) - The error that occurred e.g. 404 - Not Found +newsletter-error-common = Subscription request failed ({ $errorDescription }). +newsletter-error-unknown = An unexpected error occurred. +newsletter-error-timeout = Subscription request timed out. +# Variables: +# $shortcut (String) - The keyboard shortcut used for the tool +welcome-message = You’ve successfully enabled Developer Tools! To get started, explore the Web Developer menu or open the tools with { $shortcut }. diff --git a/devtools/startup/locales/en-US/key-shortcuts.properties b/devtools/startup/locales/en-US/key-shortcuts.properties new file mode 100644 index 0000000000..a5bdf43188 --- /dev/null +++ b/devtools/startup/locales/en-US/key-shortcuts.properties @@ -0,0 +1,67 @@ +# 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/. + +# LOCALIZATION NOTE (toggleToolbox.commandkey): +# Key pressed to open a toolbox with the default panel selected +toggleToolbox.commandkey=I + +# LOCALIZATION NOTE (toggleToolboxF12.commandkey): +# Alternative key pressed to open a toolbox with the default panel selected +toggleToolboxF12.commandkey=VK_F12 + +# LOCALIZATION NOTE (browserToolbox.commandkey): +# Key pressed to open the Browser Toolbox, used for debugging Firefox itself +browserToolbox.commandkey=I + +# LOCALIZATION NOTE (browserConsole.commandkey): +# Key pressed to open the Browser Console, used for debugging Firefox itself +browserConsole.commandkey=J + +# LOCALIZATION NOTE (responsiveDesignMode.commandkey): +# Key pressed to toggle on the Responsive Design Mode +responsiveDesignMode.commandkey=M + +# LOCALIZATION NOTE (inspector.commandkey): +# Key pressed to open a toolbox with the inspector panel selected +inspector.commandkey=C + +# LOCALIZATION NOTE (webconsole.commandkey): +# Key pressed to open a toolbox with the web console panel selected +webconsole.commandkey=K + +# LOCALIZATION NOTE (jsdebugger.commandkey2): +# Key pressed to open a toolbox with the debugger panel selected +jsdebugger.commandkey2=Z + +# LOCALIZATION NOTE (netmonitor.commandkey): +# Key pressed to open a toolbox with the network monitor panel selected +netmonitor.commandkey=E + +# LOCALIZATION NOTE (styleeditor.commandkey): +# Key pressed to open a toolbox with the style editor panel selected +styleeditor.commandkey=VK_F7 + +# LOCALIZATION NOTE (performance.commandkey): +# Key pressed to open a toolbox with the performance panel selected +performance.commandkey=VK_F5 + +# LOCALIZATION NOTE (storage.commandkey): +# Key pressed to open a toolbox with the storage panel selected +storage.commandkey=VK_F9 + +# LOCALIZATION NOTE (dom.commandkey): +# Key pressed to open a toolbox with the DOM panel selected +dom.commandkey=W + +# LOCALIZATION NOTE (accessibilityF12.commandkey): +# Key pressed to open a toolbox with the accessibility panel selected +accessibilityF12.commandkey=VK_F12 + +# LOCALIZATION NOTE (profilerStartStop.commandkey): +# Key pressed to start or stop the performance profiler +profilerStartStop.commandkey=VK_1 + +# LOCALIZATION NOTE (profilerCapture.commandkey): +# Key pressed to capture a recorded performance profile +profilerCapture.commandkey=VK_2 diff --git a/devtools/startup/locales/en-US/startup.properties b/devtools/startup/locales/en-US/startup.properties new file mode 100644 index 0000000000..773dd92d79 --- /dev/null +++ b/devtools/startup/locales/en-US/startup.properties @@ -0,0 +1,8 @@ +# 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/. + +# LOCALIZATION NOTE (enableDevTools.label): +# Label for the menu item displayed in Tools > Developer Tools when DevTools are disabled. +enableDevTools.label=Enable Developer Tools… +enableDevTools.accesskey=E diff --git a/devtools/startup/locales/jar.mn b/devtools/startup/locales/jar.mn new file mode 100644 index 0000000000..053610753e --- /dev/null +++ b/devtools/startup/locales/jar.mn @@ -0,0 +1,12 @@ +#filter substitution +# 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/. + +[localization] @AB_CD@.jar: + devtools/startup (%*.ftl) + +@AB_CD@.jar: +% locale devtools-startup @AB_CD@ %locale/@AB_CD@/devtools/startup/ + locale/@AB_CD@/devtools/startup/ (%*.dtd) + locale/@AB_CD@/devtools/startup/ (%*.properties) diff --git a/devtools/startup/locales/moz.build b/devtools/startup/locales/moz.build new file mode 100644 index 0000000000..d988c0ff9b --- /dev/null +++ b/devtools/startup/locales/moz.build @@ -0,0 +1,7 @@ +# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*- +# 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/. + +JAR_MANIFESTS += ["jar.mn"] diff --git a/devtools/startup/moz.build b/devtools/startup/moz.build new file mode 100644 index 0000000000..07341e57fb --- /dev/null +++ b/devtools/startup/moz.build @@ -0,0 +1,29 @@ +# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*- +# 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/. + +JAR_MANIFESTS += ["jar.mn"] + +# Register the startup components only for 'all' builds. +if CONFIG["MOZ_DEVTOOLS"] == "all": + EXTRA_JS_MODULES += [ + "AboutDebuggingRegistration.jsm", + "AboutDevToolsToolboxRegistration.jsm", + "DevToolsStartup.jsm", + ] + + DIRS += [ + "aboutdevtools", + "locales", + ] + +XPCOM_MANIFESTS += [ + "components.conf", +] + +XPCSHELL_TESTS_MANIFESTS += ["tests/xpcshell/xpcshell.ini"] + +if CONFIG["MOZ_BUILD_APP"] != "mobile/android": + BROWSER_CHROME_MANIFESTS += ["tests/browser/browser.ini"] diff --git a/devtools/startup/tests/browser/.eslintrc.js b/devtools/startup/tests/browser/.eslintrc.js new file mode 100644 index 0000000000..3d0bd99e1b --- /dev/null +++ b/devtools/startup/tests/browser/.eslintrc.js @@ -0,0 +1,6 @@ +"use strict"; + +module.exports = { + // Extend from the shared list of defined globals for mochitests. + extends: "../../../.eslintrc.mochitests.js", +}; diff --git a/devtools/startup/tests/browser/browser.ini b/devtools/startup/tests/browser/browser.ini new file mode 100644 index 0000000000..68b802d2aa --- /dev/null +++ b/devtools/startup/tests/browser/browser.ini @@ -0,0 +1,5 @@ +[DEFAULT] +tags = devtools +subsuite = devtools + +[browser_shim_disable_devtools.js] diff --git a/devtools/startup/tests/browser/browser_shim_disable_devtools.js b/devtools/startup/tests/browser/browser_shim_disable_devtools.js new file mode 100644 index 0000000000..0a7c5871ba --- /dev/null +++ b/devtools/startup/tests/browser/browser_shim_disable_devtools.js @@ -0,0 +1,133 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +/* eslint-env browser */ + +const { require } = ChromeUtils.import("resource://devtools/shared/Loader.jsm"); +const { CustomizableUI } = ChromeUtils.import( + "resource:///modules/CustomizableUI.jsm" +); +const { AppConstants } = require("resource://gre/modules/AppConstants.jsm"); +const { gDevTools } = require("devtools/client/framework/devtools"); + +/** + * Test that the preference devtools.policy.disabled disables entry points for devtools. + */ +add_task(async function() { + info( + "Disable DevTools entry points (does not apply to the already created window" + ); + await new Promise(resolve => { + const options = { set: [["devtools.policy.disabled", true]] }; + SpecialPowers.pushPrefEnv(options, resolve); + }); + + // In DEV_EDITION the browser starts with the developer-button in the toolbar. This + // applies to all new windows and forces creating keyboard shortcuts. The preference + // tested should not change without restart, but for the needs of the test, remove the + // developer-button from the UI before opening a new window. + if (AppConstants.MOZ_DEV_EDITION) { + CustomizableUI.removeWidgetFromArea("developer-button"); + } + + info( + "Open a new window, all window-specific hooks for DevTools will be disabled." + ); + const win = OpenBrowserWindow({ private: false }); + await waitForDelayedStartupFinished(win); + + info( + "Open a new tab on the new window to ensure the focus is on the new window" + ); + const tab = BrowserTestUtils.addTab( + win.gBrowser, + "data:text/html;charset=utf-8,<title>foo</title>" + ); + await BrowserTestUtils.browserLoaded(win.gBrowser.getBrowserForTab(tab)); + + info( + "Synthesize a DevTools shortcut, the toolbox should not open on this new window." + ); + synthesizeToggleToolboxKey(win); + + // There is no event to wait for here as this shortcut should have no effect. + /* eslint-disable mozilla/no-arbitrary-setTimeout */ + await new Promise(r => setTimeout(r, 1000)); + + is(gDevTools._toolboxes.size, 0, "No toolbox has been opened"); + + const browser = gBrowser.selectedTab.linkedBrowser; + const location = browser.documentURI.spec; + ok( + !location.startsWith("about:devtools"), + "The current tab is not about:devtools" + ); + + info("Open the context menu for the content page."); + const contextMenu = win.document.getElementById("contentAreaContextMenu"); + const popupShownPromise = BrowserTestUtils.waitForEvent( + contextMenu, + "popupshown" + ); + EventUtils.synthesizeMouseAtCenter( + win.document.documentElement, + { type: "contextmenu", button: 2 }, + win + ); + await popupShownPromise; + + const inspectElementItem = contextMenu.querySelector(`#context-inspect`); + ok( + inspectElementItem.hidden, + "The inspect element item is hidden in the context menu" + ); + + info("Close the context menu"); + const onContextMenuHidden = BrowserTestUtils.waitForEvent( + contextMenu, + "popuphidden" + ); + contextMenu.hidePopup(); + await onContextMenuHidden; + + const toolsMenu = win.document.getElementById("webDeveloperMenu"); + ok(toolsMenu.hidden, "The Web Developer item of the tools menu is hidden"); + const hamburgerMenu = win.document.getElementById("appMenu-developer-button"); + is( + hamburgerMenu, + null, + "The Web Developer item of the hamburger menu should not be available" + ); + + win.gBrowser.removeTab(tab); + + info("Close the test window"); + const winClosed = BrowserTestUtils.windowClosed(win); + win.BrowserTryToCloseWindow(); + await winClosed; +}); + +function waitForDelayedStartupFinished(win) { + return new Promise(resolve => { + Services.obs.addObserver(function observer(subject, topic) { + if (win == subject) { + Services.obs.removeObserver(observer, topic); + resolve(); + } + }, "browser-delayed-startup-finished"); + }); +} + +/** + * Helper to call the toggle devtools shortcut. + */ +function synthesizeToggleToolboxKey(win) { + info("Trigger the toogle toolbox shortcut"); + if (Services.appinfo.OS == "Darwin") { + EventUtils.synthesizeKey("i", { accelKey: true, altKey: true }, win); + } else { + EventUtils.synthesizeKey("i", { accelKey: true, shiftKey: true }, win); + } +} diff --git a/devtools/startup/tests/xpcshell/.eslintrc.js b/devtools/startup/tests/xpcshell/.eslintrc.js new file mode 100644 index 0000000000..6581a0bf32 --- /dev/null +++ b/devtools/startup/tests/xpcshell/.eslintrc.js @@ -0,0 +1,5 @@ +"use strict"; + +module.exports = { + extends: "../../../.eslintrc.xpcshell.js", +}; diff --git a/devtools/startup/tests/xpcshell/test_devtools_shim.js b/devtools/startup/tests/xpcshell/test_devtools_shim.js new file mode 100644 index 0000000000..e728290263 --- /dev/null +++ b/devtools/startup/tests/xpcshell/test_devtools_shim.js @@ -0,0 +1,214 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +const { DevToolsShim } = ChromeUtils.import( + "chrome://devtools-startup/content/DevToolsShim.jsm" +); +const { Services } = ChromeUtils.import("resource://gre/modules/Services.jsm"); + +// Test the DevToolsShim + +/** + * Create a mocked version of DevTools that records all calls made to methods expected + * to be called by DevToolsShim. + */ +function createMockDevTools() { + const methods = [ + "on", + "off", + "emit", + "saveDevToolsSession", + "restoreDevToolsSession", + ]; + + const mock = { + callLog: {}, + }; + + for (const method of methods) { + // Create a stub for method, that only pushes its arguments in the inner callLog + mock[method] = function(...args) { + mock.callLog[method].push(args); + }; + mock.callLog[method] = []; + } + + return mock; +} + +/** + * Check if a given method was called an expected number of times, and finally check the + * arguments provided to the last call, if appropriate. + */ +function checkCalls(mock, method, length, lastArgs) { + ok( + mock.callLog[method].length === length, + "Devtools.on was called the expected number of times" + ); + + // If we don't want to check the last call or if the method was never called, bail out. + if (!lastArgs || length === 0) { + return; + } + + for (let i = 0; i < lastArgs.length; i++) { + const expectedArg = lastArgs[i]; + ok( + mock.callLog[method][length - 1][i] === expectedArg, + `Devtools.${method} was called with the expected argument (index ${i})` + ); + } +} + +function test_register_unregister() { + ok(!DevToolsShim.isInitialized(), "DevTools are not initialized"); + + DevToolsShim.register(createMockDevTools()); + ok(DevToolsShim.isInitialized(), "DevTools are initialized"); + + DevToolsShim.unregister(); + ok(!DevToolsShim.isInitialized(), "DevTools are not initialized"); +} + +function test_on_is_forwarded_to_devtools() { + ok(!DevToolsShim.isInitialized(), "DevTools are not initialized"); + + function cb1() {} + function cb2() {} + const mock = createMockDevTools(); + + DevToolsShim.on("test_event", cb1); + DevToolsShim.register(mock); + checkCalls(mock, "on", 1, ["test_event", cb1]); + + DevToolsShim.on("other_event", cb2); + checkCalls(mock, "on", 2, ["other_event", cb2]); +} + +function test_off_called_before_registering_devtools() { + ok(!DevToolsShim.isInitialized(), "DevTools are not initialized"); + + function cb1() {} + const mock = createMockDevTools(); + + DevToolsShim.on("test_event", cb1); + DevToolsShim.off("test_event", cb1); + + DevToolsShim.register(mock); + checkCalls(mock, "on", 0); +} + +function test_off_called_before_with_bad_callback() { + ok(!DevToolsShim.isInitialized(), "DevTools are not initialized"); + + function cb1() {} + function cb2() {} + const mock = createMockDevTools(); + + DevToolsShim.on("test_event", cb1); + DevToolsShim.off("test_event", cb2); + + DevToolsShim.register(mock); + // on should still be called + checkCalls(mock, "on", 1, ["test_event", cb1]); + // Calls to off should not be held and forwarded. + checkCalls(mock, "off", 0); +} + +function test_events() { + ok(!DevToolsShim.isInitialized(), "DevTools are not initialized"); + + const mock = createMockDevTools(); + // Check emit was not called. + checkCalls(mock, "emit", 0); + + // Check emit is called once with the devtools-registered event. + DevToolsShim.register(mock); + checkCalls(mock, "emit", 1, ["devtools-registered"]); + + // Check emit is called once with the devtools-unregistered event. + DevToolsShim.unregister(); + checkCalls(mock, "emit", 2, ["devtools-unregistered"]); +} + +function test_restore_session_apis() { + // Backup method and preferences that will be updated for the test. + const initDevToolsBackup = DevToolsShim.initDevTools; + const devtoolsEnabledValue = Services.prefs.getBoolPref("devtools.enabled"); + + // Create fake session objects to restore. + const sessionWithoutDevTools = {}; + const sessionWithDevTools = { + browserConsole: true, + }; + + function checkRestoreSessionNotApplied(policyDisabled, enabled) { + Services.prefs.setBoolPref("devtools.enabled", enabled); + Services.prefs.setBoolPref("devtools.policy.disabled", policyDisabled); + ok(!DevToolsShim.isInitialized(), "DevTools are not initialized"); + ok(!DevToolsShim.isEnabled(), "DevTools are not enabled"); + + // Check that save & restore DevToolsSession don't initialize the tools and don't + // crash. + DevToolsShim.saveDevToolsSession({}); + DevToolsShim.restoreDevToolsSession(sessionWithDevTools); + ok(!DevToolsShim.isInitialized(), "DevTools are still not initialized"); + } + + // Tools are disabled by policy and not enabled + checkRestoreSessionNotApplied(true, false); + // Tools are not disabled by policy, but not enabled + checkRestoreSessionNotApplied(false, false); + // Tools are disabled by policy and "considered" as enabled (see Bug 1440675) + checkRestoreSessionNotApplied(true, true); + + Services.prefs.setBoolPref("devtools.enabled", true); + Services.prefs.setBoolPref("devtools.policy.disabled", false); + ok(DevToolsShim.isEnabled(), "DevTools are enabled"); + ok(!DevToolsShim.isInitialized(), "DevTools are not initialized"); + + // Check that DevTools are not initialized when calling restoreDevToolsSession without + // DevTools related data. + DevToolsShim.restoreDevToolsSession(sessionWithoutDevTools); + ok(!DevToolsShim.isInitialized(), "DevTools are still not initialized"); + + const mock = createMockDevTools(); + DevToolsShim.initDevTools = () => { + // Next call to restoreDevToolsSession is expected to initialize DevTools, which we + // simulate here by registering our mock. + DevToolsShim.register(mock); + }; + + DevToolsShim.restoreDevToolsSession(sessionWithDevTools); + checkCalls(mock, "restoreDevToolsSession", 1, [sessionWithDevTools]); + + ok(DevToolsShim.isInitialized(), "DevTools are initialized"); + + DevToolsShim.saveDevToolsSession({}); + checkCalls(mock, "saveDevToolsSession", 1, []); + + // Restore initial backups. + DevToolsShim.initDevTools = initDevToolsBackup; + Services.prefs.setBoolPref("devtools.enabled", devtoolsEnabledValue); +} + +function run_test() { + test_register_unregister(); + DevToolsShim.unregister(); + + test_on_is_forwarded_to_devtools(); + DevToolsShim.unregister(); + + test_off_called_before_registering_devtools(); + DevToolsShim.unregister(); + + test_off_called_before_with_bad_callback(); + DevToolsShim.unregister(); + + test_restore_session_apis(); + DevToolsShim.unregister(); + + test_events(); +} diff --git a/devtools/startup/tests/xpcshell/xpcshell.ini b/devtools/startup/tests/xpcshell/xpcshell.ini new file mode 100644 index 0000000000..c329a440d9 --- /dev/null +++ b/devtools/startup/tests/xpcshell/xpcshell.ini @@ -0,0 +1,6 @@ +[DEFAULT] +tags = devtools +firefox-appdir = browser +skip-if = toolkit == 'android' + +[test_devtools_shim.js] |
