зеркало из https://github.com/mozilla/gecko-dev.git
Merge m-c to f-t
This commit is contained in:
Коммит
b291eb22d1
|
@ -9,14 +9,6 @@ add_task(function* () {
|
|||
let toolbox = yield openNewTabAndToolbox(URL, "inspector");
|
||||
let textboxContextMenu = toolbox.textboxContextMenuPopup;
|
||||
|
||||
emptyClipboard();
|
||||
|
||||
// Make sure the focus is predictable.
|
||||
let inspector = toolbox.getPanel("inspector");
|
||||
let onFocus = once(inspector.searchBox, "focus");
|
||||
inspector.searchBox.focus();
|
||||
yield onFocus;
|
||||
|
||||
ok(textboxContextMenu, "The textbox context menu is loaded in the toolbox");
|
||||
|
||||
let cmdUndo = textboxContextMenu.querySelector("[command=cmd_undo]");
|
||||
|
@ -34,13 +26,10 @@ add_task(function* () {
|
|||
|
||||
is(cmdUndo.getAttribute("disabled"), "true", "cmdUndo is disabled");
|
||||
is(cmdDelete.getAttribute("disabled"), "true", "cmdDelete is disabled");
|
||||
is(cmdSelectAll.getAttribute("disabled"), "true", "cmdSelectAll is disabled");
|
||||
is(cmdSelectAll.getAttribute("disabled"), "", "cmdSelectAll is enabled");
|
||||
is(cmdCut.getAttribute("disabled"), "true", "cmdCut is disabled");
|
||||
is(cmdCopy.getAttribute("disabled"), "true", "cmdCopy is disabled");
|
||||
if (isWindows()) {
|
||||
// emptyClipboard only works on Windows (666254), assert paste only for this OS.
|
||||
is(cmdPaste.getAttribute("disabled"), "true", "cmdPaste is disabled");
|
||||
}
|
||||
|
||||
yield cleanup(toolbox);
|
||||
});
|
||||
|
|
|
@ -84,7 +84,6 @@ function testReload(shortcut, docked, toolID, callback) {
|
|||
|
||||
description = docked + " devtools with tool " + toolID + ", shortcut #" + shortcut;
|
||||
info("Testing reload in " + description);
|
||||
toolbox.win.focus();
|
||||
synthesizeKeyShortcut(L10N.getStr(shortcut), toolbox.win);
|
||||
reloadsSent++;
|
||||
}
|
||||
|
|
|
@ -559,20 +559,3 @@ function stopRecordingTelemetryLogs(Telemetry) {
|
|||
delete Telemetry.prototype._oldlogKeyed;
|
||||
delete Telemetry.prototype.telemetryInfo;
|
||||
}
|
||||
|
||||
/**
|
||||
* Clean the logical clipboard content. This method only clears the OS clipboard on
|
||||
* Windows (see Bug 666254).
|
||||
*/
|
||||
function emptyClipboard() {
|
||||
let clipboard = Cc["@mozilla.org/widget/clipboard;1"]
|
||||
.getService(SpecialPowers.Ci.nsIClipboard);
|
||||
clipboard.emptyClipboard(clipboard.kGlobalClipboard);
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if the current operating system is Windows.
|
||||
*/
|
||||
function isWindows() {
|
||||
return Services.appinfo.OS === "WINNT";
|
||||
}
|
||||
|
|
|
@ -12,31 +12,19 @@ const { DOM, createClass, PropTypes } = require("devtools/client/shared/vendor/r
|
|||
const { div } = DOM;
|
||||
|
||||
/**
|
||||
* Helper panel component that is using an existing DOM node
|
||||
* as the content. It's used by Sidebar as well as SplitBox
|
||||
* components.
|
||||
* Side panel for the Inspector panel.
|
||||
* This side panel is using an existing DOM node as a content.
|
||||
*/
|
||||
var InspectorTabPanel = createClass({
|
||||
displayName: "InspectorTabPanel",
|
||||
|
||||
propTypes: {
|
||||
// ID of the node that should be rendered as the content.
|
||||
id: PropTypes.string.isRequired,
|
||||
// Optional prefix for panel IDs.
|
||||
idPrefix: PropTypes.string,
|
||||
// Optional mount callback
|
||||
onMount: PropTypes.func,
|
||||
},
|
||||
|
||||
getDefaultProps: function () {
|
||||
return {
|
||||
idPrefix: "",
|
||||
};
|
||||
},
|
||||
|
||||
componentDidMount: function () {
|
||||
let doc = this.refs.content.ownerDocument;
|
||||
let panel = doc.getElementById(this.props.idPrefix + this.props.id);
|
||||
let panel = doc.getElementById("sidebar-panel-" + this.props.id);
|
||||
|
||||
// Append existing DOM node into panel's content.
|
||||
this.refs.content.appendChild(panel);
|
||||
|
|
|
@ -29,13 +29,6 @@ add_task(function* () {
|
|||
let cmdPaste = searchContextMenu.querySelector("[command=cmd_paste]");
|
||||
|
||||
info("Opening context menu");
|
||||
|
||||
emptyClipboard();
|
||||
|
||||
let onFocus = once(searchField, "focus");
|
||||
searchField.focus();
|
||||
yield onFocus;
|
||||
|
||||
let onContextMenuPopup = once(searchContextMenu, "popupshowing");
|
||||
EventUtils.synthesizeMouse(searchField, 2, 2,
|
||||
{type: "contextmenu", button: 2}, win);
|
||||
|
@ -43,13 +36,10 @@ add_task(function* () {
|
|||
|
||||
is(cmdUndo.getAttribute("disabled"), "true", "cmdUndo is disabled");
|
||||
is(cmdDelete.getAttribute("disabled"), "true", "cmdDelete is disabled");
|
||||
is(cmdSelectAll.getAttribute("disabled"), "true", "cmdSelectAll is disabled");
|
||||
is(cmdSelectAll.getAttribute("disabled"), "", "cmdSelectAll is enabled");
|
||||
is(cmdCut.getAttribute("disabled"), "true", "cmdCut is disabled");
|
||||
is(cmdCopy.getAttribute("disabled"), "true", "cmdCopy is disabled");
|
||||
if (isWindows()) {
|
||||
// emptyClipboard only works on Windows (666254), assert paste only for this OS.
|
||||
is(cmdPaste.getAttribute("disabled"), "true", "cmdPaste is disabled");
|
||||
}
|
||||
|
||||
info("Closing context menu");
|
||||
let onContextMenuHidden = once(searchContextMenu, "popuphidden");
|
||||
|
|
|
@ -35,14 +35,6 @@ const {LocalizationHelper} = require("devtools/shared/l10n");
|
|||
const INSPECTOR_L10N = new LocalizationHelper("devtools/locale/inspector.properties");
|
||||
const TOOLBOX_L10N = new LocalizationHelper("devtools/locale/toolbox.properties");
|
||||
|
||||
// Sidebar dimensions
|
||||
const INITIAL_SIDEBAR_SIZE = 350;
|
||||
const MIN_SIDEBAR_SIZE = 50;
|
||||
|
||||
// If the toolbox width is smaller than given amount of pixels,
|
||||
// the sidebar automatically switches from 'landscape' to 'portrait' mode.
|
||||
const PORTRAIT_MODE_WIDTH = 700;
|
||||
|
||||
/**
|
||||
* Represents an open instance of the Inspector for a tab.
|
||||
* The inspector controls the breadcrumbs, the markup view, and the sidebar
|
||||
|
@ -102,9 +94,6 @@ function InspectorPanel(iframeWindow, toolbox) {
|
|||
this.onDetached = this.onDetached.bind(this);
|
||||
this.onPaneToggleButtonClicked = this.onPaneToggleButtonClicked.bind(this);
|
||||
this._onMarkupFrameLoad = this._onMarkupFrameLoad.bind(this);
|
||||
this.onPanelWindowResize = this.onPanelWindowResize.bind(this);
|
||||
this.onSidebarShown = this.onSidebarShown.bind(this);
|
||||
this.onSidebarHidden = this.onSidebarHidden.bind(this);
|
||||
|
||||
this._target.on("will-navigate", this._onBeforeNavigate);
|
||||
this._detectingActorFeatures = this._detectActorFeatures();
|
||||
|
@ -411,98 +400,6 @@ InspectorPanel.prototype = {
|
|||
return this._toolbox.browserRequire;
|
||||
},
|
||||
|
||||
get InspectorTabPanel() {
|
||||
if (!this._InspectorTabPanel) {
|
||||
this._InspectorTabPanel =
|
||||
this.React.createFactory(this.browserRequire(
|
||||
"devtools/client/inspector/components/inspector-tab-panel"));
|
||||
}
|
||||
return this._InspectorTabPanel;
|
||||
},
|
||||
|
||||
/**
|
||||
* Build Splitter located between the main and side area of
|
||||
* the Inspector panel.
|
||||
*/
|
||||
setupSplitter: function () {
|
||||
let SplitBox = this.React.createFactory(this.browserRequire(
|
||||
"devtools/client/shared/components/splitter/split-box"));
|
||||
|
||||
this.panelWin.addEventListener("resize", this.onPanelWindowResize, true);
|
||||
|
||||
let splitter = SplitBox({
|
||||
className: "inspector-sidebar-splitter",
|
||||
initialWidth: INITIAL_SIDEBAR_SIZE,
|
||||
initialHeight: INITIAL_SIDEBAR_SIZE,
|
||||
minSize: MIN_SIDEBAR_SIZE,
|
||||
splitterSize: 1,
|
||||
endPanelControl: true,
|
||||
startPanel: this.InspectorTabPanel({
|
||||
id: "inspector-main-content"
|
||||
}),
|
||||
endPanel: this.InspectorTabPanel({
|
||||
id: "inspector-sidebar-container"
|
||||
})
|
||||
});
|
||||
|
||||
this._splitter = this.ReactDOM.render(splitter,
|
||||
this.panelDoc.getElementById("inspector-splitter-box"));
|
||||
|
||||
// Persist splitter state in preferences.
|
||||
this.sidebar.on("show", this.onSidebarShown);
|
||||
this.sidebar.on("hide", this.onSidebarHidden);
|
||||
this.sidebar.on("destroy", this.onSidebarHidden);
|
||||
},
|
||||
|
||||
/**
|
||||
* Splitter clean up.
|
||||
*/
|
||||
teardownSplitter: function () {
|
||||
this.panelWin.removeEventListener("resize", this.onPanelWindowResize, true);
|
||||
|
||||
this.sidebar.off("show", this.onSidebarShown);
|
||||
this.sidebar.off("hide", this.onSidebarHidden);
|
||||
this.sidebar.off("destroy", this.onSidebarHidden);
|
||||
},
|
||||
|
||||
/**
|
||||
* If Toolbox width is less than 600 px, the splitter changes its mode
|
||||
* to `horizontal` to support portrait view.
|
||||
*/
|
||||
onPanelWindowResize: function () {
|
||||
let box = this.panelDoc.getElementById("inspector-splitter-box");
|
||||
this._splitter.setState({
|
||||
vert: (box.clientWidth > PORTRAIT_MODE_WIDTH)
|
||||
});
|
||||
},
|
||||
|
||||
onSidebarShown: function () {
|
||||
let width;
|
||||
let height;
|
||||
|
||||
// Initialize splitter size from preferences.
|
||||
try {
|
||||
width = Services.prefs.getIntPref("devtools.toolsidebar-width.inspector");
|
||||
height = Services.prefs.getIntPref("devtools.toolsidebar-height.inspector");
|
||||
} catch (e) {
|
||||
// Set width and height of the splitter. Only one
|
||||
// value is really useful at a time depending on the current
|
||||
// orientation (vertical/horizontal).
|
||||
// Having both is supported by the splitter component.
|
||||
width = INITIAL_SIDEBAR_SIZE;
|
||||
height = INITIAL_SIDEBAR_SIZE;
|
||||
}
|
||||
|
||||
this._splitter.setState({width, height});
|
||||
},
|
||||
|
||||
onSidebarHidden: function () {
|
||||
// Store the current splitter size to preferences.
|
||||
let state = this._splitter.state;
|
||||
Services.prefs.setIntPref("devtools.toolsidebar-width.inspector", state.width);
|
||||
Services.prefs.setIntPref("devtools.toolsidebar-height.inspector", state.height);
|
||||
},
|
||||
|
||||
/**
|
||||
* Build the sidebar.
|
||||
*/
|
||||
|
@ -558,13 +455,56 @@ InspectorPanel.prototype = {
|
|||
this.sidebar.toggleTab(true, "fontinspector");
|
||||
}
|
||||
|
||||
// Setup the splitter before the sidebar is displayed so,
|
||||
// we don't miss any events.
|
||||
this.setupSplitter();
|
||||
this.setupSidebarSize();
|
||||
|
||||
this.sidebar.show(defaultTab);
|
||||
},
|
||||
|
||||
/**
|
||||
* Sidebar size is currently driven by vbox.inspector-sidebar-container
|
||||
* element, which is located at the left/bottom side of the side bar splitter.
|
||||
* Its size is changed by the splitter and stored into preferences.
|
||||
* As soon as bug 1260552 is fixed and new HTML based splitter in place
|
||||
* the size can be driven by div.inspector-sidebar element. This element
|
||||
* represents the ToolSidebar and so, the entire logic related to size
|
||||
* persistence can be done inside the ToolSidebar.
|
||||
*/
|
||||
setupSidebarSize: function () {
|
||||
let sidePaneContainer = this.panelDoc.querySelector(
|
||||
"#inspector-sidebar-container");
|
||||
|
||||
this.sidebar.on("show", () => {
|
||||
try {
|
||||
sidePaneContainer.width = Services.prefs.getIntPref(
|
||||
"devtools.toolsidebar-width.inspector");
|
||||
sidePaneContainer.height = Services.prefs.getIntPref(
|
||||
"devtools.toolsidebar-height.inspector");
|
||||
} catch (e) {
|
||||
// The default width is the min-width set in CSS
|
||||
// for #inspector-sidebar-container
|
||||
// Set width and height of the sidebar container. Only one
|
||||
// value is really useful at a time depending on the current
|
||||
// toolbox orientation and having both doesn't break anything.
|
||||
sidePaneContainer.width = 450;
|
||||
sidePaneContainer.height = 450;
|
||||
}
|
||||
});
|
||||
|
||||
this.sidebar.on("hide", () => {
|
||||
Services.prefs.setIntPref("devtools.toolsidebar-width.inspector",
|
||||
sidePaneContainer.width);
|
||||
Services.prefs.setIntPref("devtools.toolsidebar-height.inspector",
|
||||
sidePaneContainer.height);
|
||||
});
|
||||
|
||||
this.sidebar.on("destroy", () => {
|
||||
Services.prefs.setIntPref("devtools.toolsidebar-width.inspector",
|
||||
sidePaneContainer.width);
|
||||
Services.prefs.setIntPref("devtools.toolsidebar-height.inspector",
|
||||
sidePaneContainer.height);
|
||||
});
|
||||
},
|
||||
|
||||
setupToolbar: function () {
|
||||
this.teardownToolbar();
|
||||
|
||||
|
@ -858,9 +798,6 @@ InspectorPanel.prototype = {
|
|||
|
||||
this.sidebar.off("select", this._setDefaultSidebar);
|
||||
let sidebarDestroyer = this.sidebar.destroy();
|
||||
|
||||
this.teardownSplitter();
|
||||
|
||||
this.sidebar = null;
|
||||
|
||||
this.teardownToolbar();
|
||||
|
@ -1314,8 +1251,7 @@ InspectorPanel.prototype = {
|
|||
* state and tooltip.
|
||||
*/
|
||||
onPaneToggleButtonClicked: function (e) {
|
||||
let sidePaneContainer = this.panelDoc.querySelector(
|
||||
"#inspector-splitter-box .controlled");
|
||||
let sidePaneContainer = this.panelDoc.querySelector("#inspector-sidebar-container");
|
||||
let isVisible = !this._sidebarToggle.state.collapsed;
|
||||
|
||||
// Make sure the sidebar has width and height attributes before collapsing
|
||||
|
|
|
@ -16,7 +16,6 @@
|
|||
<?xml-stylesheet href="resource://devtools/client/shared/components/tabs/tabbar.css" type="text/css"?>
|
||||
<?xml-stylesheet href="resource://devtools/client/inspector/components/side-panel.css" type="text/css"?>
|
||||
<?xml-stylesheet href="resource://devtools/client/inspector/components/inspector-tab-panel.css" type="text/css"?>
|
||||
<?xml-stylesheet href="resource://devtools/client/shared/components/splitter/split-box.css" type="text/css"?>
|
||||
|
||||
<!DOCTYPE window [
|
||||
<!ENTITY % inspectorDTD SYSTEM "chrome://devtools/locale/inspector.dtd"> %inspectorDTD;
|
||||
|
@ -31,10 +30,8 @@
|
|||
<script type="application/javascript;version=1.8"
|
||||
src="chrome://devtools/content/shared/theme-switching.js"/>
|
||||
|
||||
<html:div class="inspector-responsive-container theme-body inspector">
|
||||
|
||||
<!-- Main Panel Content -->
|
||||
<html:div id="inspector-main-content" class="devtools-main-content">
|
||||
<box flex="1" class="devtools-responsive-container theme-body">
|
||||
<vbox flex="1" class="devtools-main-content">
|
||||
<html:div id="inspector-toolbar"
|
||||
class="devtools-toolbar"
|
||||
nowindowdrag="true">
|
||||
|
@ -52,31 +49,27 @@
|
|||
<html:button id="inspector-eyedropper-toggle"
|
||||
title="&inspectorEyeDropper.label;"
|
||||
class="devtools-button command-button-invertable" />
|
||||
<html:div id="inspector-sidebar-toggle-box" />
|
||||
<div xmlns="http://www.w3.org/1999/xhtml"
|
||||
id="inspector-sidebar-toggle-box" />
|
||||
</html:div>
|
||||
<html:div id="markup-box" />
|
||||
<vbox flex="1" id="markup-box">
|
||||
</vbox>
|
||||
<html:div id="inspector-breadcrumbs-toolbar" class="devtools-toolbar">
|
||||
<html:div id="inspector-breadcrumbs" class="breadcrumbs-widget-container"
|
||||
role="group" aria-label="&inspectorBreadcrumbsGroup;" tabindex="0" />
|
||||
</html:div>
|
||||
</html:div>
|
||||
|
||||
<!-- Splitter -->
|
||||
<html:div
|
||||
xmlns="http://www.w3.org/1999/xhtml"
|
||||
id="inspector-splitter-box">
|
||||
</html:div>
|
||||
|
||||
<!-- Sidebar Container -->
|
||||
<html:div id="inspector-sidebar-container">
|
||||
<html:div
|
||||
xmlns="http://www.w3.org/1999/xhtml"
|
||||
</vbox>
|
||||
<splitter class="devtools-side-splitter"/>
|
||||
<vbox id="inspector-sidebar-container">
|
||||
<!-- Specify the XHTML namespace explicitly
|
||||
otherwise the layout is broken. -->
|
||||
<div xmlns="http://www.w3.org/1999/xhtml"
|
||||
id="inspector-sidebar"
|
||||
hidden="true" />
|
||||
</html:div>
|
||||
</vbox>
|
||||
|
||||
<!-- Sidebar panel definitions -->
|
||||
<html:div id="tabpanels" style="visibility:collapse">
|
||||
<html:div xmlns="http://www.w3.org/1999/xhtml" id="tabpanels" style="visibility:collapse">
|
||||
<html:div id="sidebar-panel-ruleview" class="devtools-monospace theme-sidebar inspector-tabpanel">
|
||||
<html:div id="ruleview-toolbar-container" class="devtools-toolbar">
|
||||
<html:div id="ruleview-toolbar">
|
||||
|
@ -225,5 +218,5 @@
|
|||
</html:div>
|
||||
</html:div>
|
||||
|
||||
</html:div>
|
||||
</box>
|
||||
</window>
|
||||
|
|
|
@ -51,7 +51,7 @@ add_task(function* () {
|
|||
let onHidden = cPicker.tooltip.once("hidden");
|
||||
// Validating the color change ends up updating the rule view twice
|
||||
let onRuleViewChanged = waitForNEvents(view, "ruleview-changed", 2);
|
||||
focusAndSendKey(spectrum.element.ownerDocument.defaultView, "RETURN");
|
||||
EventUtils.sendKey("RETURN", spectrum.element.ownerDocument.defaultView);
|
||||
yield onHidden;
|
||||
yield onRuleViewChanged;
|
||||
|
||||
|
|
|
@ -56,7 +56,7 @@ function* basicTest(view, name, result) {
|
|||
let onHidden = cPicker.tooltip.once("hidden");
|
||||
// Validating the color change ends up updating the rule view twice
|
||||
let onRuleViewChanged = waitForNEvents(view, "ruleview-changed", 2);
|
||||
focusAndSendKey(spectrum.element.ownerDocument.defaultView, "RETURN");
|
||||
EventUtils.sendKey("RETURN", spectrum.element.ownerDocument.defaultView);
|
||||
yield onHidden;
|
||||
yield onRuleViewChanged;
|
||||
|
||||
|
|
|
@ -48,7 +48,7 @@ function* testImageTooltipAfterColorChange(swatch, url, ruleView) {
|
|||
let spectrum = picker.spectrum;
|
||||
let onHidden = picker.tooltip.once("hidden");
|
||||
let onModifications = ruleView.once("ruleview-changed");
|
||||
focusAndSendKey(spectrum.element.ownerDocument.defaultView, "RETURN");
|
||||
EventUtils.sendKey("RETURN", spectrum.element.ownerDocument.defaultView);
|
||||
yield onHidden;
|
||||
yield onModifications;
|
||||
|
||||
|
|
|
@ -46,7 +46,7 @@ function* testColorChangeIsntRevertedWhenOtherTooltipIsShown(ruleView) {
|
|||
|
||||
let onModifications = waitForNEvents(ruleView, "ruleview-changed", 2);
|
||||
let onHidden = picker.tooltip.once("hidden");
|
||||
focusAndSendKey(spectrum.element.ownerDocument.defaultView, "RETURN");
|
||||
EventUtils.sendKey("RETURN", spectrum.element.ownerDocument.defaultView);
|
||||
yield onHidden;
|
||||
yield onModifications;
|
||||
|
||||
|
|
|
@ -47,7 +47,7 @@ function* testPressingEnterCommitsChanges(swatch, ruleView) {
|
|||
let onModified = ruleView.once("ruleview-changed");
|
||||
let spectrum = cPicker.spectrum;
|
||||
let onHidden = cPicker.tooltip.once("hidden");
|
||||
focusAndSendKey(spectrum.element.ownerDocument.defaultView, "RETURN");
|
||||
EventUtils.sendKey("RETURN", spectrum.element.ownerDocument.defaultView);
|
||||
yield onHidden;
|
||||
yield onModified;
|
||||
|
||||
|
|
|
@ -53,7 +53,7 @@ function* testPressingEnterCommitsChanges(swatch, ruleView) {
|
|||
// Pressing RETURN ends up doing 2 rule-view updates, one for the preview and
|
||||
// one for the commit when the tooltip closes.
|
||||
let onRuleViewChanged = waitForNEvents(ruleView, "ruleview-changed", 2);
|
||||
focusAndSendKey(widget.parent.ownerDocument.defaultView, "RETURN");
|
||||
EventUtils.sendKey("RETURN", widget.parent.ownerDocument.defaultView);
|
||||
yield onRuleViewChanged;
|
||||
|
||||
let style = yield getComputedStyleProperty("body", null,
|
||||
|
|
|
@ -94,7 +94,7 @@ function* escapeTooltip(view) {
|
|||
let widget = yield bezierTooltip.widget;
|
||||
let onHidden = bezierTooltip.tooltip.once("hidden");
|
||||
let onModifications = view.once("ruleview-changed");
|
||||
focusAndSendKey(widget.parent.ownerDocument.defaultView, "ESCAPE");
|
||||
EventUtils.sendKey("ESCAPE", widget.parent.ownerDocument.defaultView);
|
||||
yield onHidden;
|
||||
yield onModifications;
|
||||
}
|
||||
|
|
|
@ -64,8 +64,6 @@ add_task(function* () {
|
|||
tooltip.hide();
|
||||
yield onHidden;
|
||||
ok(!tooltip.isVisible(), "color picker tooltip is closed");
|
||||
|
||||
yield waitForTick();
|
||||
});
|
||||
|
||||
function* testESC(swatch, inspector, testActor) {
|
||||
|
|
|
@ -29,6 +29,4 @@ add_task(function* () {
|
|||
"The inplace editor wasn't shown as a result of the filter swatch click");
|
||||
|
||||
yield hideTooltipAndWaitForRuleViewChanged(filterTooltip, view);
|
||||
|
||||
yield waitForTick();
|
||||
});
|
||||
|
|
|
@ -28,13 +28,6 @@ add_task(function* () {
|
|||
let cmdPaste = searchContextMenu.querySelector("[command=cmd_paste]");
|
||||
|
||||
info("Opening context menu");
|
||||
|
||||
emptyClipboard();
|
||||
|
||||
let onFocus = once(searchField, "focus");
|
||||
searchField.focus();
|
||||
yield onFocus;
|
||||
|
||||
let onContextMenuPopup = once(searchContextMenu, "popupshowing");
|
||||
EventUtils.synthesizeMouse(searchField, 2, 2,
|
||||
{type: "contextmenu", button: 2}, win);
|
||||
|
@ -42,13 +35,10 @@ add_task(function* () {
|
|||
|
||||
is(cmdUndo.getAttribute("disabled"), "true", "cmdUndo is disabled");
|
||||
is(cmdDelete.getAttribute("disabled"), "true", "cmdDelete is disabled");
|
||||
is(cmdSelectAll.getAttribute("disabled"), "true", "cmdSelectAll is disabled");
|
||||
is(cmdSelectAll.getAttribute("disabled"), "", "cmdSelectAll is enabled");
|
||||
is(cmdCut.getAttribute("disabled"), "true", "cmdCut is disabled");
|
||||
is(cmdCopy.getAttribute("disabled"), "true", "cmdCopy is disabled");
|
||||
if (isWindows()) {
|
||||
// emptyClipboard only works on Windows (666254), assert paste only for this OS.
|
||||
is(cmdPaste.getAttribute("disabled"), "true", "cmdPaste is disabled");
|
||||
}
|
||||
|
||||
info("Closing context menu");
|
||||
let onContextMenuHidden = once(searchContextMenu, "popuphidden");
|
||||
|
|
|
@ -814,13 +814,3 @@ function waitForStyleModification(inspector) {
|
|||
inspector.on("markupmutation", checkForStyleModification);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Make sure window is properly focused before sending a key event.
|
||||
* @param {Window} win
|
||||
* @param {Event} key
|
||||
*/
|
||||
function focusAndSendKey(win, key) {
|
||||
win.document.documentElement.focus();
|
||||
EventUtils.sendKey(key, win);
|
||||
}
|
||||
|
|
|
@ -130,6 +130,7 @@ subsuite = clipboard
|
|||
[browser_inspector_pane-toggle-01.js]
|
||||
[browser_inspector_pane-toggle-02.js]
|
||||
[browser_inspector_pane-toggle-03.js]
|
||||
[browser_inspector_pane-toggle-04.js]
|
||||
[browser_inspector_pane-toggle-05.js]
|
||||
skip-if = os == "mac" # Full keyboard navigation on OSX only works if Full Keyboard Access setting is set to All Control in System Keyboard
|
||||
[browser_inspector_picker-stop-on-destroy.js]
|
||||
|
|
|
@ -32,10 +32,6 @@ const NODES = [
|
|||
];
|
||||
|
||||
add_task(function* () {
|
||||
// This test needs specific initial size of the sidebar.
|
||||
yield pushPref("devtools.toolsidebar-width.inspector", 350);
|
||||
yield pushPref("devtools.toolsidebar-height.inspector", 150);
|
||||
|
||||
let { inspector, toolbox } = yield openInspectorForURL(TEST_URI);
|
||||
|
||||
// No way to wait for scrolling to end (Bug 1172171)
|
||||
|
|
|
@ -11,8 +11,7 @@ add_task(function* () {
|
|||
info("Open the inspector in a side toolbox host");
|
||||
let {toolbox, inspector} = yield openInspectorForURL("about:blank", "side");
|
||||
|
||||
let panel = inspector.panelDoc.querySelector("#inspector-splitter-box .controlled");
|
||||
|
||||
let panel = inspector.panelDoc.querySelector("#inspector-sidebar-container");
|
||||
let button = inspector.panelDoc.querySelector(".sidebar-toggle");
|
||||
ok(!panel.classList.contains("pane-collapsed"), "The panel is in expanded state");
|
||||
|
||||
|
|
|
@ -10,7 +10,7 @@ add_task(function* () {
|
|||
let {inspector} = yield openInspectorForURL("about:blank");
|
||||
|
||||
let button = inspector.panelDoc.querySelector(".sidebar-toggle");
|
||||
let panel = inspector.panelDoc.querySelector("#inspector-splitter-box .controlled");
|
||||
let panel = inspector.panelDoc.querySelector("#inspector-sidebar-container");
|
||||
|
||||
ok(!button.classList.contains("pane-collapsed"), "The button is in expanded state");
|
||||
|
||||
|
|
|
@ -0,0 +1,65 @@
|
|||
/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
|
||||
/* Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/ */
|
||||
"use strict";
|
||||
|
||||
let { Toolbox } = require("devtools/client/framework/toolbox");
|
||||
|
||||
// Test that the dimensions of the collapsed inspector panel are not modified
|
||||
// when switching from horizontal to vertical layout, which is mandatory to make
|
||||
// sure the panel remains visually hidden (using negative margins).
|
||||
|
||||
add_task(function* () {
|
||||
info("Set temporary preferences to ensure a small sidebar width.");
|
||||
yield new Promise(resolve => {
|
||||
let options = {"set": [
|
||||
["devtools.toolsidebar-width.inspector", 200]
|
||||
]};
|
||||
SpecialPowers.pushPrefEnv(options, resolve);
|
||||
});
|
||||
|
||||
let { inspector, toolbox } = yield openInspectorForURL("about:blank");
|
||||
let button = inspector.panelDoc.querySelector(".sidebar-toggle");
|
||||
let panel = inspector.panelDoc.querySelector("#inspector-sidebar-container");
|
||||
|
||||
info("Changing toolbox host to a window.");
|
||||
yield toolbox.switchHost(Toolbox.HostType.WINDOW);
|
||||
|
||||
let hostWindow = toolbox._host._window;
|
||||
let originalWidth = hostWindow.outerWidth;
|
||||
let originalHeight = hostWindow.outerHeight;
|
||||
|
||||
info("Resizing window to switch to the horizontal layout.");
|
||||
hostWindow.resizeTo(800, 300);
|
||||
|
||||
// Check the sidebar is expanded when the test starts.
|
||||
ok(!panel.classList.contains("pane-collapsed"), "The panel is in expanded state");
|
||||
|
||||
info("Collapse the inspector sidebar.");
|
||||
let onTransitionEnd = once(panel, "transitionend");
|
||||
EventUtils.synthesizeMouseAtCenter(button, {},
|
||||
inspector.panelDoc.defaultView);
|
||||
yield onTransitionEnd;
|
||||
|
||||
ok(panel.classList.contains("pane-collapsed"), "The panel is in collapsed state");
|
||||
let currentPanelHeight = panel.getBoundingClientRect().height;
|
||||
let currentPanelMarginBottom = panel.style.marginBottom;
|
||||
|
||||
info("Resizing window to switch to the vertical layout.");
|
||||
hostWindow.resizeTo(300, 800);
|
||||
|
||||
// Check the panel is collapsed, and still has the same dimensions.
|
||||
ok(panel.classList.contains("pane-collapsed"), "The panel is still collapsed");
|
||||
is(panel.getBoundingClientRect().height, currentPanelHeight,
|
||||
"The panel height has not been modified when changing the layout.");
|
||||
is(panel.style.marginBottom, currentPanelMarginBottom,
|
||||
"The panel margin-bottom has not been modified when changing the layout.");
|
||||
|
||||
info("Restoring window original size.");
|
||||
hostWindow.resizeTo(originalWidth, originalHeight);
|
||||
});
|
||||
|
||||
registerCleanupFunction(function () {
|
||||
// Restore the host type for other tests.
|
||||
Services.prefs.clearUserPref("devtools.toolbox.host");
|
||||
});
|
|
@ -10,8 +10,7 @@
|
|||
|
||||
add_task(function* () {
|
||||
let {inspector} = yield openInspectorForURL("about:blank", "side");
|
||||
let panel = inspector.panelDoc.querySelector("#inspector-splitter-box .controlled");
|
||||
|
||||
let panel = inspector.panelDoc.querySelector("#inspector-sidebar-container");
|
||||
let button = inspector.panelDoc.querySelector(".sidebar-toggle");
|
||||
|
||||
ok(!panel.classList.contains("pane-collapsed"), "The panel is in expanded state");
|
||||
|
|
|
@ -26,13 +26,7 @@ add_task(function* () {
|
|||
let cmdCopy = searchContextMenu.querySelector("[command=cmd_copy]");
|
||||
let cmdPaste = searchContextMenu.querySelector("[command=cmd_paste]");
|
||||
|
||||
emptyClipboard();
|
||||
|
||||
info("Opening context menu");
|
||||
let onFocus = once(searchBox, "focus");
|
||||
searchBox.focus();
|
||||
yield onFocus;
|
||||
|
||||
let onContextMenuPopup = once(searchContextMenu, "popupshowing");
|
||||
EventUtils.synthesizeMouse(searchBox, 2, 2,
|
||||
{type: "contextmenu", button: 2}, win);
|
||||
|
@ -40,13 +34,10 @@ add_task(function* () {
|
|||
|
||||
is(cmdUndo.getAttribute("disabled"), "true", "cmdUndo is disabled");
|
||||
is(cmdDelete.getAttribute("disabled"), "true", "cmdDelete is disabled");
|
||||
is(cmdSelectAll.getAttribute("disabled"), "true", "cmdSelectAll is disabled");
|
||||
is(cmdSelectAll.getAttribute("disabled"), "", "cmdSelectAll is enabled");
|
||||
is(cmdCut.getAttribute("disabled"), "true", "cmdCut is disabled");
|
||||
is(cmdCopy.getAttribute("disabled"), "true", "cmdCopy is disabled");
|
||||
if (isWindows()) {
|
||||
// emptyClipboard only works on Windows (666254), assert paste only for this OS.
|
||||
is(cmdPaste.getAttribute("disabled"), "true", "cmdPaste is disabled");
|
||||
}
|
||||
|
||||
info("Closing context menu");
|
||||
let onContextMenuHidden = once(searchContextMenu, "popuphidden");
|
||||
|
@ -56,7 +47,6 @@ add_task(function* () {
|
|||
info("Copy text in search field using the context menu");
|
||||
searchBox.value = TEST_INPUT;
|
||||
searchBox.select();
|
||||
searchBox.focus();
|
||||
EventUtils.synthesizeMouse(searchBox, 2, 2,
|
||||
{type: "contextmenu", button: 2}, win);
|
||||
yield onContextMenuPopup;
|
||||
|
|
|
@ -66,7 +66,12 @@ ToolSidebar.prototype = {
|
|||
},
|
||||
|
||||
get InspectorTabPanel() {
|
||||
return this._toolPanel.InspectorTabPanel;
|
||||
if (!this._InspectorTabPanel) {
|
||||
this._InspectorTabPanel =
|
||||
this.React.createFactory(this.browserRequire(
|
||||
"devtools/client/inspector/components/inspector-tab-panel"));
|
||||
}
|
||||
return this._InspectorTabPanel;
|
||||
},
|
||||
|
||||
// Rendering
|
||||
|
@ -85,14 +90,7 @@ ToolSidebar.prototype = {
|
|||
},
|
||||
|
||||
addExistingTab: function (id, title, selected) {
|
||||
let panel = this.InspectorTabPanel({
|
||||
id: id,
|
||||
idPrefix: this.TABPANEL_ID_PREFIX,
|
||||
key: id,
|
||||
title: title,
|
||||
});
|
||||
|
||||
this._tabbar.addTab(id, title, selected, panel);
|
||||
this._tabbar.addTab(id, title, selected, this.InspectorTabPanel);
|
||||
|
||||
this.emit("new-tab-registered", id);
|
||||
},
|
||||
|
@ -107,7 +105,6 @@ ToolSidebar.prototype = {
|
|||
addFrameTab: function (id, title, url, selected) {
|
||||
let panel = this.InspectorTabPanel({
|
||||
id: id,
|
||||
idPrefix: this.TABPANEL_ID_PREFIX,
|
||||
key: id,
|
||||
title: title,
|
||||
url: url,
|
||||
|
|
|
@ -6,7 +6,6 @@
|
|||
|
||||
DIRS += [
|
||||
'reps',
|
||||
'splitter',
|
||||
'tabs',
|
||||
'tree'
|
||||
]
|
||||
|
|
|
@ -1,54 +0,0 @@
|
|||
/* 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 React = require("devtools/client/shared/vendor/react");
|
||||
const ReactDOM = require("devtools/client/shared/vendor/react-dom");
|
||||
const { DOM: dom, PropTypes } = React;
|
||||
|
||||
const Draggable = React.createClass({
|
||||
displayName: "Draggable",
|
||||
|
||||
propTypes: {
|
||||
onMove: PropTypes.func.isRequired,
|
||||
onStart: PropTypes.func,
|
||||
onStop: PropTypes.func,
|
||||
style: PropTypes.object,
|
||||
className: PropTypes.string
|
||||
},
|
||||
|
||||
startDragging(ev) {
|
||||
ev.preventDefault();
|
||||
const doc = ReactDOM.findDOMNode(this).ownerDocument;
|
||||
doc.addEventListener("mousemove", this.onMove);
|
||||
doc.addEventListener("mouseup", this.onUp);
|
||||
this.props.onStart && this.props.onStart();
|
||||
},
|
||||
|
||||
onMove(ev) {
|
||||
ev.preventDefault();
|
||||
// Use screen coordinates so, moving mouse over iframes
|
||||
// doesn't mangle (relative) coordinates.
|
||||
this.props.onMove(ev.screenX, ev.screenY);
|
||||
},
|
||||
|
||||
onUp(ev) {
|
||||
ev.preventDefault();
|
||||
const doc = ReactDOM.findDOMNode(this).ownerDocument;
|
||||
doc.removeEventListener("mousemove", this.onMove);
|
||||
doc.removeEventListener("mouseup", this.onUp);
|
||||
this.props.onStop && this.props.onStop();
|
||||
},
|
||||
|
||||
render() {
|
||||
return dom.div({
|
||||
style: this.props.style,
|
||||
className: this.props.className,
|
||||
onMouseDown: this.startDragging
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
module.exports = Draggable;
|
|
@ -1,11 +0,0 @@
|
|||
# -*- 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/.
|
||||
|
||||
DevToolsModules(
|
||||
'draggable.js',
|
||||
'split-box.css',
|
||||
'split-box.js',
|
||||
)
|
|
@ -1,88 +0,0 @@
|
|||
/* vim:set ts=2 sw=2 sts=2 et: */
|
||||
/* 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/. */
|
||||
|
||||
.split-box {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.split-box.vert {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.split-box.horz {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.split-box > .uncontrolled {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.split-box > .controlled {
|
||||
display: flex;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.split-box > .splitter {
|
||||
background-image: none;
|
||||
border: 0;
|
||||
border-style: solid;
|
||||
border-color: transparent;
|
||||
background-color: var(--theme-splitter-color);
|
||||
background-clip: content-box;
|
||||
position: relative;
|
||||
|
||||
box-sizing: border-box;
|
||||
|
||||
/* Positive z-index positions the splitter on top of its siblings and makes
|
||||
it clickable on both sides. */
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.split-box.vert > .splitter {
|
||||
min-width: calc(var(--devtools-splitter-inline-start-width) +
|
||||
var(--devtools-splitter-inline-end-width) + 1px);
|
||||
|
||||
border-inline-start-width: var(--devtools-splitter-inline-start-width);
|
||||
border-inline-end-width: var(--devtools-splitter-inline-end-width);
|
||||
|
||||
margin-inline-start: calc(-1 * var(--devtools-splitter-inline-start-width) - 1px);
|
||||
margin-inline-end: calc(-1 * var(--devtools-splitter-inline-end-width));
|
||||
|
||||
cursor: ew-resize;
|
||||
}
|
||||
|
||||
.split-box.horz > .splitter {
|
||||
min-height: calc(var(--devtools-splitter-top-width) +
|
||||
var(--devtools-splitter-bottom-width) + 1px);
|
||||
|
||||
border-top-width: var(--devtools-splitter-top-width);
|
||||
border-bottom-width: var(--devtools-splitter-bottom-width);
|
||||
|
||||
margin-top: calc(-1 * var(--devtools-splitter-top-width) - 1px);
|
||||
margin-bottom: calc(-1 * var(--devtools-splitter-bottom-width));
|
||||
|
||||
cursor: ns-resize;
|
||||
}
|
||||
|
||||
.split-box.disabled {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* Make sure splitter panels are not processing any mouse
|
||||
* events. This is good for performance during splitter
|
||||
* bar dragging.
|
||||
*/
|
||||
.split-box.dragging > .controlled,
|
||||
.split-box.dragging > .uncontrolled {
|
||||
pointer-events: none;
|
||||
}
|
|
@ -1,207 +0,0 @@
|
|||
/* 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 React = require("devtools/client/shared/vendor/react");
|
||||
const ReactDOM = require("devtools/client/shared/vendor/react-dom");
|
||||
const Draggable = React.createFactory(require("devtools/client/shared/components/splitter/draggable"));
|
||||
const { DOM: dom, PropTypes } = React;
|
||||
|
||||
/**
|
||||
* This component represents a Splitter. The splitter supports vertical
|
||||
* as well as horizontal mode.
|
||||
*/
|
||||
const SplitBox = React.createClass({
|
||||
displayName: "SplitBox",
|
||||
|
||||
propTypes: {
|
||||
// Custom class name. You can use more names separated by a space.
|
||||
className: PropTypes.string,
|
||||
// Initial size of controlled panel.
|
||||
initialSize: PropTypes.number,
|
||||
// Left/top panel
|
||||
startPanel: PropTypes.any,
|
||||
// Min panel size.
|
||||
minSize: PropTypes.number,
|
||||
// Max panel size.
|
||||
maxSize: PropTypes.number,
|
||||
// Right/bottom panel
|
||||
endPanel: PropTypes.any,
|
||||
// True if the right/bottom panel should be controlled.
|
||||
endPanelControl: PropTypes.bool,
|
||||
// Size of the splitter handle bar.
|
||||
splitterSize: PropTypes.number,
|
||||
// True if the splitter bar is vertical (default is vertical).
|
||||
vert: PropTypes.bool
|
||||
},
|
||||
|
||||
getDefaultProps() {
|
||||
return {
|
||||
splitterSize: 5,
|
||||
vert: true,
|
||||
endPanelControl: false
|
||||
};
|
||||
},
|
||||
|
||||
/**
|
||||
* The state stores the current orientation (vertical or horizontal)
|
||||
* and the current size (width/height). All these values can change
|
||||
* during the component's life time.
|
||||
*/
|
||||
getInitialState() {
|
||||
return {
|
||||
vert: this.props.vert,
|
||||
width: this.props.initialWidth || this.props.initialSize,
|
||||
height: this.props.initialHeight || this.props.initialSize
|
||||
};
|
||||
},
|
||||
|
||||
// Dragging Events
|
||||
|
||||
/**
|
||||
* Set 'resizing' cursor on entire document during splitter dragging.
|
||||
* This avoids cursor-flickering that happens when the mouse leaves
|
||||
* the splitter bar area (happens frequently).
|
||||
*/
|
||||
onStartMove() {
|
||||
const splitBox = ReactDOM.findDOMNode(this);
|
||||
const doc = splitBox.ownerDocument;
|
||||
let defaultCursor = doc.documentElement.style.cursor;
|
||||
doc.documentElement.style.cursor = (this.state.vert ? "ew-resize" : "ns-resize");
|
||||
|
||||
splitBox.classList.add("dragging");
|
||||
|
||||
this.setState({
|
||||
defaultCursor: defaultCursor
|
||||
});
|
||||
},
|
||||
|
||||
onStopMove() {
|
||||
const splitBox = ReactDOM.findDOMNode(this);
|
||||
const doc = splitBox.ownerDocument;
|
||||
doc.documentElement.style.cursor = this.state.defaultCursor;
|
||||
|
||||
splitBox.classList.remove("dragging");
|
||||
},
|
||||
|
||||
/**
|
||||
* Adjust size of the controlled panel. Depending on the current
|
||||
* orientation we either remember the width or height of
|
||||
* the splitter box.
|
||||
*/
|
||||
onMove(x, y) {
|
||||
const node = ReactDOM.findDOMNode(this);
|
||||
const doc = node.ownerDocument;
|
||||
const win = doc.defaultView;
|
||||
|
||||
let size;
|
||||
let { endPanelControl } = this.props;
|
||||
|
||||
if (this.state.vert) {
|
||||
// Switch the control flag in case of RTL. Note that RTL
|
||||
// has impact on vertical splitter only.
|
||||
let dir = win.getComputedStyle(doc.documentElement).direction;
|
||||
if (dir == "rtl") {
|
||||
endPanelControl = !endPanelControl;
|
||||
}
|
||||
|
||||
let innerOffset = x - win.mozInnerScreenX;
|
||||
size = endPanelControl ?
|
||||
(node.offsetLeft + node.offsetWidth) - innerOffset :
|
||||
innerOffset - node.offsetLeft;
|
||||
|
||||
this.setState({
|
||||
width: size
|
||||
});
|
||||
} else {
|
||||
let innerOffset = y - win.mozInnerScreenY;
|
||||
size = endPanelControl ?
|
||||
(node.offsetTop + node.offsetHeight) - innerOffset :
|
||||
innerOffset - node.offsetTop;
|
||||
|
||||
this.setState({
|
||||
height: size
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
// Rendering
|
||||
|
||||
render() {
|
||||
const vert = this.state.vert;
|
||||
const { startPanel, endPanel, endPanelControl, minSize,
|
||||
maxSize, splitterSize } = this.props;
|
||||
|
||||
let style = Object.assign({}, this.props.style);
|
||||
|
||||
// Calculate class names list.
|
||||
let classNames = ["split-box"];
|
||||
classNames.push(vert ? "vert" : "horz");
|
||||
if (this.props.className) {
|
||||
classNames = classNames.concat(this.props.className.split(" "));
|
||||
}
|
||||
|
||||
let leftPanelStyle;
|
||||
let rightPanelStyle;
|
||||
|
||||
// Set proper size for panels depending on the current state.
|
||||
if (vert) {
|
||||
leftPanelStyle = {
|
||||
maxWidth: endPanelControl ? null : maxSize,
|
||||
minWidth: endPanelControl ? null : minSize,
|
||||
width: endPanelControl ? null : this.state.width
|
||||
};
|
||||
rightPanelStyle = {
|
||||
maxWidth: endPanelControl ? maxSize : null,
|
||||
minWidth: endPanelControl ? minSize : null,
|
||||
width: endPanelControl ? this.state.width : null
|
||||
};
|
||||
} else {
|
||||
leftPanelStyle = {
|
||||
maxHeight: endPanelControl ? null : maxSize,
|
||||
minHeight: endPanelControl ? null : minSize,
|
||||
height: endPanelControl ? null : this.state.height
|
||||
};
|
||||
rightPanelStyle = {
|
||||
maxHeight: endPanelControl ? maxSize : null,
|
||||
minHeight: endPanelControl ? minSize : null,
|
||||
height: endPanelControl ? this.state.height : null
|
||||
};
|
||||
}
|
||||
|
||||
// Calculate splitter size
|
||||
let splitterStyle = {
|
||||
flex: "0 0 " + splitterSize + "px"
|
||||
};
|
||||
|
||||
return (
|
||||
dom.div({
|
||||
className: classNames.join(" "),
|
||||
style: style },
|
||||
startPanel ?
|
||||
dom.div({
|
||||
className: endPanelControl ? "uncontrolled" : "controlled",
|
||||
style: leftPanelStyle},
|
||||
startPanel
|
||||
) : null,
|
||||
Draggable({
|
||||
className: "splitter",
|
||||
style: splitterStyle,
|
||||
onStart: this.onStartMove,
|
||||
onStop: this.onStopMove,
|
||||
onMove: this.onMove
|
||||
}),
|
||||
endPanel ?
|
||||
dom.div({
|
||||
className: endPanelControl ? "controlled" : "uncontrolled",
|
||||
style: rightPanelStyle},
|
||||
endPanel
|
||||
) : null
|
||||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
module.exports = SplitBox;
|
|
@ -57,11 +57,7 @@ window.onload = Task.async(function* () {
|
|||
document.body.appendChild(panel);
|
||||
|
||||
return setState(tabbarReact, Object.assign({}, tabbarReact.state, {
|
||||
tabs: tabbarReact.state.tabs.concat({
|
||||
id: `sidebar-panel-${tabId}`,
|
||||
title: `tab-${tabId}`,
|
||||
panel: InspectorTabPanel
|
||||
}),
|
||||
tabs: tabbarReact.state.tabs.concat({id: `${tabId}`, title: `tab-${tabId}`, panel: InspectorTabPanel}),
|
||||
}));
|
||||
}
|
||||
} catch(e) {
|
||||
|
|
|
@ -11,47 +11,9 @@
|
|||
--eyedropper-image: url(images/firebug/command-eyedropper.svg);
|
||||
}
|
||||
|
||||
/* Make sure to hide scroll bars for the parent window */
|
||||
window {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* The main Inspector panel container. */
|
||||
.inspector-responsive-container {
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
/* The main panel layout. This area consists of a toolbar, markup view
|
||||
and breadcrumbs bar. */
|
||||
.devtools-main-content {
|
||||
/* Subtract 1 pixel from the panel height. It's puzzling why this
|
||||
is needed, but if not presented the entire Inspector panel
|
||||
content jumps 1 pixel up when the Toolbox is opened. */
|
||||
height: calc(100% - 1px);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
/* Inspector Panel Splitter */
|
||||
|
||||
#inspector-splitter-box {
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Minimum width for the Inspector main (uncontrolled) area. */
|
||||
#inspector-splitter-box .uncontrolled {
|
||||
min-width: 275px;
|
||||
}
|
||||
|
||||
#inspector-splitter-box .controlled.pane-collapsed {
|
||||
visibility: collapse;
|
||||
}
|
||||
|
||||
/* Use flex layout for the Inspector toolbar. For now, it's done
|
||||
specifically for the Inspector toolbar since general rule applied
|
||||
on .devtools-toolbar breaks breadcrumbs and also toolbars in other
|
||||
on .devtools-toolbar breaks breadcrubs and also toolbars in other
|
||||
panels (e.g. webconsole, debugger), these are not ready for HTML
|
||||
layout yet. */
|
||||
#inspector-toolbar.devtools-toolbar {
|
||||
|
@ -162,9 +124,8 @@ window {
|
|||
is fixed and the all-tabs-menu is available again. */
|
||||
#inspector-sidebar-container {
|
||||
overflow: hidden;
|
||||
min-width: 50px;
|
||||
min-width: 300px;
|
||||
position: relative;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#inspector-sidebar {
|
||||
|
@ -188,16 +149,3 @@ window {
|
|||
text-align: center;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
/* Markup Box */
|
||||
|
||||
#markup-box {
|
||||
width: 100%;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
#markup-box > iframe {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
|
|
@ -1173,7 +1173,6 @@ RasterImage::Decode(const IntSize& aSize,
|
|||
|
||||
// Make sure DecoderFactory was able to create a decoder successfully.
|
||||
if (!task) {
|
||||
DoError();
|
||||
return NS_ERROR_FAILURE;
|
||||
}
|
||||
|
||||
|
@ -1228,7 +1227,6 @@ RasterImage::RecoverFromInvalidFrames(const IntSize& aSize, uint32_t aFlags)
|
|||
// Animated images require some special handling, because we normally require
|
||||
// that they never be discarded.
|
||||
if (mAnimationState) {
|
||||
mAnimationState->SetDoneDecoding(false);
|
||||
Decode(mSize, aFlags | FLAG_SYNC_DECODE, PlaybackType::eAnimated);
|
||||
ResetAnimation();
|
||||
return;
|
||||
|
|
|
@ -1162,4 +1162,4 @@ static const TransportSecurityPreload kPublicKeyPinningPreloadList[] = {
|
|||
|
||||
static const int32_t kUnknownId = -1;
|
||||
|
||||
static const PRTime kPreloadPKPinsExpirationTime = INT64_C(1481978895828000);
|
||||
static const PRTime kPreloadPKPinsExpirationTime = INT64_C(1482583977213000);
|
||||
|
|
Разница между файлами не показана из-за своего большого размера
Загрузить разницу
Разница между файлами не показана из-за своего большого размера
Загрузить разницу
Загрузка…
Ссылка в новой задаче