This commit is contained in:
Phil Ringnalda 2016-09-17 12:03:25 -07:00
Родитель 1261f3fd1c d38f4f80e6
Коммит 7405ef6df8
37 изменённых файлов: 11441 добавлений и 12035 удалений

Просмотреть файл

@ -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);

Разница между файлами не показана из-за своего большого размера Загрузить разницу

Разница между файлами не показана из-за своего большого размера Загрузить разницу