mirror of
https://gitlab.winehq.org/wine/wine-gecko.git
synced 2024-09-13 09:24:08 -07:00
merge m-c to fx-team; a=desktop-only
This commit is contained in:
commit
4c5e879f2d
@ -269,7 +269,7 @@
|
||||
modifiers="accel,shift"
|
||||
#endif
|
||||
/>
|
||||
<key id="key_inspect" key="&inspectMenu.commandkey;" command="Tools:Inspect"
|
||||
<key id="key_inspect" key="&inspectMenu.commandkey;" command="Inspector:Inspect"
|
||||
#ifdef XP_MACOSX
|
||||
modifiers="accel,alt"
|
||||
#else
|
||||
|
@ -1011,9 +1011,9 @@
|
||||
command="Inspector:Inspect"/>
|
||||
<toolbarbutton id="inspector-treepanel-toolbutton"
|
||||
class="devtools-toolbarbutton"
|
||||
label="&htmlPanel.label;"
|
||||
accesskey="&htmlPanel.accesskey;"
|
||||
tooltiptext="&htmlPanel.tooltiptext;"
|
||||
tabindex="0"
|
||||
aria-label="&markupButton.arialabel;"
|
||||
accesskey="&markupButton.accesskey;"
|
||||
command="Inspector:HTMLPanel"/>
|
||||
<arrowscrollbox id="inspector-breadcrumbs"
|
||||
flex="1" orient="horizontal"
|
||||
@ -1024,11 +1024,13 @@
|
||||
hidden="true"
|
||||
label="&inspect3DViewButton.label;"
|
||||
accesskey="&inspect3DViewButton.accesskey;"
|
||||
tabindex="0"
|
||||
command="Inspector:Tilt"/>
|
||||
<toolbarbutton id="inspector-style-button"
|
||||
class="devtools-toolbarbutton"
|
||||
label="&inspectStyleButton.label;"
|
||||
accesskey="&inspectStyleButton.accesskey;"
|
||||
tabindex="0"
|
||||
command="Inspector:Sidebar"/>
|
||||
<!-- registered tools go here -->
|
||||
</hbox>
|
||||
|
@ -15,7 +15,7 @@
|
||||
|
||||
<xul:window id="newtab-window" xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
|
||||
xul:disablefastfind="true" xul:title="&newtab.pageTitle;">
|
||||
disablefastfind="true" title="&newtab.pageTitle;">
|
||||
|
||||
<div id="newtab-scrollbox">
|
||||
|
||||
|
@ -45,13 +45,16 @@ VPATH = @srcdir@
|
||||
include $(DEPTH)/config/autoconf.mk
|
||||
|
||||
EXTRA_JS_MODULES = \
|
||||
inspector.jsm \
|
||||
domplate.jsm \
|
||||
InsideOutBox.jsm \
|
||||
TreePanel.jsm \
|
||||
highlighter.jsm \
|
||||
$(NULL)
|
||||
|
||||
EXTRA_PP_JS_MODULES = \
|
||||
inspector.jsm \
|
||||
$(NULL)
|
||||
|
||||
TEST_DIRS += test
|
||||
|
||||
include $(topsrcdir)/config/rules.mk
|
||||
|
@ -26,6 +26,7 @@
|
||||
* Julian Viereck <jviereck@mozilla.com>
|
||||
* Paul Rouget <paul@mozilla.com>
|
||||
* Kyle Simpson <getify@mozilla.com>
|
||||
* Dave Camp <dcamp@mozilla.com>
|
||||
*
|
||||
* Alternatively, the contents of this file may be used under the terms of
|
||||
* either the GNU General Public License Version 2 or later (the "GPL"), or
|
||||
@ -46,6 +47,7 @@ const Cu = Components.utils;
|
||||
Cu.import("resource:///modules/domplate.jsm");
|
||||
Cu.import("resource:///modules/InsideOutBox.jsm");
|
||||
Cu.import("resource://gre/modules/Services.jsm");
|
||||
Cu.import("resource:///modules/inspector.jsm");
|
||||
|
||||
var EXPORTED_SYMBOLS = ["TreePanel", "DOMHelpers"];
|
||||
|
||||
@ -122,8 +124,10 @@ TreePanel.prototype = {
|
||||
delete this.initializingTreePanel;
|
||||
Services.obs.notifyObservers(null,
|
||||
this.IUI.INSPECTOR_NOTIFICATIONS.TREEPANELREADY, null);
|
||||
if (this.IUI.selection)
|
||||
this.select(this.IUI.selection, true);
|
||||
if (this.pendingSelection) {
|
||||
this.select(this.pendingSelection.node, this.pendingSelection.scroll);
|
||||
delete this.pendingSelection;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
@ -219,6 +223,11 @@ TreePanel.prototype = {
|
||||
delete this.treeBrowserDocument;
|
||||
}
|
||||
|
||||
if (this.ioBox) {
|
||||
this.ioBox.destroy();
|
||||
delete this.ioBox;
|
||||
}
|
||||
|
||||
this.treeLoaded = false;
|
||||
},
|
||||
|
||||
@ -572,8 +581,11 @@ TreePanel.prototype = {
|
||||
*/
|
||||
select: function TP_select(aNode, aScroll)
|
||||
{
|
||||
if (this.ioBox)
|
||||
if (this.ioBox) {
|
||||
this.ioBox.select(aNode, true, true, aScroll);
|
||||
} else {
|
||||
this.pendingSelection = { node: aNode, scroll: aScroll };
|
||||
}
|
||||
},
|
||||
|
||||
///////////////////////////////////////////////////////////////////////////
|
||||
@ -691,11 +703,6 @@ TreePanel.prototype = {
|
||||
parent.removeChild(this.treeIFrame);
|
||||
delete this.treeIFrame;
|
||||
}
|
||||
|
||||
if (this.ioBox) {
|
||||
this.ioBox.destroy();
|
||||
delete this.ioBox;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
@ -186,7 +186,6 @@ Highlighter.prototype = {
|
||||
*/
|
||||
destroy: function Highlighter_destroy()
|
||||
{
|
||||
this.detachKeysListeners();
|
||||
this.detachMouseListeners();
|
||||
this.detachPageListeners();
|
||||
|
||||
@ -302,7 +301,6 @@ Highlighter.prototype = {
|
||||
if (!this.hidden) return;
|
||||
this.veilContainer.removeAttribute("hidden");
|
||||
this.nodeInfo.container.removeAttribute("hidden");
|
||||
this.attachKeysListeners();
|
||||
this.attachPageListeners();
|
||||
this.invalidateSize();
|
||||
this.hidden = false;
|
||||
@ -315,7 +313,6 @@ Highlighter.prototype = {
|
||||
if (this.hidden) return;
|
||||
this.veilContainer.setAttribute("hidden", "true");
|
||||
this.nodeInfo.container.setAttribute("hidden", "true");
|
||||
this.detachKeysListeners();
|
||||
this.detachPageListeners();
|
||||
this.hidden = true;
|
||||
},
|
||||
@ -811,18 +808,6 @@ Highlighter.prototype = {
|
||||
this.browser.removeEventListener("MozAfterPaint", this, true);
|
||||
},
|
||||
|
||||
attachKeysListeners: function Highlighter_attachKeysListeners()
|
||||
{
|
||||
this.browser.addEventListener("keypress", this, true);
|
||||
this.highlighterContainer.addEventListener("keypress", this, true);
|
||||
},
|
||||
|
||||
detachKeysListeners: function Highlighter_detachKeysListeners()
|
||||
{
|
||||
this.browser.removeEventListener("keypress", this, true);
|
||||
this.highlighterContainer.removeEventListener("keypress", this, true);
|
||||
},
|
||||
|
||||
/**
|
||||
* Generic event handler.
|
||||
*
|
||||
@ -852,14 +837,6 @@ Highlighter.prototype = {
|
||||
aEvent.stopPropagation();
|
||||
aEvent.preventDefault();
|
||||
break;
|
||||
case "keypress":
|
||||
switch (aEvent.keyCode) {
|
||||
case this.chromeWin.KeyEvent.DOM_VK_RETURN:
|
||||
this.locked ? this.unlock() : this.lock();
|
||||
aEvent.preventDefault();
|
||||
aEvent.stopPropagation();
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
|
File diff suppressed because it is too large
Load Diff
@ -49,12 +49,10 @@ _BROWSER_FILES = \
|
||||
browser_inspector_highlighter.js \
|
||||
browser_inspector_iframeTest.js \
|
||||
browser_inspector_scrolling.js \
|
||||
browser_inspector_store.js \
|
||||
browser_inspector_tab_switch.js \
|
||||
browser_inspector_treePanel_output.js \
|
||||
browser_inspector_treePanel_input.html \
|
||||
browser_inspector_treePanel_result.html \
|
||||
browser_inspector_registertools.js \
|
||||
browser_inspector_bug_665880.js \
|
||||
browser_inspector_bug_674871.js \
|
||||
browser_inspector_editor.js \
|
||||
@ -69,7 +67,6 @@ _BROWSER_FILES = \
|
||||
browser_inspector_bug_699308_iframe_navigation.js \
|
||||
browser_inspector_changes.js \
|
||||
browser_inspector_ruleviewstore.js \
|
||||
browser_inspector_duplicate_ruleview.js \
|
||||
browser_inspector_invalidate.js \
|
||||
browser_inspector_sidebarstate.js \
|
||||
browser_inspector_treePanel_menu.js \
|
||||
|
@ -104,7 +104,8 @@ function test()
|
||||
is(InspectorUI.selection, node, "selected body element");
|
||||
|
||||
// Test that locking works.
|
||||
EventUtils.synthesizeKey("VK_RETURN", { });
|
||||
synthesizeKeyFromKeyTag("key_inspect");
|
||||
|
||||
executeSoon(isTheNodeLocked);
|
||||
}
|
||||
|
||||
|
@ -50,7 +50,7 @@ function createDocument()
|
||||
|
||||
function getInspectorProp(aName)
|
||||
{
|
||||
for each (let view in InspectorUI.stylePanel.cssHtmlTree.propertyViews) {
|
||||
for each (let view in computedViewTree().propertyViews) {
|
||||
if (view.name == aName) {
|
||||
return view;
|
||||
}
|
||||
@ -79,18 +79,16 @@ function runInspectorTests()
|
||||
// Start up the style inspector panel...
|
||||
Services.obs.addObserver(stylePanelTests, "StyleInspector-populated", false);
|
||||
|
||||
executeSoon(function() {
|
||||
InspectorUI.showSidebar();
|
||||
document.getElementById(InspectorUI.getToolbarButtonId("styleinspector")).click();
|
||||
});
|
||||
InspectorUI.sidebar.show();
|
||||
InspectorUI.sidebar.activatePanel("computedview");
|
||||
}
|
||||
|
||||
function stylePanelTests()
|
||||
{
|
||||
Services.obs.removeObserver(stylePanelTests, "StyleInspector-populated");
|
||||
|
||||
ok(InspectorUI.isSidebarOpen, "Inspector Sidebar is open");
|
||||
ok(InspectorUI.stylePanel.cssHtmlTree, "Style Panel has a cssHtmlTree");
|
||||
ok(InspectorUI.sidebar.visible, "Inspector Sidebar is open");
|
||||
ok(computedViewTree(), "Style Panel has a cssHtmlTree");
|
||||
|
||||
let propView = getInspectorProp("font-size");
|
||||
is(propView.value, "10px", "Style inspector should be showing the correct font size.");
|
||||
@ -114,11 +112,13 @@ function stylePanelAfterChange()
|
||||
function stylePanelNotActive()
|
||||
{
|
||||
// Tests changes made while the style panel is not active.
|
||||
InspectorUI.ruleButton.click();
|
||||
InspectorUI.sidebar.activatePanel("ruleview");
|
||||
|
||||
executeSoon(function() {
|
||||
testDiv.style.fontSize = "20px";
|
||||
Services.obs.addObserver(stylePanelAfterSwitch, "StyleInspector-populated", false);
|
||||
document.getElementById(InspectorUI.getToolbarButtonId("styleinspector")).click();
|
||||
testDiv.style.fontSize = "20px";
|
||||
InspectorUI.nodeChanged();
|
||||
InspectorUI.sidebar.activatePanel("computedview");
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -1,128 +0,0 @@
|
||||
/* 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/ */
|
||||
|
||||
|
||||
let div;
|
||||
let tab1;
|
||||
let tab2;
|
||||
let tab1window;
|
||||
|
||||
function inspectorTabOpen1()
|
||||
{
|
||||
ok(window.InspectorUI, "InspectorUI variable exists");
|
||||
ok(!InspectorUI.inspecting, "Inspector is not highlighting");
|
||||
ok(InspectorUI.store.isEmpty(), "Inspector.store is empty");
|
||||
|
||||
Services.obs.addObserver(inspectorUIOpen1,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.OPENED, false);
|
||||
InspectorUI.openInspectorUI();
|
||||
}
|
||||
|
||||
function inspectorUIOpen1()
|
||||
{
|
||||
Services.obs.removeObserver(inspectorUIOpen1,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.OPENED, false);
|
||||
|
||||
// Make sure the inspector is open.
|
||||
ok(InspectorUI.inspecting, "Inspector is highlighting");
|
||||
ok(!InspectorUI.treePanel.isOpen(), "Inspector Tree Panel is not open");
|
||||
ok(!InspectorUI.isSidebarOpen, "Inspector Sidebar is not open");
|
||||
ok(!InspectorUI.store.isEmpty(), "InspectorUI.store is not empty");
|
||||
is(InspectorUI.store.length, 1, "Inspector.store.length = 1");
|
||||
|
||||
// Highlight a node.
|
||||
div = content.document.getElementsByTagName("div")[0];
|
||||
InspectorUI.inspectNode(div);
|
||||
is(InspectorUI.selection, div, "selection matches the div element");
|
||||
|
||||
Services.obs.addObserver(inspectorRuleViewOpened,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.RULEVIEWREADY, false);
|
||||
|
||||
InspectorUI.showSidebar();
|
||||
InspectorUI.openRuleView();
|
||||
}
|
||||
|
||||
function inspectorRuleViewOpened() {
|
||||
Services.obs.removeObserver(inspectorRuleViewOpened,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.RULEVIEWREADY);
|
||||
|
||||
// Open the second tab.
|
||||
tab2 = gBrowser.addTab();
|
||||
gBrowser.selectedTab = tab2;
|
||||
|
||||
gBrowser.selectedBrowser.addEventListener("load", function(evt) {
|
||||
gBrowser.selectedBrowser.removeEventListener(evt.type, arguments.callee,
|
||||
true);
|
||||
waitForFocus(inspectorTabOpen2, content);
|
||||
}, true);
|
||||
|
||||
content.location = "data:text/html,<p>tab 2: the inspector should close now";
|
||||
}
|
||||
|
||||
function inspectorTabOpen2()
|
||||
{
|
||||
// Make sure the inspector is closed.
|
||||
ok(!InspectorUI.inspecting, "Inspector is not highlighting");
|
||||
ok(!InspectorUI.treePanel, "Inspector Tree Panel is closed");
|
||||
ok(!InspectorUI.isSidebarOpen, "Inspector Sidebar is not open");
|
||||
is(InspectorUI.store.length, 1, "Inspector.store.length = 1");
|
||||
|
||||
Services.obs.addObserver(inspectorFocusTab1,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.RULEVIEWREADY, false);
|
||||
// Switch back to tab 1.
|
||||
executeSoon(function() {
|
||||
gBrowser.selectedTab = tab1;
|
||||
});
|
||||
}
|
||||
|
||||
function inspectorFocusTab1()
|
||||
{
|
||||
Services.obs.removeObserver(inspectorFocusTab1,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.RULEVIEWREADY, false);
|
||||
Services.obs.addObserver(inspectorRuleTrap,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.RULEVIEWREADY, false);
|
||||
|
||||
// Make sure the inspector is open.
|
||||
ok(InspectorUI.inspecting, "Inspector is highlighting");
|
||||
ok(!InspectorUI.treePanel.isOpen(), "Inspector Tree Panel is not open");
|
||||
is(InspectorUI.store.length, 1, "Inspector.store.length = 1");
|
||||
is(InspectorUI.selection, div, "selection matches the div element");
|
||||
ok(InspectorUI.isSidebarOpen, "sidebar is open");
|
||||
ok(InspectorUI.isRuleViewOpen(), "rule view is open");
|
||||
|
||||
// The rule view element plus its popupSet
|
||||
is(InspectorUI.ruleView.doc.documentElement.children.length, 2, "RuleView elements.length == 2");
|
||||
|
||||
requestLongerTimeout(4);
|
||||
executeSoon(function() {
|
||||
InspectorUI.closeInspectorUI();
|
||||
gBrowser.removeCurrentTab(); // tab 1
|
||||
gBrowser.removeCurrentTab(); // tab 2
|
||||
finish();
|
||||
});
|
||||
}
|
||||
|
||||
function inspectorRuleTrap()
|
||||
{
|
||||
Services.obs.removeObserver(inspectorRuleTrap,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.RULEVIEWREADY, false);
|
||||
is(InspectorUI.ruleView.doc.documentElement.children.length, 1, "RuleView elements.length == 1");
|
||||
}
|
||||
|
||||
function test()
|
||||
{
|
||||
waitForExplicitFinish();
|
||||
|
||||
tab1 = gBrowser.addTab();
|
||||
gBrowser.selectedTab = tab1;
|
||||
gBrowser.selectedBrowser.addEventListener("load", function(evt) {
|
||||
gBrowser.selectedBrowser.removeEventListener(evt.type, arguments.callee,
|
||||
true);
|
||||
waitForFocus(inspectorTabOpen1, content);
|
||||
}, true);
|
||||
|
||||
content.location = "data:text/html,<p>tab switching tests for inspector" +
|
||||
"<div>tab 1</div>";
|
||||
}
|
||||
|
@ -77,8 +77,8 @@ function doEditorTestSteps()
|
||||
EventUtils.synthesizeMouse(attrValNode_id, 2, 2, {clickCount: 2}, attrValNode_id.ownerDocument.defaultView);
|
||||
});
|
||||
|
||||
yield; // End of Step 1
|
||||
|
||||
yield; // End of Step 1
|
||||
|
||||
// Step 2: validate editing session, enter new attribute value into editor, and save input
|
||||
ok(InspectorUI.treePanel.editingContext, "Step 2: editor session started");
|
||||
|
@ -89,25 +89,21 @@ function treePanelTests()
|
||||
{
|
||||
Services.obs.removeObserver(treePanelTests,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.TREEPANELREADY);
|
||||
Services.obs.addObserver(stylePanelTests,
|
||||
"StyleInspector-opened", false);
|
||||
|
||||
ok(InspectorUI.treePanel.isOpen(), "Inspector Tree Panel is open");
|
||||
|
||||
executeSoon(function() {
|
||||
InspectorUI.showSidebar();
|
||||
document.getElementById(InspectorUI.getToolbarButtonId("styleinspector")).click();
|
||||
});
|
||||
InspectorUI.sidebar.show();
|
||||
InspectorUI.currentInspector.once("sidebaractivated-computedview",
|
||||
stylePanelTests)
|
||||
InspectorUI.sidebar.activatePanel("computedview");
|
||||
}
|
||||
|
||||
function stylePanelTests()
|
||||
{
|
||||
Services.obs.removeObserver(stylePanelTests, "StyleInspector-opened");
|
||||
ok(InspectorUI.sidebar.visible, "Inspector Sidebar is open");
|
||||
is(InspectorUI.sidebar.activePanel, "computedview", "Computed View is open");
|
||||
ok(computedViewTree(), "Computed view has a cssHtmlTree");
|
||||
|
||||
ok(InspectorUI.isSidebarOpen, "Inspector Sidebar is open");
|
||||
ok(InspectorUI.stylePanel.cssHtmlTree, "Style Panel has a cssHtmlTree");
|
||||
|
||||
InspectorUI.ruleButton.click();
|
||||
InspectorUI.sidebar.activatePanel("ruleview");
|
||||
executeSoon(function() {
|
||||
ruleViewTests();
|
||||
});
|
||||
@ -118,8 +114,8 @@ function ruleViewTests()
|
||||
Services.obs.addObserver(runContextMenuTest,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.CLOSED, false);
|
||||
|
||||
ok(InspectorUI.isRuleViewOpen(), "Rule View is open");
|
||||
ok(InspectorUI.ruleView, "InspectorUI has a cssRuleView");
|
||||
is(InspectorUI.sidebar.activePanel, "ruleview", "Rule View is open");
|
||||
ok(ruleView(), "InspectorUI has a cssRuleView");
|
||||
|
||||
executeSoon(function() {
|
||||
InspectorUI.closeInspectorUI();
|
||||
@ -152,8 +148,6 @@ function inspectNodesFromContextTest()
|
||||
Services.obs.addObserver(openInspectorForContextTest, InspectorUI.INSPECTOR_NOTIFICATIONS.CLOSED, false);
|
||||
ok(!InspectorUI.inspecting, "Inspector is not actively highlighting");
|
||||
is(InspectorUI.selection, salutation, "Inspector is highlighting salutation");
|
||||
ok(!InspectorUI.treePanel.isOpen(), "Inspector Tree Panel is closed");
|
||||
ok(!InspectorUI.stylePanel.isOpen(), "Inspector Style Panel is closed");
|
||||
executeSoon(function() {
|
||||
InspectorUI.closeInspectorUI(true);
|
||||
});
|
||||
@ -207,11 +201,7 @@ function finishInspectorTests(subject, topic, aWinIdString)
|
||||
ok(!InspectorUI.highlighter, "Highlighter is gone");
|
||||
ok(!InspectorUI.treePanel, "Inspector Tree Panel is closed");
|
||||
ok(!InspectorUI.inspecting, "Inspector is not inspecting");
|
||||
ok(!InspectorUI.isSidebarOpen, "Inspector Sidebar is closed");
|
||||
ok(!InspectorUI.stylePanel, "Inspector Style Panel is gone");
|
||||
ok(!InspectorUI.ruleView, "Inspector Rule View is gone");
|
||||
is(InspectorUI.sidebarToolbar.children.length, 0, "No items in the Sidebar toolbar");
|
||||
is(InspectorUI.sidebarDeck.children.length, 0, "No items in the Sidebar deck");
|
||||
ok(!InspectorUI._sidebar, "Inspector Sidebar is closed");
|
||||
ok(!InspectorUI.toolbar, "toolbar is hidden");
|
||||
|
||||
Services.obs.removeObserver(inspectNodesFromContextTestTrap, InspectorUI.INSPECTOR_NOTIFICATIONS.OPENED);
|
||||
|
@ -40,8 +40,7 @@ function test()
|
||||
function lockNode()
|
||||
{
|
||||
InspectorUI.highlighter.removeListener("nodeselected", lockNode);
|
||||
EventUtils.synthesizeKey("VK_RETURN", { });
|
||||
|
||||
synthesizeKeyFromKeyTag("key_inspect");
|
||||
executeSoon(isTheNodeLocked);
|
||||
}
|
||||
|
||||
@ -53,8 +52,7 @@ function test()
|
||||
}
|
||||
|
||||
function unlockNode() {
|
||||
EventUtils.synthesizeKey("VK_RETURN", { });
|
||||
|
||||
synthesizeKeyFromKeyTag("key_inspect");
|
||||
executeSoon(isTheNodeUnlocked);
|
||||
}
|
||||
|
||||
|
@ -23,7 +23,7 @@ function test()
|
||||
}
|
||||
|
||||
function createDocument()
|
||||
{
|
||||
{
|
||||
div = doc.createElement("div");
|
||||
div.textContent = "test div";
|
||||
|
||||
@ -34,7 +34,7 @@ function createDocument()
|
||||
style.appendChild(rules);
|
||||
head.appendChild(style);
|
||||
doc.body.appendChild(div);
|
||||
|
||||
|
||||
setupTests();
|
||||
}
|
||||
|
||||
@ -51,26 +51,22 @@ function selectNode()
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.OPENED);
|
||||
|
||||
executeSoon(function() {
|
||||
InspectorUI.highlighter.addListener("nodeselected", openRuleView);
|
||||
InspectorUI.highlighter.addListener("locked", openRuleView);
|
||||
InspectorUI.inspectNode(div);
|
||||
InspectorUI.stopInspecting();
|
||||
});
|
||||
}
|
||||
|
||||
function openRuleView()
|
||||
{
|
||||
Services.obs.addObserver(performTests,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.RULEVIEWREADY, false);
|
||||
|
||||
InspectorUI.showSidebar();
|
||||
InspectorUI.openRuleView();
|
||||
InspectorUI.sidebar.show();
|
||||
InspectorUI.currentInspector.once("sidebaractivated-ruleview", performTests);
|
||||
InspectorUI.sidebar.activatePanel("ruleview");
|
||||
}
|
||||
|
||||
function performTests()
|
||||
{
|
||||
Services.obs.removeObserver(performTests,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.RULEVIEWREADY);
|
||||
|
||||
InspectorUI.highlighter.removeListener("nodeselected", performTests);
|
||||
InspectorUI.highlighter.removeListener("locked", performTests);
|
||||
|
||||
// toggle the class
|
||||
InspectorUI.highlighter.pseudoClassLockToggled(pseudo);
|
||||
@ -107,10 +103,10 @@ function testAdded()
|
||||
is(pseudoClassesBox.textContent, pseudo, "pseudo-class in infobar selector");
|
||||
|
||||
// ruleview contains pseudo-class rule
|
||||
is(InspectorUI.ruleView.element.children.length, 3,
|
||||
is(ruleView().element.children.length, 3,
|
||||
"rule view is showing 3 rules for pseudo-class locked div");
|
||||
|
||||
is(InspectorUI.ruleView.element.children[1]._ruleEditor.rule.selectorText,
|
||||
is(ruleView().element.children[1]._ruleEditor.rule.selectorText,
|
||||
"div:hover", "rule view is showing " + pseudo + " rule");
|
||||
}
|
||||
|
||||
@ -132,7 +128,7 @@ function testRemovedFromUI()
|
||||
is(pseudoClassesBox.textContent, "", "pseudo-class removed from infobar selector");
|
||||
|
||||
// ruleview no longer contains pseudo-class rule
|
||||
is(InspectorUI.ruleView.element.children.length, 2,
|
||||
is(ruleView().element.children.length, 2,
|
||||
"rule view is showing 2 rules after removing lock");
|
||||
}
|
||||
|
||||
|
@ -1,254 +0,0 @@
|
||||
/* -*- Mode: C++; tab-width: 8; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
|
||||
/* vim: set ts=2 et sw=2 tw=80: */
|
||||
/* ***** BEGIN LICENSE BLOCK *****
|
||||
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
|
||||
*
|
||||
* The contents of this file are subject to the Mozilla Public License Version
|
||||
* 1.1 (the "License"); you may not use this file except in compliance with
|
||||
* the License. You may obtain a copy of the License at
|
||||
* http://www.mozilla.org/MPL/
|
||||
*
|
||||
* Software distributed under the License is distributed on an "AS IS" basis,
|
||||
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
|
||||
* for the specific language governing rights and limitations under the
|
||||
* License.
|
||||
*
|
||||
* The Original Code is Inspector Highlighter Tests.
|
||||
*
|
||||
* The Initial Developer of the Original Code is
|
||||
* The Mozilla Foundation.
|
||||
* Portions created by the Initial Developer are Copyright (C) 2011
|
||||
* the Initial Developer. All Rights Reserved.
|
||||
*
|
||||
* Contributor(s):
|
||||
* Michael Ratcliffe <mratcliffe@mozilla.com>
|
||||
*
|
||||
* Alternatively, the contents of this file may be used under the terms of
|
||||
* either the GNU General Public License Version 2 or later (the "GPL"), or
|
||||
* the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
|
||||
* in which case the provisions of the GPL or the LGPL are applicable instead
|
||||
* of those above. If you wish to allow use of your version of this file only
|
||||
* under the terms of either the GPL or the LGPL, and not to allow others to
|
||||
* use your version of this file under the terms of the MPL, indicate your
|
||||
* decision by deleting the provisions above and replace them with the notice
|
||||
* and other provisions required by the GPL or the LGPL. If you do not delete
|
||||
* the provisions above, a recipient may use your version of this file under
|
||||
* the terms of any one of the MPL, the GPL or the LGPL.
|
||||
*
|
||||
* ***** END LICENSE BLOCK ***** */
|
||||
|
||||
let doc;
|
||||
let h1;
|
||||
let p2;
|
||||
let toolsLength = 0;
|
||||
let toolEvents = 0;
|
||||
let tool1;
|
||||
let tool2;
|
||||
let tool3;
|
||||
let initToolsMethod = InspectorUI.initTools;
|
||||
|
||||
function createDocument()
|
||||
{
|
||||
let div = doc.createElement("div");
|
||||
h1 = doc.createElement("h1");
|
||||
let p1 = doc.createElement("p");
|
||||
p2 = doc.createElement("p");
|
||||
let div2 = doc.createElement("div");
|
||||
let p3 = doc.createElement("p");
|
||||
doc.title = "Inspector Tree Selection Test";
|
||||
h1.textContent = "Inspector Tree Selection Test";
|
||||
p1.textContent = "This is some example text";
|
||||
p2.textContent = "Lorem ipsum dolor sit amet, consectetur adipisicing " +
|
||||
"elit, sed do eiusmod tempor incididunt ut labore et dolore magna " +
|
||||
"aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco " +
|
||||
"laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure " +
|
||||
"dolor in reprehenderit in voluptate velit esse cillum dolore eu " +
|
||||
"fugiat nulla pariatur. Excepteur sint occaecat cupidatat non " +
|
||||
"proident, sunt in culpa qui officia deserunt mollit anim id est laborum.";
|
||||
p3.textContent = "Lorem ipsum dolor sit amet, consectetur adipisicing " +
|
||||
"elit, sed do eiusmod tempor incididunt ut labore et dolore magna " +
|
||||
"aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco " +
|
||||
"laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure " +
|
||||
"dolor in reprehenderit in voluptate velit esse cillum dolore eu " +
|
||||
"fugiat nulla pariatur. Excepteur sint occaecat cupidatat non " +
|
||||
"proident, sunt in culpa qui officia deserunt mollit anim id est laborum.";
|
||||
div.appendChild(h1);
|
||||
div.appendChild(p1);
|
||||
div.appendChild(p2);
|
||||
div2.appendChild(p3);
|
||||
doc.body.appendChild(div);
|
||||
doc.body.appendChild(div2);
|
||||
setupHighlighterTests();
|
||||
}
|
||||
|
||||
function setupHighlighterTests()
|
||||
{
|
||||
ok(h1, "we have the header node");
|
||||
Services.obs.addObserver(inspectorOpen, InspectorUI.INSPECTOR_NOTIFICATIONS.OPENED, false);
|
||||
registerTools();
|
||||
InspectorUI.toggleInspectorUI();
|
||||
}
|
||||
|
||||
function inspectorOpen()
|
||||
{
|
||||
info("we received the inspector-opened notification");
|
||||
Services.obs.removeObserver(inspectorOpen, InspectorUI.INSPECTOR_NOTIFICATIONS.OPENED);
|
||||
toolsLength = InspectorUI.tools.length;
|
||||
toolEvents = InspectorUI.toolEvents.length;
|
||||
info("tools registered");
|
||||
InspectorUI.highlighter.addListener("nodeselected", startToolTests);
|
||||
InspectorUI.inspectNode(h1);
|
||||
}
|
||||
|
||||
function startToolTests(evt)
|
||||
{
|
||||
InspectorUI.highlighter.removeListener("nodeselected", startToolTests);
|
||||
InspectorUI.stopInspecting();
|
||||
info("Getting InspectorUI.tools");
|
||||
let tools = InspectorUI.tools;
|
||||
|
||||
tool1 = InspectorUI.tools["tool_1"];
|
||||
tool2 = InspectorUI.tools["tool_2"];
|
||||
tool3 = InspectorUI.tools["tool_3"];
|
||||
|
||||
info("Checking panel states 1");
|
||||
ok(!tool1.isOpen, "Panel 1 is closed");
|
||||
ok(!tool2.isOpen, "Panel 2 is closed");
|
||||
ok(!tool3.isOpen, "Panel 3 is closed");
|
||||
|
||||
info("Calling show method for all tools");
|
||||
InspectorUI.toolShow(tool1);
|
||||
InspectorUI.toolShow(tool2);
|
||||
InspectorUI.toolShow(tool3);
|
||||
|
||||
info("Checking panel states 2");
|
||||
ok(tool1.isOpen, "Panel 1 is open");
|
||||
ok(tool2.isOpen, "Panel 2 is open");
|
||||
ok(tool3.isOpen, "Panel 3 is open");
|
||||
|
||||
info("Calling selectNode method for all tools, should see 3 selects");
|
||||
InspectorUI.inspectNode(p2);
|
||||
|
||||
info("Calling hide method for all tools");
|
||||
InspectorUI.toolHide(tool1);
|
||||
InspectorUI.toolHide(tool2);
|
||||
InspectorUI.toolHide(tool3);
|
||||
|
||||
info("Checking panel states 3");
|
||||
ok(!tool1.isOpen, "Panel 1 is closed");
|
||||
ok(!tool2.isOpen, "Panel 2 is closed");
|
||||
ok(!tool3.isOpen, "Panel 3 is closed");
|
||||
|
||||
info("Showing tools 1 & 3");
|
||||
InspectorUI.toolShow(tool1);
|
||||
InspectorUI.toolShow(tool3);
|
||||
|
||||
info("Checking panel states 4");
|
||||
ok(tool1.isOpen, "Panel 1 is open");
|
||||
ok(!tool2.isOpen, "Panel 2 is closed");
|
||||
ok(tool3.isOpen, "Panel 3 is open");
|
||||
|
||||
Services.obs.addObserver(unregisterTools, InspectorUI.INSPECTOR_NOTIFICATIONS.CLOSED, false);
|
||||
InspectorUI.closeInspectorUI(true);
|
||||
}
|
||||
|
||||
function unregisterTools()
|
||||
{
|
||||
Services.obs.removeObserver(unregisterTools, InspectorUI.INSPECTOR_NOTIFICATIONS.CLOSED);
|
||||
let tools = InspectorUI.tools;
|
||||
|
||||
ok(!(tool1 in tools), "Tool 1 removed");
|
||||
ok(!(tool2 in tools), "Tool 2 removed");
|
||||
ok(!(tool3 in tools), "Tool 3 removed");
|
||||
is(tools.length, toolsLength, "Number of Registered Tools matches original");
|
||||
is(InspectorUI.toolEvents.length, toolEvents, "Number of tool events matches original");
|
||||
finishUp();
|
||||
}
|
||||
|
||||
function finishUp() {
|
||||
gBrowser.removeCurrentTab();
|
||||
InspectorUI.initTools = initToolsMethod;
|
||||
finish();
|
||||
}
|
||||
|
||||
function test()
|
||||
{
|
||||
waitForExplicitFinish();
|
||||
ignoreAllUncaughtExceptions();
|
||||
gBrowser.selectedTab = gBrowser.addTab();
|
||||
gBrowser.selectedBrowser.addEventListener("load", function() {
|
||||
gBrowser.selectedBrowser.removeEventListener("load", arguments.callee, true);
|
||||
doc = content.document;
|
||||
waitForFocus(createDocument, content);
|
||||
}, true);
|
||||
|
||||
content.location = "data:text/html,registertool tests for inspector";
|
||||
}
|
||||
|
||||
function registerTools()
|
||||
{
|
||||
InspectorUI.initTools = function() {
|
||||
info("(re)registering tools");
|
||||
registerTool(new testTool("tool_1", "Tool 1", "Tool 1 tooltip", "I"));
|
||||
registerTool(new testTool("tool_2", "Tool 2", "Tool 2 tooltip", "J"));
|
||||
registerTool(new testTool("tool_3", "Tool 3", "Tool 3 tooltip", "K"));
|
||||
}
|
||||
}
|
||||
|
||||
function registerTool(aTool)
|
||||
{
|
||||
InspectorUI.registerTool({
|
||||
id: aTool.id,
|
||||
label: aTool.label,
|
||||
tooltiptext: aTool.tooltip,
|
||||
accesskey: aTool.accesskey,
|
||||
context: aTool,
|
||||
get isOpen() aTool.isOpen(),
|
||||
onSelect: aTool.selectNode,
|
||||
show: aTool.show,
|
||||
hide: aTool.hide,
|
||||
unregister: aTool.destroy,
|
||||
});
|
||||
}
|
||||
|
||||
// Tool Object
|
||||
function testTool(aToolId, aLabel, aTooltip, aAccesskey)
|
||||
{
|
||||
this.id = aToolId;
|
||||
this.label = aLabel;
|
||||
this.tooltip = aTooltip;
|
||||
this.accesskey = aAccesskey;
|
||||
this._isOpen = false;
|
||||
}
|
||||
|
||||
testTool.prototype = {
|
||||
isOpen: function BIR_isOpen() {
|
||||
return this._isOpen;
|
||||
},
|
||||
|
||||
selectNode: function BIR_selectNode(aNode) {
|
||||
is(InspectorUI.selection, aNode,
|
||||
"selectNode: currently selected node was passed: " + this.id);
|
||||
},
|
||||
|
||||
show: function BIR_show(aNode) {
|
||||
this._isOpen = true;
|
||||
is(InspectorUI.selection, aNode,
|
||||
"show: currently selected node was passed: " + this.id);
|
||||
},
|
||||
|
||||
hide: function BIR_hide() {
|
||||
info(this.id + " hide");
|
||||
this._isOpen = false;
|
||||
},
|
||||
|
||||
destroy: function BIR_destroy() {
|
||||
info("tool destroyed " + this.id);
|
||||
if (this.isOpen())
|
||||
this.hide();
|
||||
delete this.id;
|
||||
delete this.label;
|
||||
delete this.tooltip;
|
||||
delete this.accesskey;
|
||||
},
|
||||
};
|
@ -48,18 +48,7 @@ let tab1;
|
||||
|
||||
function waitForRuleView(aCallback)
|
||||
{
|
||||
if (InspectorUI.ruleView) {
|
||||
aCallback();
|
||||
return;
|
||||
}
|
||||
|
||||
let ruleViewFrame = InspectorUI.getToolIframe(InspectorUI.ruleViewObject);
|
||||
ruleViewFrame.addEventListener("load", function(evt) {
|
||||
ruleViewFrame.removeEventListener(evt.type, arguments.callee, true);
|
||||
executeSoon(function() {
|
||||
aCallback();
|
||||
});
|
||||
}, true);
|
||||
InspectorUI.currentInspector.once("sidebaractivated-ruleview", aCallback);
|
||||
}
|
||||
|
||||
function inspectorTabOpen1()
|
||||
@ -77,17 +66,17 @@ function inspectorUIOpen1()
|
||||
// Highlight a node.
|
||||
div = content.document.getElementsByTagName("div")[0];
|
||||
InspectorUI.inspectNode(div);
|
||||
InspectorUI.stopInspecting();
|
||||
|
||||
// Open the rule view sidebar.
|
||||
waitForRuleView(ruleViewOpened1);
|
||||
|
||||
InspectorUI.showSidebar();
|
||||
InspectorUI.ruleButton.click();
|
||||
InspectorUI.sidebar.show();
|
||||
InspectorUI.sidebar.activatePanel("ruleview");
|
||||
}
|
||||
|
||||
function ruleViewOpened1()
|
||||
{
|
||||
let prop = InspectorUI.ruleView._elementStyle.rules[0].textProps[0];
|
||||
let prop = ruleView()._elementStyle.rules[0].textProps[0];
|
||||
is(prop.name, "background-color", "First prop is the background color prop.");
|
||||
prop.setEnabled(false);
|
||||
|
||||
@ -124,7 +113,7 @@ function inspectorFocusTab1()
|
||||
|
||||
function ruleViewOpened2()
|
||||
{
|
||||
let prop = InspectorUI.ruleView._elementStyle.rules[0].textProps[0];
|
||||
let prop = ruleView()._elementStyle.rules[0].textProps[0];
|
||||
is(prop.name, "background-color", "First prop is the background color prop.");
|
||||
ok(!prop.enabled, "First prop should be disabled.");
|
||||
|
||||
|
@ -8,22 +8,21 @@ function createDocument()
|
||||
doc.body.innerHTML = '<h1>Sidebar state test</h1>';
|
||||
doc.title = "Sidebar State Test";
|
||||
|
||||
// Open the sidebar and wait for the default view (the rule view) to show.
|
||||
Services.obs.addObserver(inspectorRuleViewOpened,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.RULEVIEWREADY, false);
|
||||
|
||||
InspectorUI.openInspectorUI();
|
||||
InspectorUI.showSidebar();
|
||||
|
||||
// Open the sidebar and wait for the default view (the rule view) to show.
|
||||
InspectorUI.currentInspector.once("sidebaractivated-ruleview", inspectorRuleViewOpened);
|
||||
|
||||
InspectorUI.sidebar.show();
|
||||
InspectorUI.sidebar.activatePanel("ruleview");
|
||||
}
|
||||
|
||||
function inspectorRuleViewOpened()
|
||||
{
|
||||
Services.obs.removeObserver(inspectorRuleViewOpened,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.RULEVIEWREADY);
|
||||
is(InspectorUI.activeSidebarPanel, "ruleview", "Rule View is selected by default");
|
||||
is(InspectorUI.sidebar.activePanel, "ruleview", "Rule View is selected by default");
|
||||
|
||||
// Select the computed view and turn off the inspector.
|
||||
InspectorUI.activateSidebarPanel("styleinspector");
|
||||
InspectorUI.sidebar.activatePanel("computedview");
|
||||
|
||||
Services.obs.addObserver(inspectorClosed,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.CLOSED, false);
|
||||
@ -46,7 +45,7 @@ function computedViewPopulated()
|
||||
{
|
||||
Services.obs.removeObserver(computedViewPopulated,
|
||||
"StyleInspector-populated");
|
||||
is(InspectorUI.activeSidebarPanel, "styleinspector", "Computed view is selected by default.");
|
||||
is(InspectorUI.sidebar.activePanel, "computedview", "Computed view is selected by default.");
|
||||
|
||||
finishTest();
|
||||
}
|
||||
|
@ -1,106 +0,0 @@
|
||||
/* -*- Mode: C++; tab-width: 8; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
|
||||
/* vim: set ts=2 et sw=2 tw=80: */
|
||||
/* ***** BEGIN LICENSE BLOCK *****
|
||||
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
|
||||
*
|
||||
* The contents of this file are subject to the Mozilla Public License Version
|
||||
* 1.1 (the "License"); you may not use this file except in compliance with
|
||||
* the License. You may obtain a copy of the License at
|
||||
* http://www.mozilla.org/MPL/
|
||||
*
|
||||
* Software distributed under the License is distributed on an "AS IS" basis,
|
||||
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
|
||||
* for the specific language governing rights and limitations under the
|
||||
* License.
|
||||
*
|
||||
* The Original Code is Inspector Store Tests.
|
||||
*
|
||||
* The Initial Developer of the Original Code is
|
||||
* The Mozilla Foundation.
|
||||
* Portions created by the Initial Developer are Copyright (C) 2010
|
||||
* the Initial Developer. All Rights Reserved.
|
||||
*
|
||||
* Contributor(s):
|
||||
* Mihai Șucan <mihai.sucan@gmail.com>
|
||||
*
|
||||
* Alternatively, the contents of this file may be used under the terms of
|
||||
* either the GNU General Public License Version 2 or later (the "GPL"), or
|
||||
* the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
|
||||
* in which case the provisions of the GPL or the LGPL are applicable instead
|
||||
* of those above. If you wish to allow use of your version of this file only
|
||||
* under the terms of either the GPL or the LGPL, and not to allow others to
|
||||
* use your version of this file under the terms of the MPL, indicate your
|
||||
* decision by deleting the provisions above and replace them with the notice
|
||||
* and other provisions required by the GPL or the LGPL. If you do not delete
|
||||
* the provisions above, a recipient may use your version of this file under
|
||||
* the terms of any one of the MPL, the GPL or the LGPL.
|
||||
*
|
||||
* ***** END LICENSE BLOCK ***** */
|
||||
|
||||
function test()
|
||||
{
|
||||
let InspectorStore = InspectorUI.store;
|
||||
|
||||
is(InspectorStore.length, 0, "InspectorStore is empty");
|
||||
ok(InspectorStore.isEmpty(), "InspectorStore is empty (confirmed)");
|
||||
is(typeof InspectorStore.store, "object",
|
||||
"InspectorStore.store is an object");
|
||||
|
||||
ok(InspectorStore.addStore("foo"), "addStore('foo') returns true");
|
||||
|
||||
is(InspectorStore.length, 1, "InspectorStore.length = 1");
|
||||
ok(!InspectorStore.isEmpty(), "InspectorStore is not empty");
|
||||
is(typeof InspectorStore.store.foo, "object", "store.foo is an object");
|
||||
|
||||
ok(InspectorStore.addStore("fooBar"), "addStore('fooBar') returns true");
|
||||
|
||||
is(InspectorStore.length, 2, "InspectorStore.length = 2");
|
||||
is(typeof InspectorStore.store.fooBar, "object", "store.fooBar is an object");
|
||||
|
||||
ok(!InspectorStore.addStore("fooBar"), "addStore('fooBar') returns false");
|
||||
|
||||
ok(InspectorStore.deleteStore("fooBar"),
|
||||
"deleteStore('fooBar') returns true");
|
||||
|
||||
is(InspectorStore.length, 1, "InspectorStore.length = 1");
|
||||
ok(!InspectorStore.store.fooBar, "store.fooBar is deleted");
|
||||
|
||||
ok(!InspectorStore.deleteStore("fooBar"),
|
||||
"deleteStore('fooBar') returns false");
|
||||
|
||||
ok(!InspectorStore.hasID("fooBar"), "hasID('fooBar') returns false");
|
||||
|
||||
ok(InspectorStore.hasID("foo"), "hasID('foo') returns true");
|
||||
|
||||
ok(InspectorStore.setValue("foo", "key1", "val1"), "setValue() returns true");
|
||||
|
||||
ok(!InspectorStore.setValue("fooBar", "key1", "val1"),
|
||||
"setValue() returns false");
|
||||
|
||||
is(InspectorStore.getValue("foo", "key1"), "val1",
|
||||
"getValue() returns the correct value");
|
||||
|
||||
is(InspectorStore.store.foo.key1, "val1", "store.foo.key1 = 'val1'");
|
||||
|
||||
ok(!InspectorStore.getValue("fooBar", "key1"),
|
||||
"getValue() returns null for unknown store");
|
||||
|
||||
ok(!InspectorStore.getValue("fooBar", "key1"),
|
||||
"getValue() returns null for unknown store");
|
||||
|
||||
ok(InspectorStore.deleteValue("foo", "key1"),
|
||||
"deleteValue() returns true for known value");
|
||||
|
||||
ok(!InspectorStore.store.foo.key1, "deleteValue() removed the value.");
|
||||
|
||||
ok(!InspectorStore.deleteValue("fooBar", "key1"),
|
||||
"deleteValue() returns false for unknown store.");
|
||||
|
||||
ok(!InspectorStore.deleteValue("foo", "key1"),
|
||||
"deleteValue() returns false for unknown value.");
|
||||
|
||||
ok(InspectorStore.deleteStore("foo"), "deleteStore('foo') returns true");
|
||||
|
||||
ok(InspectorStore.isEmpty(), "InspectorStore is empty");
|
||||
}
|
||||
|
@ -62,7 +62,7 @@ function inspectorUIOpen1()
|
||||
// Make sure the inspector is open.
|
||||
ok(InspectorUI.inspecting, "Inspector is highlighting");
|
||||
ok(!InspectorUI.treePanel.isOpen(), "Inspector Tree Panel is not open");
|
||||
ok(!InspectorUI.isSidebarOpen, "Inspector Sidebar is not open");
|
||||
ok(!InspectorUI.sidebar.visible, "Inspector Sidebar is not open");
|
||||
ok(!InspectorUI.store.isEmpty(), "InspectorUI.store is not empty");
|
||||
is(InspectorUI.store.length, 1, "Inspector.store.length = 1");
|
||||
|
||||
@ -89,7 +89,6 @@ function inspectorTabOpen2()
|
||||
// Make sure the inspector is closed.
|
||||
ok(!InspectorUI.inspecting, "Inspector is not highlighting");
|
||||
ok(!InspectorUI.treePanel, "Inspector Tree Panel is closed");
|
||||
ok(!InspectorUI.isSidebarOpen, "Inspector Sidebar is not open");
|
||||
is(InspectorUI.store.length, 1, "Inspector.store.length = 1");
|
||||
|
||||
// Activate the inspector again.
|
||||
@ -115,6 +114,7 @@ function inspectorUIOpen2()
|
||||
InspectorUI.toggleInspection();
|
||||
ok(!InspectorUI.inspecting, "Inspector is not highlighting");
|
||||
|
||||
|
||||
// Switch back to tab 1.
|
||||
executeSoon(function() {
|
||||
Services.obs.addObserver(inspectorFocusTab1,
|
||||
@ -150,24 +150,25 @@ function inspectorOpenTreePanelTab1()
|
||||
is(InspectorUI.store.length, 2, "Inspector.store.length = 2");
|
||||
is(InspectorUI.selection, div, "selection matches the div element");
|
||||
|
||||
Services.obs.addObserver(inspectorSidebarStyleView1, "StyleInspector-opened", false);
|
||||
InspectorUI.currentInspector.once("sidebaractivated-computedview",
|
||||
inspectorSidebarStyleView1);
|
||||
|
||||
executeSoon(function() {
|
||||
InspectorUI.showSidebar();
|
||||
InspectorUI.activateSidebarPanel("styleinspector");
|
||||
InspectorUI.sidebar.show();
|
||||
InspectorUI.sidebar.activatePanel("computedview");
|
||||
});
|
||||
}
|
||||
|
||||
function inspectorSidebarStyleView1()
|
||||
{
|
||||
Services.obs.removeObserver(inspectorSidebarStyleView1, "StyleInspector-opened");
|
||||
ok(InspectorUI.isSidebarOpen, "Inspector Sidebar is open");
|
||||
ok(InspectorUI.stylePanel, "Inspector Has a Style Panel Instance");
|
||||
InspectorUI.sidebarTools.forEach(function(aTool) {
|
||||
let btn = document.getElementById(InspectorUI.getToolbarButtonId(aTool.id));
|
||||
ok(InspectorUI.sidebar.visible, "Inspector Sidebar is open");
|
||||
ok(computedView(), "Inspector Has a computed view Instance");
|
||||
|
||||
InspectorUI.sidebar._toolObjects().forEach(function (aTool) {
|
||||
let btn = aTool.button;
|
||||
is(btn.hasAttribute("checked"),
|
||||
(aTool == InspectorUI.stylePanel.registrationObject),
|
||||
"Button " + btn.id + " has correct checked attribute");
|
||||
(aTool.id == "computedview"),
|
||||
"Button " + btn.label + " has correct checked attribute");
|
||||
});
|
||||
|
||||
// Switch back to tab 2.
|
||||
@ -184,14 +185,15 @@ function inspectorFocusTab2()
|
||||
// Make sure the inspector is still open.
|
||||
ok(!InspectorUI.inspecting, "Inspector is not highlighting");
|
||||
ok(!InspectorUI.treePanel.isOpen(), "Inspector Tree Panel is not open");
|
||||
ok(!InspectorUI.isSidebarOpen, "Inspector Sidebar is not open");
|
||||
ok(!InspectorUI.sidebar.visible, "Inspector Sidebar is not open");
|
||||
is(InspectorUI.store.length, 2, "Inspector.store.length is 2");
|
||||
isnot(InspectorUI.selection, div, "selection does not match the div element");
|
||||
|
||||
// Make sure keybindings still sork
|
||||
EventUtils.synthesizeKey("VK_RETURN", { });
|
||||
|
||||
executeSoon(function() {
|
||||
// Make sure keybindings still work
|
||||
synthesizeKeyFromKeyTag("key_inspect");
|
||||
|
||||
ok(InspectorUI.inspecting, "Inspector is highlighting");
|
||||
InspectorUI.toggleInspection();
|
||||
|
||||
@ -212,13 +214,13 @@ function inspectorSecondFocusTab1()
|
||||
is(InspectorUI.store.length, 2, "Inspector.store.length = 2");
|
||||
is(InspectorUI.selection, div, "selection matches the div element");
|
||||
|
||||
ok(InspectorUI.isSidebarOpen, "Inspector Sidebar is open");
|
||||
ok(InspectorUI.stylePanel, "Inspector Has a Style Panel Instance");
|
||||
InspectorUI.sidebarTools.forEach(function(aTool) {
|
||||
let btn = document.getElementById(InspectorUI.getToolbarButtonId(aTool.id));
|
||||
ok(InspectorUI.sidebar.visible, "Inspector Sidebar is open");
|
||||
ok(computedView(), "Inspector Has a Style Panel Instance");
|
||||
InspectorUI.sidebar._toolObjects().forEach(function(aTool) {
|
||||
let btn = aTool.button;
|
||||
is(btn.hasAttribute("checked"),
|
||||
(aTool == InspectorUI.stylePanel.registrationObject),
|
||||
"Button " + btn.id + " has correct checked attribute");
|
||||
(aTool.id == "computedview"),
|
||||
"Button " + btn.label + " has correct checked attribute");
|
||||
});
|
||||
|
||||
// Switch back to tab 2.
|
||||
|
@ -89,3 +89,42 @@ function midPoint(aPointA, aPointB)
|
||||
return pointC;
|
||||
}
|
||||
|
||||
function computedView()
|
||||
{
|
||||
return InspectorUI.sidebar._toolContext("computedview");
|
||||
}
|
||||
|
||||
function computedViewTree()
|
||||
{
|
||||
return computedView().view;
|
||||
}
|
||||
|
||||
function ruleView()
|
||||
{
|
||||
return InspectorUI.sidebar._toolContext("ruleview").view;
|
||||
}
|
||||
function synthesizeKeyFromKeyTag(aKeyId) {
|
||||
let key = document.getElementById(aKeyId);
|
||||
isnot(key, null, "Successfully retrieved the <key> node");
|
||||
|
||||
let modifiersAttr = key.getAttribute("modifiers");
|
||||
|
||||
let name = null;
|
||||
|
||||
if (key.getAttribute("keycode"))
|
||||
name = key.getAttribute("keycode");
|
||||
else if (key.getAttribute("key"))
|
||||
name = key.getAttribute("key");
|
||||
|
||||
isnot(name, null, "Successfully retrieved keycode/key");
|
||||
|
||||
let modifiers = {
|
||||
shiftKey: modifiersAttr.match("shift"),
|
||||
ctrlKey: modifiersAttr.match("ctrl"),
|
||||
altKey: modifiersAttr.match("alt"),
|
||||
metaKey: modifiersAttr.match("meta"),
|
||||
accelKey: modifiersAttr.match("accel")
|
||||
}
|
||||
|
||||
EventUtils.synthesizeKey(name, modifiers);
|
||||
}
|
||||
|
@ -306,12 +306,10 @@ CssHtmlTree.prototype = {
|
||||
this._refreshProcess = new UpdateProcess(this.win, CssHtmlTree.propertyNames, {
|
||||
onItem: function(aPropertyName) {
|
||||
// Per-item callback.
|
||||
if (this.viewedElement != aElement || !this.styleInspector.isOpen()) {
|
||||
return false;
|
||||
}
|
||||
let propView = new PropertyView(this, aPropertyName);
|
||||
fragment.appendChild(propView.buildMain());
|
||||
fragment.appendChild(propView.buildSelectorContainer());
|
||||
|
||||
if (propView.visible) {
|
||||
this.numVisibleProperties++;
|
||||
}
|
||||
@ -324,7 +322,14 @@ CssHtmlTree.prototype = {
|
||||
this.propertyContainer.appendChild(fragment);
|
||||
this.noResults.hidden = this.numVisibleProperties > 0;
|
||||
this._refreshProcess = null;
|
||||
Services.obs.notifyObservers(null, "StyleInspector-populated", null);
|
||||
|
||||
// If a refresh was scheduled during the building, complete it.
|
||||
if (this._needsRefresh) {
|
||||
delete this._needsRefresh;
|
||||
this.refreshPanel();
|
||||
} else {
|
||||
Services.obs.notifyObservers(null, "StyleInspector-populated", null);
|
||||
}
|
||||
}.bind(this)});
|
||||
|
||||
this._refreshProcess.schedule();
|
||||
@ -336,6 +341,15 @@ CssHtmlTree.prototype = {
|
||||
*/
|
||||
refreshPanel: function CssHtmlTree_refreshPanel()
|
||||
{
|
||||
// If we're still in the process of creating the initial layout,
|
||||
// leave it alone.
|
||||
if (!this.htmlComplete) {
|
||||
if (this._refreshProcess) {
|
||||
this._needsRefresh = true;
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
if (this._refreshProcess) {
|
||||
this._refreshProcess.cancel();
|
||||
}
|
||||
@ -355,7 +369,7 @@ CssHtmlTree.prototype = {
|
||||
}.bind(this),
|
||||
onDone: function() {
|
||||
this._refreshProcess = null;
|
||||
this.noResults.hidden = this.numVisibleProperties > 0
|
||||
this.noResults.hidden = this.numVisibleProperties > 0;
|
||||
Services.obs.notifyObservers(null, "StyleInspector-populated", null);
|
||||
}.bind(this)
|
||||
});
|
||||
@ -1203,11 +1217,6 @@ SelectorView.prototype = {
|
||||
result = CssLogic.getShortName(source);
|
||||
}
|
||||
|
||||
aElement.parentNode.querySelector(".rule-link > a").
|
||||
addEventListener("click", function(aEvent) {
|
||||
this.tree.styleInspector.selectFromPath(source);
|
||||
aEvent.preventDefault();
|
||||
}.bind(this), false);
|
||||
result += ".style";
|
||||
}
|
||||
|
||||
|
@ -648,6 +648,10 @@ CssLogic.prototype = {
|
||||
this._passId++;
|
||||
this._matchedRules = [];
|
||||
|
||||
if (!element) {
|
||||
return;
|
||||
}
|
||||
|
||||
do {
|
||||
let status = this.viewedElement === element ?
|
||||
CssLogic.STATUS.MATCHED : CssLogic.STATUS.PARENT_MATCH;
|
||||
|
@ -714,6 +714,7 @@ function CssRuleView(aDoc, aStore)
|
||||
this.element.addEventListener("copy", this._boundCopy);
|
||||
|
||||
this._createContextMenu();
|
||||
this._showEmpty();
|
||||
}
|
||||
|
||||
CssRuleView.prototype = {
|
||||
@ -763,13 +764,14 @@ CssRuleView.prototype = {
|
||||
|
||||
this.clear();
|
||||
|
||||
this._viewedElement = aElement;
|
||||
if (!this._viewedElement) {
|
||||
return;
|
||||
if (this._elementStyle) {
|
||||
delete this._elementStyle;
|
||||
}
|
||||
|
||||
if (this._elementStyle) {
|
||||
delete this._elementStyle.onChanged;
|
||||
this._viewedElement = aElement;
|
||||
if (!this._viewedElement) {
|
||||
this._showEmpty();
|
||||
return;
|
||||
}
|
||||
|
||||
this._elementStyle = new ElementStyle(aElement, this.store);
|
||||
@ -808,6 +810,21 @@ CssRuleView.prototype = {
|
||||
this._createEditors();
|
||||
},
|
||||
|
||||
/**
|
||||
* Show the user that the rule view has no node selected.
|
||||
*/
|
||||
_showEmpty: function CssRuleView_showEmpty()
|
||||
{
|
||||
if (this.doc.getElementById("noResults") > 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
createChild(this.element, "div", {
|
||||
id: "noResults",
|
||||
textContent: CssLogic.l10n("rule.empty")
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* Clear the rules.
|
||||
*/
|
||||
|
@ -23,6 +23,7 @@
|
||||
* Contributor(s):
|
||||
* Mike Ratcliffe <mratcliffe@mozilla.com> (Original Author)
|
||||
* Rob Campbell <rcampbell@mozilla.com>
|
||||
* Dave Camp <dcamp@mozilla.com>
|
||||
*
|
||||
* Alternatively, the contents of this file may be used under the terms of
|
||||
* either the GNU General Public License Version 2 or later (the "GPL"), or
|
||||
@ -43,316 +44,221 @@ const Ci = Components.interfaces;
|
||||
|
||||
Cu.import("resource://gre/modules/Services.jsm");
|
||||
Cu.import("resource://gre/modules/XPCOMUtils.jsm");
|
||||
Cu.import("resource:///modules/devtools/CssRuleView.jsm");
|
||||
Cu.import("resource:///modules/inspector.jsm");
|
||||
|
||||
var EXPORTED_SYMBOLS = ["StyleInspector"];
|
||||
// This module doesn't currently export any symbols directly, it only
|
||||
// registers inspector tools.
|
||||
var EXPORTED_SYMBOLS = [];
|
||||
|
||||
/**
|
||||
* StyleInspector Constructor Function.
|
||||
* @param {window} aContext, the chrome window context we're calling from.
|
||||
* @param {InspectorUI} aIUI (optional) An InspectorUI instance if called from the
|
||||
* Highlighter.
|
||||
* Lookup l10n string from a string bundle.
|
||||
* @param {string} aName The key to lookup.
|
||||
* @returns A localized version of the given key.
|
||||
*/
|
||||
function StyleInspector(aContext, aIUI)
|
||||
function l10n(aName)
|
||||
{
|
||||
this._init(aContext, aIUI);
|
||||
try {
|
||||
return _strings.GetStringFromName(aName);
|
||||
} catch (ex) {
|
||||
Services.console.logStringMessage("Error reading '" + aName + "'");
|
||||
throw new Error("l10n error with " + aName);
|
||||
}
|
||||
}
|
||||
|
||||
StyleInspector.prototype = {
|
||||
function RegisterStyleTools()
|
||||
{
|
||||
// Register the rules view
|
||||
if (Services.prefs.getBoolPref("devtools.ruleview.enabled")) {
|
||||
InspectorUI.registerSidebar({
|
||||
id: "ruleview",
|
||||
label: l10n("ruleView.label"),
|
||||
tooltiptext: l10n("ruleView.tooltiptext"),
|
||||
accesskey: l10n("ruleView.accesskey"),
|
||||
contentURL: "chrome://browser/content/devtools/cssruleview.xul",
|
||||
load: function(aInspector, aFrame) new RuleViewTool(aInspector, aFrame),
|
||||
destroy: function(aContext) aContext.destroy()
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Initialization method called from constructor.
|
||||
* @param {window} aContext, the chrome window context we're calling from.
|
||||
* @param {InspectorUI} aIUI (optional) An InspectorUI instance if called from
|
||||
* the Highlighter.
|
||||
*/
|
||||
_init: function SI__init(aContext, aIUI)
|
||||
{
|
||||
this.window = aContext;
|
||||
this.IUI = aIUI;
|
||||
this.document = this.window.document;
|
||||
this.cssLogic = new CssLogic();
|
||||
this.panelReady = false;
|
||||
this.iframeReady = false;
|
||||
// Register the computed styles view
|
||||
if (Services.prefs.getBoolPref("devtools.styleinspector.enabled")) {
|
||||
InspectorUI.registerSidebar({
|
||||
id: "computedview",
|
||||
label: this.l10n("style.highlighter.button.label2"),
|
||||
tooltiptext: this.l10n("style.highlighter.button.tooltip2"),
|
||||
accesskey: this.l10n("style.highlighter.accesskey2"),
|
||||
contentURL: "chrome://browser/content/devtools/csshtmltree.xul",
|
||||
load: function(aInspector, aFrame) new ComputedViewTool(aInspector, aFrame),
|
||||
destroy: function(aContext) aContext.destroy()
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Were we invoked from the Highlighter?
|
||||
if (this.IUI) {
|
||||
this.openDocked = true;
|
||||
let isOpen = this.isOpen.bind(this);
|
||||
function RuleViewTool(aInspector, aFrame)
|
||||
{
|
||||
this.inspector = aInspector;
|
||||
this.chromeWindow = this.inspector.chromeWindow;
|
||||
this.doc = aFrame.contentDocument;
|
||||
|
||||
this.registrationObject = {
|
||||
id: "styleinspector",
|
||||
label: this.l10n("style.highlighter.button.label2"),
|
||||
tooltiptext: this.l10n("style.highlighter.button.tooltip2"),
|
||||
accesskey: this.l10n("style.highlighter.accesskey2"),
|
||||
context: this,
|
||||
get isOpen() isOpen(),
|
||||
onSelect: this.selectNode,
|
||||
onChanged: this.updateNode,
|
||||
show: this.open,
|
||||
hide: this.close,
|
||||
dim: this.dimTool,
|
||||
panel: null,
|
||||
unregister: this.destroy,
|
||||
sidebar: true,
|
||||
};
|
||||
if (!this.inspector._ruleViewStore) {
|
||||
this.inspector._ruleViewStore = {};
|
||||
}
|
||||
this.view = new CssRuleView(this.doc, this.inspector._ruleViewStore);
|
||||
this.doc.documentElement.appendChild(this.view.element);
|
||||
|
||||
// Register the registrationObject with the Highlighter
|
||||
this.IUI.registerTool(this.registrationObject);
|
||||
this.createSidebarContent(true);
|
||||
}
|
||||
},
|
||||
this._changeHandler = function() {
|
||||
this.inspector.markDirty();
|
||||
this.inspector.change("ruleview");
|
||||
}.bind(this);
|
||||
|
||||
/**
|
||||
* Create the iframe in the IUI sidebar's tab panel.
|
||||
* @param {Boolean} aPreserveOnHide Prevents destroy from being called.
|
||||
*/
|
||||
createSidebarContent: function SI_createSidebarContent(aPreserveOnHide)
|
||||
{
|
||||
this.preserveOnHide = !!aPreserveOnHide;
|
||||
this.view.element.addEventListener("CssRuleViewChanged", this._changeHandler)
|
||||
|
||||
let boundIframeOnLoad = function loadedInitializeIframe() {
|
||||
if (this.iframe &&
|
||||
this.iframe.getAttribute("src") ==
|
||||
"chrome://browser/content/devtools/csshtmltree.xul") {
|
||||
let selectedNode = this.selectedNode || null;
|
||||
this.cssHtmlTree = new CssHtmlTree(this);
|
||||
this.cssLogic.highlight(selectedNode);
|
||||
this.cssHtmlTree.highlight(selectedNode);
|
||||
this.iframe.removeEventListener("load", boundIframeOnLoad, true);
|
||||
this.iframeReady = true;
|
||||
this._cssLinkHandler = function(aEvent) {
|
||||
let rule = aEvent.detail.rule;
|
||||
let styleSheet = rule.sheet;
|
||||
let doc = this.chromeWindow.content.document;
|
||||
let styleSheets = doc.styleSheets;
|
||||
let contentSheet = false;
|
||||
let line = rule.ruleLine || 0;
|
||||
|
||||
// Now that we've loaded, select any node we were previously asked
|
||||
// to show.
|
||||
this.selectNode(this.selectedNode);
|
||||
|
||||
Services.obs.notifyObservers(null, "StyleInspector-opened", null);
|
||||
// Array.prototype.indexOf always returns -1 here so we loop through
|
||||
// the styleSheets object instead.
|
||||
for each (let sheet in styleSheets) {
|
||||
if (sheet == styleSheet) {
|
||||
contentSheet = true;
|
||||
break;
|
||||
}
|
||||
}.bind(this);
|
||||
|
||||
this.iframe = this.IUI.getToolIframe(this.registrationObject);
|
||||
|
||||
this.iframe.addEventListener("load", boundIframeOnLoad, true);
|
||||
},
|
||||
|
||||
/**
|
||||
* Factory method to create the actual style panel
|
||||
* @param {Boolean} aPreserveOnHide Prevents destroy from being called
|
||||
* onpopuphide. USE WITH CAUTION: When this value is set to true then you are
|
||||
* responsible to manually call destroy from outside the style inspector.
|
||||
* @param {function} aCallback (optional) callback to fire when ready.
|
||||
*/
|
||||
createPanel: function SI_createPanel(aPreserveOnHide, aCallback)
|
||||
{
|
||||
let popupSet = this.document.getElementById("mainPopupSet");
|
||||
let panel = this.document.createElement("panel");
|
||||
this.preserveOnHide = !!aPreserveOnHide;
|
||||
|
||||
panel.setAttribute("class", "styleInspector");
|
||||
panel.setAttribute("orient", "vertical");
|
||||
panel.setAttribute("ignorekeys", "true");
|
||||
panel.setAttribute("noautofocus", "true");
|
||||
panel.setAttribute("noautohide", "true");
|
||||
panel.setAttribute("titlebar", "normal");
|
||||
panel.setAttribute("close", "true");
|
||||
panel.setAttribute("label", this.l10n("panelTitle"));
|
||||
panel.setAttribute("width", 350);
|
||||
panel.setAttribute("height", this.window.screen.height / 2);
|
||||
|
||||
let iframe = this.document.createElement("iframe");
|
||||
let boundIframeOnLoad = function loadedInitializeIframe()
|
||||
{
|
||||
this.iframe.removeEventListener("load", boundIframeOnLoad, true);
|
||||
this.iframeReady = true;
|
||||
if (aCallback)
|
||||
aCallback(this);
|
||||
}.bind(this);
|
||||
|
||||
iframe.flex = 1;
|
||||
iframe.setAttribute("tooltip", "aHTMLTooltip");
|
||||
iframe.addEventListener("load", boundIframeOnLoad, true);
|
||||
iframe.setAttribute("src", "chrome://browser/content/devtools/csshtmltree.xul");
|
||||
|
||||
panel.appendChild(iframe);
|
||||
popupSet.appendChild(panel);
|
||||
|
||||
this._boundPopupShown = this.popupShown.bind(this);
|
||||
this._boundPopupHidden = this.popupHidden.bind(this);
|
||||
panel.addEventListener("popupshown", this._boundPopupShown, false);
|
||||
panel.addEventListener("popuphidden", this._boundPopupHidden, false);
|
||||
|
||||
this.panel = panel;
|
||||
this.iframe = iframe;
|
||||
|
||||
return panel;
|
||||
},
|
||||
|
||||
/**
|
||||
* Event handler for the popupshown event.
|
||||
*/
|
||||
popupShown: function SI_popupShown()
|
||||
{
|
||||
this.panelReady = true;
|
||||
if (this.iframeReady) {
|
||||
this.cssHtmlTree = new CssHtmlTree(this);
|
||||
let selectedNode = this.selectedNode || null;
|
||||
this.cssLogic.highlight(selectedNode);
|
||||
this.cssHtmlTree.highlight(selectedNode);
|
||||
Services.obs.notifyObservers(null, "StyleInspector-opened", null);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Event handler for the popuphidden event.
|
||||
* Hide the popup and conditionally destroy it
|
||||
*/
|
||||
popupHidden: function SI_popupHidden()
|
||||
{
|
||||
if (this.preserveOnHide) {
|
||||
Services.obs.notifyObservers(null, "StyleInspector-closed", null);
|
||||
if (contentSheet) {
|
||||
this.chromeWindow.StyleEditor.openChrome(styleSheet, line);
|
||||
} else {
|
||||
this.destroy();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Check if the style inspector is open.
|
||||
* @returns boolean
|
||||
*/
|
||||
isOpen: function SI_isOpen()
|
||||
{
|
||||
return this.openDocked ? this.IUI.isSidebarOpen &&
|
||||
(this.IUI.sidebarDeck.selectedPanel == this.iframe) :
|
||||
this.panel && this.panel.state && this.panel.state == "open";
|
||||
},
|
||||
|
||||
isLoaded: function SI_isLoaded()
|
||||
{
|
||||
return this.openDocked ? this.iframeReady : this.iframeReady && this.panelReady;
|
||||
},
|
||||
|
||||
/**
|
||||
* Select from Path (via CssHtmlTree_pathClick)
|
||||
* @param aNode The node to inspect.
|
||||
*/
|
||||
selectFromPath: function SI_selectFromPath(aNode)
|
||||
{
|
||||
if (this.IUI && this.IUI.selection) {
|
||||
if (aNode != this.IUI.selection) {
|
||||
this.IUI.inspectNode(aNode);
|
||||
let href = styleSheet ? styleSheet.href : "";
|
||||
if (rule.elementStyle.element) {
|
||||
href = rule.elementStyle.element.ownerDocument.location.href;
|
||||
}
|
||||
} else {
|
||||
this.selectNode(aNode);
|
||||
let viewSourceUtils = this.chromeWindow.gViewSourceUtils;
|
||||
viewSourceUtils.viewSource(href, null, doc, line);
|
||||
}
|
||||
}.bind(this);
|
||||
|
||||
this.view.element.addEventListener("CssRuleViewCSSLinkClicked",
|
||||
this._cssLinkHandler);
|
||||
|
||||
this._onSelect = this.onSelect.bind(this);
|
||||
this.inspector.on("select", this._onSelect);
|
||||
|
||||
this._onChange = this.onChange.bind(this);
|
||||
this.inspector.on("change", this._onChange);
|
||||
|
||||
this.onSelect();
|
||||
}
|
||||
|
||||
RuleViewTool.prototype = {
|
||||
onSelect: function RVT_onSelect(aEvent, aFrom) {
|
||||
let node = this.inspector.selection;
|
||||
if (!node) {
|
||||
this.view.highlight(null);
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.inspector.locked) {
|
||||
this.view.highlight(node);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Select a node to inspect in the Style Inspector panel
|
||||
* @param aNode The node to inspect.
|
||||
*/
|
||||
selectNode: function SI_selectNode(aNode)
|
||||
{
|
||||
this.selectedNode = aNode;
|
||||
if (this.isLoaded() && !this.dimmed) {
|
||||
this.cssLogic.highlight(aNode);
|
||||
this.cssHtmlTree.highlight(aNode);
|
||||
onChange: function RVT_onChange(aEvent, aFrom) {
|
||||
// We're not that good yet at refreshing, only
|
||||
// refresh when we really need to.
|
||||
if (aFrom != "pseudoclass") {
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.inspector.locked) {
|
||||
this.view.nodeChanged();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Update the display for the currently-selected node.
|
||||
*/
|
||||
updateNode: function SI_updateNode()
|
||||
destroy: function RVT_destroy() {
|
||||
this.inspector.removeListener("select", this._onSelect);
|
||||
this.inspector.removeListener("change", this._onChange);
|
||||
this.view.element.removeEventListener("CssRuleViewChanged",
|
||||
this._changeHandler);
|
||||
this.view.element.removeEventListener("CssRuleViewCSSLinkClicked",
|
||||
this._cssLinkHandler);
|
||||
this.doc.documentElement.removeChild(this.view.element);
|
||||
|
||||
this.view.destroy();
|
||||
|
||||
delete this._changeHandler;
|
||||
delete this.view;
|
||||
delete this.doc;
|
||||
delete this.inspector;
|
||||
}
|
||||
}
|
||||
|
||||
function ComputedViewTool(aInspector, aFrame)
|
||||
{
|
||||
this.inspector = aInspector;
|
||||
this.iframe = aFrame;
|
||||
this.window = aInspector.chromeWindow;
|
||||
this.document = this.window.document;
|
||||
this.cssLogic = new CssLogic();
|
||||
this.view = new CssHtmlTree(this);
|
||||
|
||||
this._onSelect = this.onSelect.bind(this);
|
||||
this.inspector.on("select", this._onSelect);
|
||||
|
||||
this._onChange = this.onChange.bind(this);
|
||||
this.inspector.on("change", this._onChange);
|
||||
|
||||
// Since refreshes of the computed view are non-destructive,
|
||||
// refresh when the tab is changed so we can notice script-driven
|
||||
// changes.
|
||||
this.inspector.on("sidebaractivated", this._onChange);
|
||||
|
||||
this.cssLogic.highlight(null);
|
||||
this.view.highlight(null);
|
||||
|
||||
this.onSelect();
|
||||
}
|
||||
|
||||
ComputedViewTool.prototype = {
|
||||
onSelect: function CVT_onSelect(aEvent)
|
||||
{
|
||||
if (this.isLoaded() && !this.dimmed) {
|
||||
this.cssLogic.highlight(this.selectedNode);
|
||||
this.cssHtmlTree.refreshPanel();
|
||||
if (this.inspector.locked) {
|
||||
this.cssLogic.highlight(this.inspector.selection);
|
||||
this.view.highlight(this.inspector.selection);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Dim or undim a panel by setting or removing a dimmed attribute.
|
||||
* @param aState
|
||||
* true = dim, false = undim
|
||||
*/
|
||||
dimTool: function SI_dimTool(aState)
|
||||
onChange: function CVT_change(aEvent, aFrom)
|
||||
{
|
||||
this.dimmed = aState;
|
||||
if (aFrom == "computedview" ||
|
||||
this.inspector.selection != this.cssLogic.viewedElement) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.cssLogic.highlight(this.inspector.selection);
|
||||
this.view.refreshPanel();
|
||||
},
|
||||
|
||||
/**
|
||||
* Open the panel.
|
||||
* @param {DOMNode} aSelection the (optional) DOM node to select.
|
||||
*/
|
||||
open: function SI_open(aSelection)
|
||||
destroy: function CVT_destroy(aContext)
|
||||
{
|
||||
this.selectNode(aSelection);
|
||||
if (this.openDocked) {
|
||||
if (!this.iframeReady) {
|
||||
this.iframe.setAttribute("src", "chrome://browser/content/devtools/csshtmltree.xul");
|
||||
}
|
||||
} else {
|
||||
this.panel.openPopup(this.window.gBrowser.selectedBrowser, "end_before", 0, 0,
|
||||
false, false);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Close the panel.
|
||||
*/
|
||||
close: function SI_close()
|
||||
{
|
||||
if (this.openDocked) {
|
||||
Services.obs.notifyObservers(null, "StyleInspector-closed", null);
|
||||
} else {
|
||||
this.panel.hidePopup();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Memoized lookup of a l10n string from a string bundle.
|
||||
* @param {string} aName The key to lookup.
|
||||
* @returns A localized version of the given key.
|
||||
*/
|
||||
l10n: function SI_l10n(aName)
|
||||
{
|
||||
try {
|
||||
return _strings.GetStringFromName(aName);
|
||||
} catch (ex) {
|
||||
Services.console.logStringMessage("Error reading '" + aName + "'");
|
||||
throw new Error("l10n error with " + aName);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Destroy the style panel, remove listeners etc.
|
||||
*/
|
||||
destroy: function SI_destroy()
|
||||
{
|
||||
if (this.isOpen())
|
||||
this.close();
|
||||
if (this.cssHtmlTree)
|
||||
this.cssHtmlTree.destroy();
|
||||
if (this.iframe) {
|
||||
this.iframe.parentNode.removeChild(this.iframe);
|
||||
delete this.iframe;
|
||||
}
|
||||
this.inspector.removeListener("select", this._onSelect);
|
||||
this.inspector.removeListener("change", this._onChange);
|
||||
this.inspector.removeListener("sidebaractivated", this._onChange);
|
||||
this.view.destroy();
|
||||
delete this.view;
|
||||
|
||||
delete this.cssLogic;
|
||||
delete this.cssHtmlTree;
|
||||
if (this.panel) {
|
||||
this.panel.removeEventListener("popupshown", this._boundPopupShown, false);
|
||||
this.panel.removeEventListener("popuphidden", this._boundPopupHidden, false);
|
||||
delete this._boundPopupShown;
|
||||
delete this._boundPopupHidden;
|
||||
this.panel.parentNode.removeChild(this.panel);
|
||||
delete this.panel;
|
||||
}
|
||||
delete this.doc;
|
||||
delete this.win;
|
||||
delete CssHtmlTree.win;
|
||||
Services.obs.notifyObservers(null, "StyleInspector-closed", null);
|
||||
},
|
||||
};
|
||||
delete this.iframe;
|
||||
delete this.window;
|
||||
delete this.document;
|
||||
}
|
||||
}
|
||||
|
||||
XPCOMUtils.defineLazyGetter(this, "_strings", function() Services.strings
|
||||
.createBundle("chrome://browser/locale/devtools/styleinspector.properties"));
|
||||
@ -368,3 +274,5 @@ XPCOMUtils.defineLazyGetter(this, "CssHtmlTree", function() {
|
||||
Cu.import("resource:///modules/devtools/CssHtmlTree.jsm", tmp);
|
||||
return tmp.CssHtmlTree;
|
||||
});
|
||||
|
||||
RegisterStyleTools();
|
||||
|
@ -14,19 +14,12 @@ function createDocument()
|
||||
'<span class="matches">Some styled text</span>' +
|
||||
'</div>';
|
||||
doc.title = "Style Inspector key binding test";
|
||||
stylePanel = new StyleInspector(window);
|
||||
Services.obs.addObserver(runStyleInspectorTests, "StyleInspector-opened", false);
|
||||
stylePanel.createPanel(false, function() {
|
||||
stylePanel.open(doc.body);
|
||||
});
|
||||
stylePanel = new ComputedViewPanel(window);
|
||||
stylePanel.createPanel(doc.body, runStyleInspectorTests);
|
||||
}
|
||||
|
||||
function runStyleInspectorTests()
|
||||
{
|
||||
Services.obs.removeObserver(runStyleInspectorTests, "StyleInspector-opened", false);
|
||||
|
||||
ok(stylePanel.isOpen(), "style inspector is open");
|
||||
|
||||
Services.obs.addObserver(SI_test, "StyleInspector-populated", false);
|
||||
SI_inspectNode();
|
||||
}
|
||||
@ -66,8 +59,8 @@ function SI_test()
|
||||
testKey(iframe.contentWindow, "VK_RETURN", rulesTable);
|
||||
|
||||
checkHelpLinkKeybinding();
|
||||
Services.obs.addObserver(finishUp, "StyleInspector-closed", false);
|
||||
stylePanel.close();
|
||||
stylePanel.destroy();
|
||||
finishUp();
|
||||
});
|
||||
|
||||
info("Adding focus event handler to search filter");
|
||||
@ -94,6 +87,7 @@ function getFirstVisiblePropertyView()
|
||||
propView = aPropView;
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
});
|
||||
|
||||
return propView;
|
||||
@ -127,8 +121,6 @@ function checkHelpLinkKeybinding()
|
||||
|
||||
function finishUp()
|
||||
{
|
||||
Services.obs.removeObserver(finishUp, "StyleInspector-closed", false);
|
||||
ok(!stylePanel.isOpen(), "style inspector is closed");
|
||||
doc = stylePanel = null;
|
||||
gBrowser.removeCurrentTab();
|
||||
finish();
|
||||
|
@ -26,25 +26,18 @@ function tabLoaded()
|
||||
browser.removeEventListener("load", tabLoaded, true);
|
||||
doc = content.document;
|
||||
// ok(StyleInspector.isEnabled, "style inspector preference is enabled");
|
||||
stylePanel = new StyleInspector(window);
|
||||
Services.obs.addObserver(runTests, "StyleInspector-opened", false);
|
||||
stylePanel.createPanel(false, function() {
|
||||
stylePanel.open(doc.body);
|
||||
});
|
||||
stylePanel = new ComputedViewPanel(window);
|
||||
stylePanel.createPanel(doc.body, runTests);
|
||||
}
|
||||
|
||||
function runTests()
|
||||
{
|
||||
Services.obs.removeObserver(runTests, "StyleInspector-opened", false);
|
||||
|
||||
ok(stylePanel.isOpen(), "style inspector is open");
|
||||
|
||||
testMatchedSelectors();
|
||||
//testUnmatchedSelectors();
|
||||
|
||||
info("finishing up");
|
||||
Services.obs.addObserver(finishUp, "StyleInspector-closed", false);
|
||||
stylePanel.close();
|
||||
stylePanel.destroy();
|
||||
finishUp();
|
||||
}
|
||||
|
||||
function testMatchedSelectors()
|
||||
@ -97,8 +90,6 @@ function testUnmatchedSelectors()
|
||||
|
||||
function finishUp()
|
||||
{
|
||||
Services.obs.removeObserver(finishUp, "StyleInspector-closed", false);
|
||||
ok(!stylePanel.isOpen(), "style inspector is closed");
|
||||
doc = stylePanel = null;
|
||||
gBrowser.removeCurrentTab();
|
||||
finish();
|
||||
|
@ -22,19 +22,12 @@ function docLoaded()
|
||||
{
|
||||
browser.removeEventListener("load", docLoaded, true);
|
||||
doc = content.document;
|
||||
stylePanel = new StyleInspector(window);
|
||||
Services.obs.addObserver(checkSheets, "StyleInspector-opened", false);
|
||||
stylePanel.createPanel(false, function() {
|
||||
stylePanel.open(doc.body);
|
||||
});
|
||||
stylePanel = new ComputedViewPanel(window);
|
||||
stylePanel.createPanel(doc.body, checkSheets);
|
||||
}
|
||||
|
||||
function checkSheets()
|
||||
{
|
||||
Services.obs.removeObserver(checkSheets, "StyleInspector-opened", false);
|
||||
|
||||
ok(stylePanel.isOpen(), "style inspector is open");
|
||||
|
||||
var div = doc.querySelector("div");
|
||||
ok(div, "captain, we have the div");
|
||||
|
||||
@ -55,13 +48,12 @@ function checkSheets()
|
||||
is(cssLogic._matchedRules[1][0].source, source2,
|
||||
"rule.source gives correct output for rule 2");
|
||||
|
||||
Services.obs.addObserver(finishUp, "StyleInspector-closed", false);
|
||||
stylePanel.close();
|
||||
stylePanel.destroy();
|
||||
finishUp();
|
||||
}
|
||||
|
||||
function finishUp()
|
||||
{
|
||||
Services.obs.removeObserver(finishUp, "StyleInspector-closed", false);
|
||||
doc = null;
|
||||
gBrowser.removeCurrentTab();
|
||||
finish();
|
||||
|
@ -12,16 +12,14 @@ function createDocument()
|
||||
doc.body.innerHTML = "<div style='color:blue;'></div>";
|
||||
|
||||
doc.title = "Style Inspector Selector Text Test";
|
||||
stylePanel = new StyleInspector(window);
|
||||
stylePanel = new ComputedViewPanel(window);
|
||||
|
||||
Services.obs.addObserver(SI_checkText, "StyleInspector-populated", false);
|
||||
|
||||
stylePanel.createPanel(false, function() {
|
||||
Services.obs.addObserver(SI_checkText, "StyleInspector-populated", false);
|
||||
let span = doc.querySelector("div");
|
||||
ok(span, "captain, we have the test div");
|
||||
|
||||
let span = doc.querySelector("div");
|
||||
ok(span, "captain, we have the test div");
|
||||
stylePanel.open(span);
|
||||
});
|
||||
stylePanel.createPanel(span);
|
||||
}
|
||||
|
||||
function SI_checkText()
|
||||
@ -34,6 +32,7 @@ function SI_checkText()
|
||||
propertyView = aView;
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
});
|
||||
|
||||
ok(propertyView, "found PropertyView for color");
|
||||
@ -57,13 +56,12 @@ function SI_checkText()
|
||||
ok(false, "getting the selector text should not raise an exception");
|
||||
}
|
||||
|
||||
Services.obs.addObserver(finishUp, "StyleInspector-closed", false);
|
||||
stylePanel.close();
|
||||
stylePanel.destroy();
|
||||
finishUp();
|
||||
}
|
||||
|
||||
function finishUp()
|
||||
{
|
||||
Services.obs.removeObserver(finishUp, "StyleInspector-closed", false);
|
||||
doc = stylePanel = null;
|
||||
gBrowser.removeCurrentTab();
|
||||
finish();
|
||||
|
@ -30,19 +30,15 @@ function createDocument()
|
||||
let span = doc.querySelector("span");
|
||||
ok(span, "captain, we have the span");
|
||||
|
||||
stylePanel = new StyleInspector(window);
|
||||
Services.obs.addObserver(testInlineStyle, "StyleInspector-populated", false);
|
||||
stylePanel.createPanel(false, function() {
|
||||
stylePanel.open(span);
|
||||
});
|
||||
stylePanel = new ComputedViewPanel(window);
|
||||
stylePanel.createPanel(span);
|
||||
}
|
||||
|
||||
function testInlineStyle()
|
||||
{
|
||||
Services.obs.removeObserver(testInlineStyle, "StyleInspector-populated", false);
|
||||
|
||||
ok(stylePanel.isOpen(), "style inspector is open");
|
||||
|
||||
info("expanding property");
|
||||
expandProperty(0, function propertyExpanded() {
|
||||
Services.ww.registerNotification(function onWindow(aSubject, aTopic) {
|
||||
@ -113,8 +109,8 @@ function validateStyleEditorSheet(aEditor)
|
||||
info("closing window");
|
||||
win.close();
|
||||
|
||||
Services.obs.addObserver(finishUp, "StyleInspector-closed", false);
|
||||
stylePanel.close();
|
||||
stylePanel.destroy();
|
||||
finishUp();
|
||||
}
|
||||
|
||||
function expandProperty(aIndex, aCallback)
|
||||
@ -138,8 +134,6 @@ function getLinkByIndex(aIndex)
|
||||
|
||||
function finishUp()
|
||||
{
|
||||
Services.obs.removeObserver(finishUp, "StyleInspector-closed", false);
|
||||
ok(!stylePanel.isOpen(), "style inspector is closed");
|
||||
doc = win = stylePanel = null;
|
||||
gBrowser.removeCurrentTab();
|
||||
finish();
|
||||
|
@ -35,19 +35,15 @@ function createDocument()
|
||||
let span = doc.querySelector("span");
|
||||
ok(span, "captain, we have the span");
|
||||
|
||||
stylePanel = new StyleInspector(window);
|
||||
stylePanel = new ComputedViewPanel(window);
|
||||
Services.obs.addObserver(runStyleInspectorTests, "StyleInspector-populated", false);
|
||||
stylePanel.createPanel(false, function() {
|
||||
stylePanel.open(span);
|
||||
});
|
||||
stylePanel.createPanel(span);
|
||||
}
|
||||
|
||||
function runStyleInspectorTests()
|
||||
{
|
||||
Services.obs.removeObserver(runStyleInspectorTests, "StyleInspector-populated", false);
|
||||
|
||||
ok(stylePanel.isOpen(), "style inspector is open");
|
||||
|
||||
cssHtmlTree = stylePanel.cssHtmlTree;
|
||||
|
||||
let contentDocument = stylePanel.iframe.contentDocument;
|
||||
@ -166,14 +162,12 @@ function failedClipboard(aExpectedPattern, aCallback)
|
||||
|
||||
function closeStyleInspector()
|
||||
{
|
||||
Services.obs.addObserver(finishUp, "StyleInspector-closed", false);
|
||||
stylePanel.close();
|
||||
stylePanel.destroy();
|
||||
finishUp();
|
||||
}
|
||||
|
||||
function finishUp()
|
||||
{
|
||||
Services.obs.removeObserver(finishUp, "StyleInspector-closed", false);
|
||||
ok(!stylePanel.isOpen(), "style inspector is closed");
|
||||
doc = stylePanel = cssHtmlTree = null;
|
||||
gBrowser.removeCurrentTab();
|
||||
finish();
|
||||
|
@ -63,18 +63,14 @@ function inspectorUIOpen()
|
||||
InspectorUI.stopInspecting();
|
||||
is(InspectorUI.selection, div, "selection matches the div element");
|
||||
|
||||
Services.obs.addObserver(testInlineStyle,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.RULEVIEWREADY, false);
|
||||
InspectorUI.currentInspector.once("sidebaractivated-ruleview", testInlineStyle);
|
||||
|
||||
InspectorUI.showSidebar();
|
||||
InspectorUI.openRuleView();
|
||||
InspectorUI.sidebar.show();
|
||||
InspectorUI.sidebar.activatePanel("ruleview");
|
||||
}
|
||||
|
||||
function testInlineStyle()
|
||||
{
|
||||
Services.obs.removeObserver(testInlineStyle,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.RULEVIEWREADY, false);
|
||||
|
||||
executeSoon(function() {
|
||||
info("clicking an inline style");
|
||||
|
||||
@ -149,16 +145,15 @@ function validateStyleEditorSheet(aEditor)
|
||||
|
||||
function getLinkByIndex(aIndex)
|
||||
{
|
||||
let ruleView = document.querySelector("#devtools-sidebar-iframe-ruleview");
|
||||
let contentDoc = ruleView.contentDocument;
|
||||
let contentDoc = ruleView().doc;
|
||||
contentWindow = contentDoc.defaultView;
|
||||
let links = contentDoc.querySelectorAll(".ruleview-rule-source");
|
||||
contentWindow = ruleView.contentWindow;
|
||||
return links[aIndex];
|
||||
}
|
||||
|
||||
function finishup()
|
||||
{
|
||||
InspectorUI.hideSidebar();
|
||||
InspectorUI.sidebar.hide();
|
||||
InspectorUI.closeInspectorUI();
|
||||
gBrowser.removeCurrentTab();
|
||||
doc = contentWindow = win = null;
|
||||
|
@ -11,6 +11,11 @@ XPCOMUtils.defineLazyGetter(this, "osString", function() {
|
||||
return Cc["@mozilla.org/xre/app-info;1"].getService(Ci.nsIXULRuntime).OS;
|
||||
});
|
||||
|
||||
function ruleViewFrame()
|
||||
{
|
||||
return InspectorUI.sidebar._tools["ruleview"].frame;
|
||||
}
|
||||
|
||||
function createDocument()
|
||||
{
|
||||
doc.body.innerHTML = '<style type="text/css"> ' +
|
||||
@ -88,18 +93,13 @@ function inspectorUIOpen()
|
||||
InspectorUI.stopInspecting();
|
||||
is(InspectorUI.selection, div, "selection matches the div element");
|
||||
|
||||
Services.obs.addObserver(testClip,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.RULEVIEWREADY, false);
|
||||
|
||||
InspectorUI.showSidebar();
|
||||
InspectorUI.openRuleView();
|
||||
InspectorUI.currentInspector.once("sidebaractivated-ruleview", testClip)
|
||||
InspectorUI.sidebar.show();
|
||||
InspectorUI.sidebar.activatePanel("ruleview");
|
||||
}
|
||||
|
||||
function testClip()
|
||||
{
|
||||
Services.obs.removeObserver(testClip,
|
||||
InspectorUI.INSPECTOR_NOTIFICATIONS.RULEVIEWREADY, false);
|
||||
|
||||
executeSoon(function() {
|
||||
info("Checking that _onCopyRule() returns " +
|
||||
"the correct clipboard value");
|
||||
@ -120,8 +120,7 @@ function testClip()
|
||||
}
|
||||
|
||||
function checkCopyRule() {
|
||||
let ruleView = document.querySelector("#devtools-sidebar-iframe-ruleview");
|
||||
let contentDoc = ruleView.contentDocument;
|
||||
let contentDoc = ruleViewFrame().contentDocument;
|
||||
let props = contentDoc.querySelectorAll(".ruleview-property");
|
||||
|
||||
is(props.length, 5, "checking property length");
|
||||
@ -136,9 +135,9 @@ function checkCopyRule() {
|
||||
// We need the context menu to open in the correct place in order for
|
||||
// popupNode to be propertly set.
|
||||
EventUtils.synthesizeMouse(prop, 1, 1, { type: "contextmenu", button: 2 },
|
||||
ruleView.contentWindow);
|
||||
ruleViewFrame().contentWindow);
|
||||
|
||||
InspectorUI.ruleView._boundCopyRule();
|
||||
ruleView()._boundCopyRule();
|
||||
let menu = contentDoc.querySelector("#rule-view-context-menu");
|
||||
ok(menu, "we have the context menu");
|
||||
menu.hidePopup();
|
||||
@ -146,8 +145,7 @@ function checkCopyRule() {
|
||||
|
||||
function checkCopyRuleWithEditorSelected()
|
||||
{
|
||||
let ruleView = document.querySelector("#devtools-sidebar-iframe-ruleview");
|
||||
let contentDoc = ruleView.contentDocument;
|
||||
let contentDoc = ruleViewFrame().contentDocument;
|
||||
let rows = contentDoc.querySelectorAll(".rule-view-row");
|
||||
let propNodes = contentDoc.querySelectorAll(".ruleview-property");
|
||||
let propNode = propNodes[2];
|
||||
@ -172,7 +170,7 @@ function checkCopyRuleWithEditorSelected()
|
||||
// We need the context menu to open in the correct place in order for
|
||||
// popupNode to be propertly set.
|
||||
EventUtils.synthesizeMouse(aEditor.input, 1, 1,
|
||||
{ type: "contextmenu", button: 2 }, ruleView.contentWindow);
|
||||
{ type: "contextmenu", button: 2 }, ruleViewFrame().contentWindow);
|
||||
|
||||
SimpleTest.waitForClipboard(function IUI_boundCopyCheckWithSelection() {
|
||||
let menu = contentDoc.querySelector("#rule-view-context-menu");
|
||||
@ -180,11 +178,11 @@ function checkCopyRuleWithEditorSelected()
|
||||
menu.hidePopup();
|
||||
|
||||
return checkClipboardData(expectedPattern);
|
||||
}, InspectorUI.ruleView._boundCopyRule, waitForBlur, function() {
|
||||
}, ruleView()._boundCopyRule, waitForBlur, function() {
|
||||
failedClipboard(expectedPattern, checkCopyProperty);
|
||||
});
|
||||
});
|
||||
EventUtils.synthesizeMouse(propNameNode, 1, 1, { }, ruleView.contentWindow);
|
||||
EventUtils.synthesizeMouse(propNameNode, 1, 1, { }, ruleViewFrame().contentWindow);
|
||||
}
|
||||
|
||||
function waitForBlur()
|
||||
@ -198,8 +196,7 @@ function waitForBlur()
|
||||
|
||||
function checkCopyProperty()
|
||||
{
|
||||
let ruleView = document.querySelector("#devtools-sidebar-iframe-ruleview");
|
||||
let contentDoc = ruleView.contentDocument;
|
||||
let contentDoc = ruleViewFrame().contentDocument;
|
||||
let props = contentDoc.querySelectorAll(".ruleview-property");
|
||||
let prop = props[2];
|
||||
|
||||
@ -210,12 +207,12 @@ function checkCopyProperty()
|
||||
// We need the context menu to open in the correct place in order for
|
||||
// popupNode to be propertly set.
|
||||
EventUtils.synthesizeMouse(prop, 1, 1, { type: "contextmenu", button: 2 },
|
||||
ruleView.contentWindow);
|
||||
ruleViewFrame().contentWindow);
|
||||
|
||||
SimpleTest.waitForClipboard(function IUI_boundCopyPropCheck() {
|
||||
return checkClipboardData(expectedPattern);
|
||||
},
|
||||
InspectorUI.ruleView._boundCopyDeclaration,
|
||||
ruleView()._boundCopyDeclaration,
|
||||
checkCopyPropertyName, function() {
|
||||
failedClipboard(expectedPattern, checkCopyPropertyName);
|
||||
});
|
||||
@ -230,7 +227,7 @@ function checkCopyPropertyName()
|
||||
SimpleTest.waitForClipboard(function IUI_boundCopyPropNameCheck() {
|
||||
return checkClipboardData(expectedPattern);
|
||||
},
|
||||
InspectorUI.ruleView._boundCopyProperty,
|
||||
ruleView()._boundCopyProperty,
|
||||
checkCopyPropertyValue, function() {
|
||||
failedClipboard(expectedPattern, checkCopyPropertyValue);
|
||||
});
|
||||
@ -245,7 +242,7 @@ function checkCopyPropertyValue()
|
||||
SimpleTest.waitForClipboard(function IUI_boundCopyPropValueCheck() {
|
||||
return checkClipboardData(expectedPattern);
|
||||
},
|
||||
InspectorUI.ruleView._boundCopyPropertyValue,
|
||||
ruleView()._boundCopyPropertyValue,
|
||||
checkCopySelection, function() {
|
||||
failedClipboard(expectedPattern, checkCopySelection);
|
||||
});
|
||||
@ -253,15 +250,14 @@ function checkCopyPropertyValue()
|
||||
|
||||
function checkCopySelection()
|
||||
{
|
||||
let ruleView = document.querySelector("#devtools-sidebar-iframe-ruleview");
|
||||
let contentDoc = ruleView.contentDocument;
|
||||
let contentDoc = ruleViewFrame().contentDocument;
|
||||
let props = contentDoc.querySelectorAll(".ruleview-property");
|
||||
|
||||
let range = document.createRange();
|
||||
range.setStart(props[0], 0);
|
||||
range.setEnd(props[4], 8);
|
||||
|
||||
let selection = ruleView.contentWindow.getSelection();
|
||||
let selection = ruleViewFrame().contentWindow.getSelection();
|
||||
selection.addRange(range);
|
||||
|
||||
info("Checking that _boundCopy() returns the correct" +
|
||||
@ -276,7 +272,7 @@ function checkCopySelection()
|
||||
|
||||
SimpleTest.waitForClipboard(function IUI_boundCopyCheck() {
|
||||
return checkClipboardData(expectedPattern);
|
||||
},InspectorUI.ruleView._boundCopy, finishup, function() {
|
||||
},ruleView()._boundCopy, finishup, function() {
|
||||
failedClipboard(expectedPattern, finishup);
|
||||
});
|
||||
}
|
||||
@ -312,7 +308,7 @@ function failedClipboard(aExpectedPattern, aCallback)
|
||||
|
||||
function finishup()
|
||||
{
|
||||
InspectorUI.hideSidebar();
|
||||
InspectorUI.sidebar.hide();
|
||||
InspectorUI.closeInspectorUI();
|
||||
gBrowser.removeCurrentTab();
|
||||
doc = null;
|
||||
|
@ -13,18 +13,7 @@ let stylePanel;
|
||||
|
||||
function waitForRuleView(aCallback)
|
||||
{
|
||||
if (InspectorUI.ruleView) {
|
||||
aCallback();
|
||||
return;
|
||||
}
|
||||
|
||||
let ruleViewFrame = InspectorUI.getToolIframe(InspectorUI.ruleViewObject);
|
||||
ruleViewFrame.addEventListener("load", function(evt) {
|
||||
ruleViewFrame.removeEventListener(evt.type, arguments.callee, true);
|
||||
executeSoon(function() {
|
||||
aCallback();
|
||||
});
|
||||
}, true);
|
||||
InspectorUI.currentInspector.once("sidebaractivated-ruleview", aCallback);
|
||||
}
|
||||
|
||||
function waitForEditorFocus(aParent, aCallback)
|
||||
@ -54,8 +43,8 @@ function openRuleView()
|
||||
// Open the rule view sidebar.
|
||||
waitForRuleView(testFocus);
|
||||
|
||||
InspectorUI.showSidebar();
|
||||
InspectorUI.ruleButton.click();
|
||||
InspectorUI.sidebar.show();
|
||||
InspectorUI.sidebar.activatePanel("ruleview");
|
||||
|
||||
testFocus();
|
||||
}, InspectorUI.INSPECTOR_NOTIFICATIONS.OPENED, false);
|
||||
@ -64,7 +53,7 @@ function openRuleView()
|
||||
|
||||
function testFocus()
|
||||
{
|
||||
let ruleViewFrame = InspectorUI.getToolIframe(InspectorUI.ruleViewObject);
|
||||
let ruleViewFrame = InspectorUI.sidebar._tools["ruleview"].frame;
|
||||
let brace = ruleViewFrame.contentDocument.querySelectorAll(".ruleview-ruleclose")[0];
|
||||
waitForEditorFocus(brace.parentNode, function onNewElement(aEditor) {
|
||||
aEditor.input.value = "color";
|
||||
@ -89,7 +78,7 @@ function testFocus()
|
||||
|
||||
function finishUp()
|
||||
{
|
||||
InspectorUI.hideSidebar();
|
||||
InspectorUI.sidebar.hide();
|
||||
InspectorUI.closeInspectorUI();
|
||||
doc = stylePanel = null;
|
||||
gBrowser.removeCurrentTab();
|
||||
|
@ -72,7 +72,13 @@ function startTest()
|
||||
ruleView = new CssRuleView(doc);
|
||||
doc.documentElement.appendChild(ruleView.element);
|
||||
ruleView.element.addEventListener("CssRuleViewChanged", ruleViewChanged, false);
|
||||
is(ruleView.element.querySelectorAll("#noResults").length, 1, "Has a no-results element.");
|
||||
ruleView.highlight(testElement);
|
||||
is(ruleView.element.querySelectorAll("#noResults").length, 0, "After a highlight, no longer has a no-results element.");
|
||||
ruleView.highlight(null);
|
||||
is(ruleView.element.querySelectorAll("#noResults").length, 1, "After highlighting null, has a no-results element again.");
|
||||
ruleView.highlight(testElement);
|
||||
|
||||
waitForFocus(testCancelNew, ruleDialog);
|
||||
}, true);
|
||||
}
|
||||
|
@ -26,19 +26,12 @@ function createDocument()
|
||||
'<p>Inspect using inspectstyle(document.querySelectorAll("span")[0])</p>' +
|
||||
'</div>';
|
||||
doc.title = "Style Inspector Test";
|
||||
stylePanel = new StyleInspector(window);
|
||||
Services.obs.addObserver(runStyleInspectorTests, "StyleInspector-opened", false);
|
||||
stylePanel.createPanel(false, function() {
|
||||
stylePanel.open(doc.body);
|
||||
});
|
||||
stylePanel = new ComputedViewPanel(window);
|
||||
stylePanel.createPanel(doc.body, runStyleInspectorTests);
|
||||
}
|
||||
|
||||
function runStyleInspectorTests()
|
||||
{
|
||||
Services.obs.removeObserver(runStyleInspectorTests, "StyleInspector-opened", false);
|
||||
|
||||
ok(stylePanel.isOpen(), "style inspector is open");
|
||||
|
||||
var spans = doc.querySelectorAll("span");
|
||||
ok(spans, "captain, we have the spans");
|
||||
|
||||
@ -54,8 +47,8 @@ function runStyleInspectorTests()
|
||||
}
|
||||
|
||||
SI_CheckProperty();
|
||||
Services.obs.addObserver(finishUp, "StyleInspector-closed", false);
|
||||
stylePanel.close();
|
||||
stylePanel.destroy();
|
||||
finishUp();
|
||||
}
|
||||
|
||||
function SI_CheckProperty()
|
||||
@ -68,8 +61,6 @@ function SI_CheckProperty()
|
||||
|
||||
function finishUp()
|
||||
{
|
||||
Services.obs.removeObserver(finishUp, "StyleInspector-closed", false);
|
||||
ok(!stylePanel.isOpen(), "style inspector is closed");
|
||||
doc = stylePanel = null;
|
||||
gBrowser.removeCurrentTab();
|
||||
finish();
|
||||
|
@ -15,19 +15,12 @@ function createDocument()
|
||||
'</div>';
|
||||
doc.title = "Style Inspector Search Filter Test";
|
||||
// ok(StyleInspector.isEnabled, "style inspector preference is enabled");
|
||||
stylePanel = new StyleInspector(window);
|
||||
Services.obs.addObserver(runStyleInspectorTests, "StyleInspector-opened", false);
|
||||
stylePanel.createPanel(false, function() {
|
||||
stylePanel.open(doc.body);
|
||||
});
|
||||
stylePanel = new ComputedViewPanel(window);
|
||||
stylePanel.createPanel(doc.body, runStyleInspectorTests);
|
||||
}
|
||||
|
||||
function runStyleInspectorTests()
|
||||
{
|
||||
Services.obs.removeObserver(runStyleInspectorTests, "StyleInspector-opened", false);
|
||||
|
||||
ok(stylePanel.isOpen(), "style inspector is open");
|
||||
|
||||
Services.obs.addObserver(SI_toggleDefaultStyles, "StyleInspector-populated", false);
|
||||
SI_inspectNode();
|
||||
}
|
||||
@ -86,14 +79,12 @@ function SI_checkFilter()
|
||||
"span " + name + " property visibility check");
|
||||
});
|
||||
|
||||
Services.obs.addObserver(finishUp, "StyleInspector-closed", false);
|
||||
stylePanel.close();
|
||||
stylePanel.destroy();
|
||||
finishUp();
|
||||
}
|
||||
|
||||
function finishUp()
|
||||
{
|
||||
Services.obs.removeObserver(finishUp, "StyleInspector-closed", false);
|
||||
ok(!stylePanel.isOpen(), "style inspector is closed");
|
||||
doc = stylePanel = null;
|
||||
gBrowser.removeCurrentTab();
|
||||
finish();
|
||||
|
@ -15,19 +15,12 @@ function createDocument()
|
||||
'</div>';
|
||||
doc.title = "Style Inspector Default Styles Test";
|
||||
// ok(StyleInspector.isEnabled, "style inspector preference is enabled");
|
||||
stylePanel = new StyleInspector(window);
|
||||
Services.obs.addObserver(runStyleInspectorTests, "StyleInspector-opened", false);
|
||||
stylePanel.createPanel(false, function() {
|
||||
stylePanel.open(doc.body);
|
||||
});
|
||||
stylePanel = new ComputedViewPanel(window);
|
||||
stylePanel.createPanel(doc.body, runStyleInspectorTests);
|
||||
}
|
||||
|
||||
function runStyleInspectorTests()
|
||||
{
|
||||
Services.obs.removeObserver(runStyleInspectorTests, "StyleInspector-opened", false);
|
||||
|
||||
ok(stylePanel.isOpen(), "style inspector is open");
|
||||
|
||||
Services.obs.addObserver(SI_check, "StyleInspector-populated", false);
|
||||
SI_inspectNode();
|
||||
}
|
||||
@ -75,8 +68,8 @@ function SI_checkDefaultStyles()
|
||||
is(propertyVisible("background-color"), true,
|
||||
"span background-color property is visible");
|
||||
|
||||
Services.obs.addObserver(finishUp, "StyleInspector-closed", false);
|
||||
stylePanel.close();
|
||||
stylePanel.destroy();
|
||||
finishUp();
|
||||
}
|
||||
|
||||
function propertyVisible(aName)
|
||||
@ -88,12 +81,11 @@ function propertyVisible(aName)
|
||||
return propView.visible;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
function finishUp()
|
||||
{
|
||||
Services.obs.removeObserver(finishUp, "StyleInspector-closed", false);
|
||||
ok(!stylePanel.isOpen(), "style inspector is closed");
|
||||
doc = stylePanel = null;
|
||||
gBrowser.removeCurrentTab();
|
||||
finish();
|
||||
|
@ -13,19 +13,12 @@ function createDocument()
|
||||
'.matches {color: #F00;}</style>' +
|
||||
'<span id="matches" class="matches">Some styled text</span>';
|
||||
doc.title = "Tests that the no results placeholder works properly";
|
||||
stylePanel = new StyleInspector(window);
|
||||
Services.obs.addObserver(runStyleInspectorTests, "StyleInspector-opened", false);
|
||||
stylePanel.createPanel(false, function() {
|
||||
stylePanel.open(doc.body);
|
||||
});
|
||||
stylePanel = new ComputedViewPanel(window);
|
||||
stylePanel.createPanel(doc.body, runStyleInspectorTests);
|
||||
}
|
||||
|
||||
function runStyleInspectorTests()
|
||||
{
|
||||
Services.obs.removeObserver(runStyleInspectorTests, "StyleInspector-opened", false);
|
||||
|
||||
ok(stylePanel.isOpen(), "style inspector is open");
|
||||
|
||||
Services.obs.addObserver(SI_AddFilterText, "StyleInspector-populated", false);
|
||||
|
||||
let span = doc.querySelector("#matches");
|
||||
@ -90,14 +83,12 @@ function SI_checkPlaceholderHidden()
|
||||
|
||||
is(display, "none", "placeholder is hidden");
|
||||
|
||||
Services.obs.addObserver(finishUp, "StyleInspector-closed", false);
|
||||
stylePanel.close();
|
||||
stylePanel.destroy();
|
||||
finishUp();
|
||||
}
|
||||
|
||||
function finishUp()
|
||||
{
|
||||
Services.obs.removeObserver(finishUp, "StyleInspector-closed", false);
|
||||
ok(!stylePanel.isOpen(), "style inspector is closed");
|
||||
doc = stylePanel = null;
|
||||
gBrowser.removeCurrentTab();
|
||||
finish();
|
||||
|
@ -36,11 +36,13 @@
|
||||
* ***** END LICENSE BLOCK ***** */
|
||||
|
||||
let tempScope = {};
|
||||
Cu.import("resource:///modules/devtools/StyleInspector.jsm", tempScope);
|
||||
Cu.import("resource:///modules/devtools/CssLogic.jsm", tempScope);
|
||||
Cu.import("resource:///modules/devtools/CssHtmlTree.jsm", tempScope);
|
||||
Cu.import("resource://gre/modules/HUDService.jsm", tempScope);
|
||||
let StyleInspector = tempScope.StyleInspector;
|
||||
let HUDService = tempScope.HUDService;
|
||||
let ConsoleUtils = tempScope.ConsoleUtils;
|
||||
let CssLogic = tempScope.CssLogic;
|
||||
let CssHtmlTree = tempScope.CssHtmlTree;
|
||||
|
||||
function log(aMsg)
|
||||
{
|
||||
@ -192,6 +194,149 @@ function tearDown()
|
||||
tab = browser = hudId = hud = filterBox = outputNode = cs = null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Shows the computed view in its own panel.
|
||||
*/
|
||||
function ComputedViewPanel(aContext)
|
||||
{
|
||||
this._init(aContext);
|
||||
}
|
||||
|
||||
ComputedViewPanel.prototype = {
|
||||
_init: function CVP_init(aContext)
|
||||
{
|
||||
this.window = aContext;
|
||||
this.document = this.window.document;
|
||||
this.cssLogic = new CssLogic();
|
||||
this.panelReady = false;
|
||||
this.iframeReady = false;
|
||||
},
|
||||
|
||||
/**
|
||||
* Factory method to create the actual style panel
|
||||
* @param {function} aCallback (optional) callback to fire when ready.
|
||||
*/
|
||||
createPanel: function SI_createPanel(aSelection, aCallback)
|
||||
{
|
||||
let popupSet = this.document.getElementById("mainPopupSet");
|
||||
let panel = this.document.createElement("panel");
|
||||
|
||||
panel.setAttribute("class", "styleInspector");
|
||||
panel.setAttribute("orient", "vertical");
|
||||
panel.setAttribute("ignorekeys", "true");
|
||||
panel.setAttribute("noautofocus", "true");
|
||||
panel.setAttribute("noautohide", "true");
|
||||
panel.setAttribute("titlebar", "normal");
|
||||
panel.setAttribute("close", "true");
|
||||
panel.setAttribute("label", "Computed View");
|
||||
panel.setAttribute("width", 350);
|
||||
panel.setAttribute("height", this.window.screen.height / 2);
|
||||
|
||||
this._openCallback = aCallback;
|
||||
this.selectedNode = aSelection;
|
||||
|
||||
let iframe = this.document.createElement("iframe");
|
||||
let boundIframeOnLoad = function loadedInitializeIframe()
|
||||
{
|
||||
this.iframeReady = true;
|
||||
this.iframe.removeEventListener("load", boundIframeOnLoad, true);
|
||||
this.panel.openPopup(this.window.gBrowser.selectedBrowser, "end_before", 0, 0, false, false);
|
||||
}.bind(this);
|
||||
|
||||
iframe.flex = 1;
|
||||
iframe.setAttribute("tooltip", "aHTMLTooltip");
|
||||
iframe.addEventListener("load", boundIframeOnLoad, true);
|
||||
iframe.setAttribute("src", "chrome://browser/content/devtools/csshtmltree.xul");
|
||||
|
||||
panel.appendChild(iframe);
|
||||
popupSet.appendChild(panel);
|
||||
|
||||
this._boundPopupShown = this.popupShown.bind(this);
|
||||
panel.addEventListener("popupshown", this._boundPopupShown, false);
|
||||
|
||||
this.panel = panel;
|
||||
this.iframe = iframe;
|
||||
|
||||
return panel;
|
||||
},
|
||||
|
||||
/**
|
||||
* Event handler for the popupshown event.
|
||||
*/
|
||||
popupShown: function SI_popupShown()
|
||||
{
|
||||
this.panelReady = true;
|
||||
this.cssHtmlTree = new CssHtmlTree(this);
|
||||
let selectedNode = this.selectedNode || null;
|
||||
this.cssLogic.highlight(selectedNode);
|
||||
this.cssHtmlTree.highlight(selectedNode);
|
||||
if (this._openCallback) {
|
||||
this._openCallback();
|
||||
delete this._openCallback;
|
||||
}
|
||||
},
|
||||
|
||||
isLoaded: function SI_isLoaded()
|
||||
{
|
||||
return this.iframeReady && this.panelReady;
|
||||
},
|
||||
|
||||
/**
|
||||
* Select from Path (via CssHtmlTree_pathClick)
|
||||
* @param aNode The node to inspect.
|
||||
*/
|
||||
selectFromPath: function SI_selectFromPath(aNode)
|
||||
{
|
||||
this.selectNode(aNode);
|
||||
},
|
||||
|
||||
/**
|
||||
* Select a node to inspect in the Style Inspector panel
|
||||
* @param aNode The node to inspect.
|
||||
*/
|
||||
selectNode: function SI_selectNode(aNode)
|
||||
{
|
||||
this.selectedNode = aNode;
|
||||
|
||||
if (this.isLoaded()) {
|
||||
this.cssLogic.highlight(aNode);
|
||||
this.cssHtmlTree.highlight(aNode);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Destroy the style panel, remove listeners etc.
|
||||
*/
|
||||
destroy: function SI_destroy()
|
||||
{
|
||||
this.panel.hidePopup();
|
||||
|
||||
if (this.cssHtmlTree) {
|
||||
this.cssHtmlTree.destroy();
|
||||
delete this.cssHtmlTree;
|
||||
}
|
||||
|
||||
if (this.iframe) {
|
||||
this.iframe.parentNode.removeChild(this.iframe);
|
||||
delete this.iframe;
|
||||
}
|
||||
|
||||
delete this.cssLogic;
|
||||
this.panel.removeEventListener("popupshown", this._boundPopupShown, false);
|
||||
delete this._boundPopupShown;
|
||||
this.panel.parentNode.removeChild(this.panel);
|
||||
delete this.panel;
|
||||
delete this.doc;
|
||||
delete this.win;
|
||||
delete CssHtmlTree.win;
|
||||
},
|
||||
};
|
||||
|
||||
function ruleView()
|
||||
{
|
||||
return InspectorUI.sidebar._toolContext("ruleview").view;
|
||||
}
|
||||
|
||||
registerCleanupFunction(tearDown);
|
||||
|
||||
waitForExplicitFinish();
|
||||
|
@ -16,15 +16,12 @@ function test() {
|
||||
|
||||
createTab(function() {
|
||||
let id = TiltUtils.getWindowId(gBrowser.selectedBrowser.contentWindow);
|
||||
let initialActiveElement;
|
||||
|
||||
is(id, Tilt.currentWindowId,
|
||||
"The unique window identifiers should match for the same window.");
|
||||
|
||||
createTilt({
|
||||
onInspectorOpen: function() {
|
||||
initialActiveElement = document.activeElement;
|
||||
|
||||
is(Tilt.visualizers[id], null,
|
||||
"A instance of the visualizer shouldn't be initialized yet.");
|
||||
},
|
||||
@ -40,8 +37,8 @@ function test() {
|
||||
},
|
||||
onTiltClose: function()
|
||||
{
|
||||
is(document.activeElement, initialActiveElement,
|
||||
"The focus wasn't correctly given back to the initial element.");
|
||||
is(document.activeElement, gBrowser.selectedBrowser,
|
||||
"The focus wasn't correctly given back to the selectedBrowser.");
|
||||
|
||||
is(Tilt.visualizers[id], null,
|
||||
"The current instance of the visualizer wasn't destroyed properly.");
|
||||
|
@ -606,14 +606,11 @@ just addresses the organization to follow, e.g. "This site is run by " -->
|
||||
<!ENTITY addonBarCloseButton.tooltip "Close Add-on Bar">
|
||||
<!ENTITY toggleAddonBarCmd.key "/">
|
||||
|
||||
<!-- LOCALIZATION NOTE (htmlPanel.label): This is a label for a button that
|
||||
activates the Web Developer->Inspect UI's HTML Tree Panel. -->
|
||||
<!ENTITY htmlPanel.label "HTML">
|
||||
|
||||
<!-- LOCALIZATION NOTE (htmlPanel.tooltiptext): The text that appears when a user
|
||||
hovers over the HTML panel's toolbar button. -->
|
||||
<!ENTITY htmlPanel.tooltiptext "HTML panel">
|
||||
|
||||
<!-- LOCALIZATION NOTE (htmlPanel.accesskey): The key bound to the HTML panel's
|
||||
<!-- LOCALIZATION NOTE (markupButton.arialabel): The markup button is the button
|
||||
located in front of the breadcrumbs display in the inspector toolbar. The button
|
||||
doesn't display any label, but exposes a label to screen-readers with "aria-label".
|
||||
-->
|
||||
<!ENTITY markupButton.arialabel "Markup">
|
||||
<!-- LOCALIZATION NOTE (markupButton.accesskey): The key bound to the Markup panel's
|
||||
toolbar button -->
|
||||
<!ENTITY htmlPanel.accesskey "H">
|
||||
<!ENTITY markupButton.accesskey "M">
|
||||
|
@ -20,19 +20,21 @@ breadcrumbs.siblings=Siblings
|
||||
# LOCALIZATION NOTE (htmlPanel): Used in the Inspector tool's openInspectorUI
|
||||
# method when registering the HTML panel.
|
||||
|
||||
# LOCALIZATION NOTE (ruleView.*): Button label, accesskey and tooltip text
|
||||
# associated with the Highlighter's CSS Rule View in the Style Sidebar.
|
||||
ruleView.label=Rules
|
||||
ruleView.accesskey=R
|
||||
ruleView.tooltiptext=View and Edit CSS
|
||||
|
||||
# LOCALIZATION NOTE (inspectButton.tooltiptext):
|
||||
# This button appears in the Inspector Toolbar. inspectButton is stateful,
|
||||
# if it's pressed users can select an element with the mouse. Pressing the
|
||||
# "Return" key # changes that state. %S is the keyboard shortcut (VK_RETURN in
|
||||
# chrome://global/locale/keys.properties).
|
||||
# if it's pressed users can select an element with the mouse.
|
||||
# %S is the keyboard shortcut.
|
||||
inspectButton.tooltiptext=Select element with mouse (%S)
|
||||
|
||||
# LOCALIZATION NOTE (markupButton.*):
|
||||
# This button is the button located at the beginning of the breadcrumbs
|
||||
# in the inspector toolbar. Its tooltip is built dynamically.
|
||||
# markupButton.tooltip is used on Mac.
|
||||
# On Windows and Linux, we use markupButton.tooltipWithAccesskey, where we append
|
||||
# the keyboard shortcut.
|
||||
markupButton.tooltip=Markup Panel
|
||||
markupButton.tooltipWithAccesskey=Markup Panel (%S)
|
||||
|
||||
|
||||
# LOCALIZATION NOTE (nodeMenu.tooltiptext)
|
||||
# This menu appears in the Infobar (on top of the highlighted node) once
|
||||
|
@ -121,3 +121,13 @@ rule.contextmenu.copypropertyvalue=Copy property value
|
||||
# LOCALIZATION NOTE (rule.contextmenu.copypropertyvalue.accesskey): The rule
|
||||
# view's context menu copy property value access key.
|
||||
rule.contextmenu.copypropertyvalue.accesskey=U
|
||||
|
||||
# LOCALIZATION NOTE (ruleView.*): Button label, accesskey and tooltip text
|
||||
# associated with the Highlighter's CSS Rule View in the Style Sidebar.
|
||||
ruleView.label=Rules
|
||||
ruleView.accesskey=R
|
||||
ruleView.tooltiptext=View and Edit CSS
|
||||
|
||||
# LOCALIZATION NOTE (ruleView.empty): Text displayed when the highlighter is
|
||||
# first opened and there's no node selected in the rule view.
|
||||
rule.empty=No element selected.
|
||||
|
@ -2167,7 +2167,7 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
/* Highlighter toolbar - breadcrumbs */
|
||||
|
||||
#inspector-breadcrumbs {
|
||||
padding: 0 3px;
|
||||
-moz-margin-end: 3px;
|
||||
/* A fake 1px-shadow is included in the border-images of the
|
||||
inspector-breadcrumbs-buttons, to match toolbar-buttons style.
|
||||
This negative margin compensate the extra row of pixels created
|
||||
@ -2178,6 +2178,44 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
#inspector-breadcrumbs > .scrollbutton-up,
|
||||
#inspector-breadcrumbs > .scrollbutton-down {
|
||||
-moz-appearance: none;
|
||||
border: 1px solid hsla(210,8%,5%,.45);
|
||||
background: -moz-linear-gradient(hsla(212,7%,57%,.35), hsla(212,7%,57%,.1)) padding-box;
|
||||
box-shadow: 0 1px 0 hsla(210,16%,76%,.15) inset, 0 0 0 1px hsla(210,16%,76%,.15) inset, 0 1px 0 hsla(210,16%,76%,.15);
|
||||
margin: 0 0 1px;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up {
|
||||
-moz-border-start-width: 0;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up:not([disabled]):active:hover,
|
||||
#inspector-breadcrumbs > .scrollbutton-down:not([disabled]):active:hover {
|
||||
border-color: hsla(210,8%,5%,.6);
|
||||
background: -moz-linear-gradient(hsla(220,6%,10%,.3), hsla(212,7%,57%,.15) 65%, hsla(212,7%,57%,.3));
|
||||
box-shadow: 0 0 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15);
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up:not([disabled]):active:hover > .toolbarbutton-icon,
|
||||
#inspector-breadcrumbs > .scrollbutton-down:not([disabled]):active:hover > .toolbarbutton-icon {
|
||||
-moz-image-region: rect(0px 14px 16px 7px);
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up > .toolbarbutton-icon,
|
||||
#inspector-breadcrumbs > .scrollbutton-down > .toolbarbutton-icon {
|
||||
-moz-appearance: none;
|
||||
list-style-image: url("chrome://browser/skin/devtools/breadcrumbs-scrollbutton.png");
|
||||
-moz-image-region: rect(0px 7px 16px 0px);
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up[disabled] > .toolbarbutton-icon,
|
||||
#inspector-breadcrumbs > .scrollbutton-down[disabled] > .toolbarbutton-icon {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up > .toolbarbutton-icon:-moz-locale-dir(rtl),
|
||||
#inspector-breadcrumbs > .scrollbutton-down > .toolbarbutton-icon:-moz-locale-dir(ltr) {
|
||||
-moz-transform: scaleX(-1);
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button {
|
||||
@ -2186,7 +2224,7 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
border-style: solid;
|
||||
border-width: 1px 13px 2px 13px;
|
||||
color: hsl(210,30%,85%);
|
||||
max-width: 85px;
|
||||
width: 85px; /* Can't use max-width. See bug 723132 */
|
||||
/* The content of the button can be larger than the button */
|
||||
overflow: hidden;
|
||||
min-height: 25px;
|
||||
@ -2195,6 +2233,10 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
padding: 0 9px;
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button:-moz-focusring > label {
|
||||
border-bottom: 1px dotted hsla(210,30%,85%,0.4);
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button[checked] > .inspector-breadcrumbs-tag {
|
||||
color: hsl(208,100%,60%);
|
||||
}
|
||||
@ -2220,6 +2262,7 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
|
||||
.inspector-breadcrumbs-button:-moz-locale-dir(ltr):first-of-type {
|
||||
margin-left: 0;
|
||||
border-left-width: 0;
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button {
|
||||
@ -2262,6 +2305,10 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
-moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end.png") 1 13 2 13 fill stretch;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs[overflows] > .inspector-breadcrumbs-button:-moz-locale-dir(ltr):last-of-type {
|
||||
border-right-width: 0;
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button[siblings-menu-open]:last-of-type:not([checked]),
|
||||
.inspector-breadcrumbs-button:last-of-type:not([checked]):hover:active {
|
||||
-moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end-pressed.png") 1 13 2 13 fill stretch;
|
||||
@ -2280,6 +2327,7 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
|
||||
.inspector-breadcrumbs-button:-moz-locale-dir(rtl):first-of-type {
|
||||
margin-right: 0;
|
||||
border-right-width: 0;
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button:-moz-locale-dir(rtl) {
|
||||
@ -2322,6 +2370,10 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
-moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end.png") 1 13 2 13 fill stretch;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs[overflows] > .inspector-breadcrumbs-button:last-of-type:-moz-locale-dir(rtl) {
|
||||
border-left-width: 0;
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button[siblings-menu-open]:last-of-type:not([checked]):-moz-locale-dir(rtl),
|
||||
.inspector-breadcrumbs-button:last-of-type:not([checked]):hover:active:-moz-locale-dir(rtl) {
|
||||
-moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end-pressed.png") 1 13 2 13 fill stretch;
|
||||
@ -2338,6 +2390,26 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
|
||||
/* Highlighter toolbar - HTML Tree */
|
||||
|
||||
#inspector-treepanel-toolbutton {
|
||||
list-style-image: url("chrome://browser/skin/devtools/treepanel-button.png");
|
||||
-moz-margin-end: 0;
|
||||
-moz-image-region: rect(0px 18px 16px 0px);
|
||||
}
|
||||
|
||||
#inspector-treepanel-toolbutton[checked] {
|
||||
-moz-image-region: rect(0px 36px 16px 18px);
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-down:-moz-locale-dir(rtl),
|
||||
#inspector-treepanel-toolbutton:-moz-locale-dir(ltr) {
|
||||
border-radius: 3px 0 0 3px;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-down:-moz-locale-dir(ltr),
|
||||
#inspector-treepanel-toolbutton:-moz-locale-dir(rtl) {
|
||||
border-radius: 0 3px 3px 0;
|
||||
}
|
||||
|
||||
#inspector-tree-splitter {
|
||||
-moz-appearance: none;
|
||||
border-top: 1px solid black;
|
||||
|
BIN
browser/themes/gnomestripe/devtools/breadcrumbs-scrollbutton.png
Normal file
BIN
browser/themes/gnomestripe/devtools/breadcrumbs-scrollbutton.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 545 B |
@ -57,6 +57,11 @@
|
||||
margin: 0 3px;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton:-moz-focusring {
|
||||
outline: 1px dotted hsla(210,30%,85%,0.4);
|
||||
outline-offset: -4px;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton:not([label]) {
|
||||
min-width: 32px;
|
||||
}
|
||||
|
BIN
browser/themes/gnomestripe/devtools/treepanel-button.png
Normal file
BIN
browser/themes/gnomestripe/devtools/treepanel-button.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 805 B |
@ -103,6 +103,7 @@ browser.jar:
|
||||
skin/classic/browser/devtools/orion-task.png (devtools/orion-task.png)
|
||||
skin/classic/browser/devtools/orion-breakpoint.png (devtools/orion-breakpoint.png)
|
||||
skin/classic/browser/devtools/orion-debug-location.png (devtools/orion-debug-location.png)
|
||||
skin/classic/browser/devtools/breadcrumbs-scrollbutton.png (devtools/breadcrumbs-scrollbutton.png)
|
||||
skin/classic/browser/devtools/breadcrumbs/ltr-end-pressed.png (devtools/breadcrumbs/ltr-end-pressed.png)
|
||||
skin/classic/browser/devtools/breadcrumbs/ltr-end-selected-pressed.png (devtools/breadcrumbs/ltr-end-selected-pressed.png)
|
||||
skin/classic/browser/devtools/breadcrumbs/ltr-end-selected.png (devtools/breadcrumbs/ltr-end-selected.png)
|
||||
@ -136,6 +137,7 @@ browser.jar:
|
||||
skin/classic/browser/devtools/itemArrow-ltr.png (devtools/itemArrow-ltr.png)
|
||||
skin/classic/browser/devtools/inspect-button.png (devtools/inspect-button.png)
|
||||
skin/classic/browser/devtools/dropmarker.png (devtools/dropmarker.png)
|
||||
skin/classic/browser/devtools/treepanel-button.png (devtools/treepanel-button.png)
|
||||
#ifdef MOZ_SERVICES_SYNC
|
||||
skin/classic/browser/sync-16-throbber.png
|
||||
skin/classic/browser/sync-16.png
|
||||
|
@ -2912,7 +2912,7 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
/* Highlighter toolbar - breadcrumbs */
|
||||
|
||||
#inspector-breadcrumbs {
|
||||
padding: 0 6px;
|
||||
-moz-margin-end: 3px;
|
||||
/* A fake 1px-shadow is included in the border-images of the
|
||||
inspector-breadcrumbs-buttons, to match toolbar-buttons style.
|
||||
This negative margin compensate the extra row of pixels created
|
||||
@ -2920,12 +2920,55 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up,
|
||||
#inspector-breadcrumbs > .scrollbutton-down {
|
||||
-moz-appearance: none;
|
||||
border: 1px solid hsla(210,8%,5%,.45);
|
||||
background: -moz-linear-gradient(hsla(212,7%,57%,.35), hsla(212,7%,57%,.1)) padding-box;
|
||||
box-shadow: 0 1px 0 hsla(210,16%,76%,.15) inset, 0 0 0 1px hsla(210,16%,76%,.15) inset, 0 1px 0 hsla(210,16%,76%,.15);
|
||||
margin: 0 0 1px;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up {
|
||||
-moz-border-start-width: 0;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up:not([disabled]):active:hover,
|
||||
#inspector-breadcrumbs > .scrollbutton-down:not([disabled]):active:hover {
|
||||
border-color: hsla(210,8%,5%,.6);
|
||||
background: -moz-linear-gradient(hsla(220,6%,10%,.3), hsla(212,7%,57%,.15) 65%, hsla(212,7%,57%,.3));
|
||||
box-shadow: 0 0 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15);
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up > .toolbarbutton-icon,
|
||||
#inspector-breadcrumbs > .scrollbutton-down > .toolbarbutton-icon {
|
||||
-moz-appearance: none;
|
||||
list-style-image: url("chrome://browser/skin/devtools/breadcrumbs-scrollbutton.png");
|
||||
-moz-image-region: rect(0px 7px 16px 0px);
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up[disabled] > .toolbarbutton-icon,
|
||||
#inspector-breadcrumbs > .scrollbutton-down[disabled] > .toolbarbutton-icon {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up:not([disabled]):active:hover > .toolbarbutton-icon,
|
||||
#inspector-breadcrumbs > .scrollbutton-down:not([disabled]):active:hover > .toolbarbutton-icon {
|
||||
-moz-image-region: rect(0px 14px 16px 7px);
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up > .toolbarbutton-icon:-moz-locale-dir(rtl),
|
||||
#inspector-breadcrumbs > .scrollbutton-down > .toolbarbutton-icon:-moz-locale-dir(ltr) {
|
||||
-moz-transform: scaleX(-1);
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button {
|
||||
-moz-appearance: none;
|
||||
border-style: solid;
|
||||
border-width: 1px 13px 2px 13px;
|
||||
color: hsl(210,30%,85%);
|
||||
max-width: 85px;
|
||||
width: 85px; /* Can't use max-width. See bug 723132 */
|
||||
/* The content of the button can be larger than the button */
|
||||
overflow: hidden;
|
||||
min-height: 25px;
|
||||
@ -2934,6 +2977,10 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
padding: 0 9px;
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button:-moz-focusring > label {
|
||||
border-bottom: 1px dotted hsla(210,30%,85%,0.4);
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button[checked] > .inspector-breadcrumbs-tag {
|
||||
color: hsl(208,100%,60%);
|
||||
}
|
||||
@ -2958,7 +3005,7 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
/* Highlighter toolbar - breadcrumbs - LTR */
|
||||
|
||||
.inspector-breadcrumbs-button:-moz-locale-dir(ltr):first-of-type {
|
||||
margin-left: 0;
|
||||
border-left-width: 0;
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button {
|
||||
@ -3001,6 +3048,10 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
-moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end.png") 1 13 2 13 fill stretch;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs[overflows] > .inspector-breadcrumbs-button:-moz-locale-dir(ltr):last-of-type {
|
||||
border-right-width: 0;
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button[siblings-menu-open]:last-of-type:not([checked]),
|
||||
.inspector-breadcrumbs-button:last-of-type:not([checked]):hover:active {
|
||||
-moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end-pressed.png") 1 13 2 13 fill stretch;
|
||||
@ -3018,7 +3069,7 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
/* Highlighter toolbar - breadcrumbs - RTL */
|
||||
|
||||
.inspector-breadcrumbs-button:-moz-locale-dir(rtl):first-of-type {
|
||||
margin-right: 0;
|
||||
border-right-width: 0;
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button:-moz-locale-dir(rtl) {
|
||||
@ -3061,6 +3112,10 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
-moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end.png") 1 13 2 13 fill stretch;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs[overflows] > .inspector-breadcrumbs-button:last-of-type:-moz-locale-dir(rtl) {
|
||||
border-left-width: 0;
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button[siblings-menu-open]:last-of-type:not([checked]):-moz-locale-dir(rtl),
|
||||
.inspector-breadcrumbs-button:last-of-type:not([checked]):hover:active:-moz-locale-dir(rtl) {
|
||||
-moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end-pressed.png") 1 13 2 13 fill stretch;
|
||||
@ -3077,6 +3132,26 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
|
||||
/* Highlighter toolbar - HTML Tree */
|
||||
|
||||
#inspector-treepanel-toolbutton {
|
||||
list-style-image: url("chrome://browser/skin/devtools/treepanel-button.png");
|
||||
-moz-margin-end: 0;
|
||||
-moz-image-region: rect(0px 18px 16px 0px);
|
||||
}
|
||||
|
||||
#inspector-treepanel-toolbutton[checked] {
|
||||
-moz-image-region: rect(0px 36px 16px 18px);
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-down:-moz-locale-dir(rtl),
|
||||
#inspector-treepanel-toolbutton:-moz-locale-dir(ltr) {
|
||||
border-radius: @toolbarbuttonCornerRadius@ 0 0 @toolbarbuttonCornerRadius@;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-down:-moz-locale-dir(ltr),
|
||||
#inspector-treepanel-toolbutton:-moz-locale-dir(rtl) {
|
||||
border-radius: 0 @toolbarbuttonCornerRadius@ @toolbarbuttonCornerRadius@ 0;
|
||||
}
|
||||
|
||||
#inspector-tree-splitter {
|
||||
-moz-appearance: none;
|
||||
border-top: 1px solid black;
|
||||
|
BIN
browser/themes/pinstripe/devtools/breadcrumbs-scrollbutton.png
Normal file
BIN
browser/themes/pinstripe/devtools/breadcrumbs-scrollbutton.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 545 B |
@ -58,6 +58,11 @@
|
||||
box-shadow: 0 1px 0 hsla(210,16%,76%,.15) inset, 0 0 0 1px hsla(210,16%,76%,.15) inset, 0 1px 0 hsla(210,16%,76%,.15);
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton:-moz-focusring {
|
||||
outline: 1px dotted hsla(210,30%,85%,0.4);
|
||||
outline-offset: -4px;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton > .toolbarbutton-text {
|
||||
margin: 1px 6px;
|
||||
}
|
||||
|
BIN
browser/themes/pinstripe/devtools/treepanel-button.png
Normal file
BIN
browser/themes/pinstripe/devtools/treepanel-button.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 805 B |
@ -143,6 +143,7 @@ browser.jar:
|
||||
* skin/classic/browser/devtools/webconsole.css (devtools/webconsole.css)
|
||||
skin/classic/browser/devtools/webconsole_networkpanel.css (devtools/webconsole_networkpanel.css)
|
||||
skin/classic/browser/devtools/webconsole.png (devtools/webconsole.png)
|
||||
skin/classic/browser/devtools/breadcrumbs-scrollbutton.png (devtools/breadcrumbs-scrollbutton.png)
|
||||
skin/classic/browser/devtools/breadcrumbs/ltr-end-pressed.png (devtools/breadcrumbs/ltr-end-pressed.png)
|
||||
skin/classic/browser/devtools/breadcrumbs/ltr-end-selected-pressed.png (devtools/breadcrumbs/ltr-end-selected-pressed.png)
|
||||
skin/classic/browser/devtools/breadcrumbs/ltr-end-selected.png (devtools/breadcrumbs/ltr-end-selected.png)
|
||||
@ -177,6 +178,7 @@ browser.jar:
|
||||
skin/classic/browser/devtools/background-noise-toolbar.png (devtools/background-noise-toolbar.png)
|
||||
skin/classic/browser/devtools/inspect-button.png (devtools/inspect-button.png)
|
||||
skin/classic/browser/devtools/dropmarker.png (devtools/dropmarker.png)
|
||||
skin/classic/browser/devtools/treepanel-button.png (devtools/treepanel-button.png)
|
||||
#ifdef MOZ_SERVICES_SYNC
|
||||
skin/classic/browser/sync-throbber.png
|
||||
skin/classic/browser/sync-16.png
|
||||
|
@ -2834,7 +2834,7 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
/* Highlighter toolbar - breadcrumbs */
|
||||
|
||||
#inspector-breadcrumbs {
|
||||
padding: 0 6px;
|
||||
-moz-margin-end: 3px;
|
||||
/* A fake 1px-shadow is included in the border-images of the
|
||||
inspector-breadcrumbs-buttons, to match toolbar-buttons style.
|
||||
This negative margin compensate the extra row of pixels created
|
||||
@ -2845,6 +2845,44 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
#inspector-breadcrumbs > .scrollbutton-up,
|
||||
#inspector-breadcrumbs > .scrollbutton-down {
|
||||
-moz-appearance: none;
|
||||
border: 1px solid hsla(210,8%,5%,.45);
|
||||
background: -moz-linear-gradient(hsla(212,7%,57%,.35), hsla(212,7%,57%,.1)) padding-box;
|
||||
box-shadow: 0 1px 0 hsla(210,16%,76%,.15) inset, 0 0 0 1px hsla(210,16%,76%,.15) inset, 0 1px 0 hsla(210,16%,76%,.15);
|
||||
margin: 0 0 1px;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up {
|
||||
-moz-border-start-width: 0;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up:not([disabled]):active:hover,
|
||||
#inspector-breadcrumbs > .scrollbutton-down:not([disabled]):active:hover {
|
||||
border-color: hsla(210,8%,5%,.6);
|
||||
background: -moz-linear-gradient(hsla(220,6%,10%,.3), hsla(212,7%,57%,.15) 65%, hsla(212,7%,57%,.3));
|
||||
box-shadow: 0 0 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15);
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up > .toolbarbutton-icon,
|
||||
#inspector-breadcrumbs > .scrollbutton-down > .toolbarbutton-icon {
|
||||
-moz-appearance: none;
|
||||
list-style-image: url("chrome://browser/skin/devtools/breadcrumbs-scrollbutton.png");
|
||||
-moz-image-region: rect(0px 7px 16px 0px);
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up[disabled] > .toolbarbutton-icon,
|
||||
#inspector-breadcrumbs > .scrollbutton-down[disabled] > .toolbarbutton-icon {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up:not([disabled]):active:hover > .toolbarbutton-icon,
|
||||
#inspector-breadcrumbs > .scrollbutton-down:not([disabled]):active:hover > .toolbarbutton-icon {
|
||||
-moz-image-region: rect(0px 14px 16px 7px);
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-up > .toolbarbutton-icon:-moz-locale-dir(rtl),
|
||||
#inspector-breadcrumbs > .scrollbutton-down > .toolbarbutton-icon:-moz-locale-dir(ltr) {
|
||||
-moz-transform: scaleX(-1);
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button {
|
||||
@ -2854,7 +2892,7 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
border-width: 2px 13px;
|
||||
outline: none;
|
||||
color: hsl(210,30%,85%);
|
||||
max-width: 85px;
|
||||
width: 85px; /* Can't use max-width. See bug 723132 */
|
||||
/* The content of the button can be larger than the button */
|
||||
overflow: hidden;
|
||||
min-height: 25px;
|
||||
@ -2862,6 +2900,10 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
padding: 0 9px;
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button:-moz-focusring > label {
|
||||
border-bottom: 1px dotted hsla(210,30%,85%,0.4);
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button[checked] > .inspector-breadcrumbs-tag {
|
||||
color: hsl(200,100%,60%);
|
||||
}
|
||||
@ -2886,7 +2928,7 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
/* Highlighter toolbar - breadcrumbs - LTR */
|
||||
|
||||
.inspector-breadcrumbs-button:-moz-locale-dir(ltr):first-of-type {
|
||||
margin-left: 0;
|
||||
border-left-width: 0;
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button {
|
||||
@ -2929,6 +2971,10 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
-moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end.png") 2 13 2 13 fill stretch;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs[overflows] > .inspector-breadcrumbs-button:-moz-locale-dir(ltr):last-of-type {
|
||||
border-right-width: 0;
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button[siblings-menu-open]:last-of-type:not([checked]),
|
||||
.inspector-breadcrumbs-button:last-of-type:not([checked]):hover:active {
|
||||
-moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end-pressed.png") 2 13 2 13 fill stretch;
|
||||
@ -2946,7 +2992,7 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
/* Highlighter toolbar - breadcrumbs - RTL */
|
||||
|
||||
.inspector-breadcrumbs-button:-moz-locale-dir(rtl):first-of-type {
|
||||
margin-right: 0;
|
||||
border-right-width: 0;
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button:-moz-locale-dir(rtl) {
|
||||
@ -2989,6 +3035,10 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
-moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end.png") 2 13 2 13 fill stretch;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs[overflows] > .inspector-breadcrumbs-button:last-of-type:-moz-locale-dir(rtl) {
|
||||
border-left-width: 0;
|
||||
}
|
||||
|
||||
.inspector-breadcrumbs-button[siblings-menu-open]:last-of-type:not([checked]):-moz-locale-dir(rtl),
|
||||
.inspector-breadcrumbs-button:last-of-type:not([checked]):hover:active:-moz-locale-dir(rtl) {
|
||||
-moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end-pressed.png") 2 13 2 13 fill stretch;
|
||||
@ -3005,6 +3055,26 @@ html|*#highlighter-nodeinfobar-pseudo-classes {
|
||||
|
||||
/* Highlighter toolbar - HTML Tree */
|
||||
|
||||
#inspector-treepanel-toolbutton {
|
||||
list-style-image: url("chrome://browser/skin/devtools/treepanel-button.png");
|
||||
-moz-margin-end: 0;
|
||||
-moz-image-region: rect(0px 18px 16px 0px);
|
||||
}
|
||||
|
||||
#inspector-treepanel-toolbutton[checked] {
|
||||
-moz-image-region: rect(0px 36px 16px 18px);
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-down:-moz-locale-dir(rtl),
|
||||
#inspector-treepanel-toolbutton:-moz-locale-dir(ltr) {
|
||||
border-radius: 3px 0 0 3px;
|
||||
}
|
||||
|
||||
#inspector-breadcrumbs > .scrollbutton-down:-moz-locale-dir(ltr),
|
||||
#inspector-treepanel-toolbutton:-moz-locale-dir(rtl) {
|
||||
border-radius: 0 3px 3px 0;
|
||||
}
|
||||
|
||||
#inspector-tree-splitter {
|
||||
-moz-appearance: none;
|
||||
border-top: 1px solid black;
|
||||
|
BIN
browser/themes/winstripe/devtools/breadcrumbs-scrollbutton.png
Normal file
BIN
browser/themes/winstripe/devtools/breadcrumbs-scrollbutton.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 545 B |
@ -57,6 +57,11 @@
|
||||
-moz-margin-end: 3px;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton:-moz-focusring {
|
||||
outline: 1px dotted hsla(210,30%,85%,0.4);
|
||||
outline-offset: -4px;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton > .toolbarbutton-icon {
|
||||
margin: 0;
|
||||
}
|
||||
|
BIN
browser/themes/winstripe/devtools/treepanel-button.png
Normal file
BIN
browser/themes/winstripe/devtools/treepanel-button.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 805 B |
@ -130,6 +130,7 @@ browser.jar:
|
||||
skin/classic/browser/devtools/webconsole.css (devtools/webconsole.css)
|
||||
skin/classic/browser/devtools/webconsole_networkpanel.css (devtools/webconsole_networkpanel.css)
|
||||
skin/classic/browser/devtools/webconsole.png (devtools/webconsole.png)
|
||||
skin/classic/browser/devtools/breadcrumbs-scrollbutton.png (devtools/breadcrumbs-scrollbutton.png)
|
||||
skin/classic/browser/devtools/breadcrumbs/ltr-end-pressed.png (devtools/breadcrumbs/ltr-end-pressed.png)
|
||||
skin/classic/browser/devtools/breadcrumbs/ltr-end-selected-pressed.png (devtools/breadcrumbs/ltr-end-selected-pressed.png)
|
||||
skin/classic/browser/devtools/breadcrumbs/ltr-end-selected.png (devtools/breadcrumbs/ltr-end-selected.png)
|
||||
@ -163,6 +164,7 @@ browser.jar:
|
||||
skin/classic/browser/devtools/itemArrow-ltr.png (devtools/itemArrow-ltr.png)
|
||||
skin/classic/browser/devtools/inspect-button.png (devtools/inspect-button.png)
|
||||
skin/classic/browser/devtools/dropmarker.png (devtools/dropmarker.png)
|
||||
skin/classic/browser/devtools/treepanel-button.png (devtools/treepanel-button.png)
|
||||
#ifdef MOZ_SERVICES_SYNC
|
||||
skin/classic/browser/sync-throbber.png
|
||||
skin/classic/browser/sync-16.png
|
||||
@ -308,6 +310,7 @@ browser.jar:
|
||||
skin/classic/aero/browser/devtools/webconsole.css (devtools/webconsole.css)
|
||||
skin/classic/aero/browser/devtools/webconsole_networkpanel.css (devtools/webconsole_networkpanel.css)
|
||||
skin/classic/aero/browser/devtools/webconsole.png (devtools/webconsole.png)
|
||||
skin/classic/aero/browser/devtools/breadcrumbs-scrollbutton.png (devtools/breadcrumbs-scrollbutton.png)
|
||||
skin/classic/aero/browser/devtools/breadcrumbs/ltr-end-pressed.png (devtools/breadcrumbs/ltr-end-pressed.png)
|
||||
skin/classic/aero/browser/devtools/breadcrumbs/ltr-end-selected-pressed.png (devtools/breadcrumbs/ltr-end-selected-pressed.png)
|
||||
skin/classic/aero/browser/devtools/breadcrumbs/ltr-end-selected.png (devtools/breadcrumbs/ltr-end-selected.png)
|
||||
@ -341,6 +344,7 @@ browser.jar:
|
||||
skin/classic/aero/browser/devtools/itemArrow-ltr.png (devtools/itemArrow-ltr.png)
|
||||
skin/classic/aero/browser/devtools/inspect-button.png (devtools/inspect-button.png)
|
||||
skin/classic/aero/browser/devtools/dropmarker.png (devtools/dropmarker.png)
|
||||
skin/classic/aero/browser/devtools/treepanel-button.png (devtools/treepanel-button.png)
|
||||
#ifdef MOZ_SERVICES_SYNC
|
||||
skin/classic/aero/browser/sync-throbber.png
|
||||
skin/classic/aero/browser/sync-16.png
|
||||
|
Loading…
Reference in New Issue
Block a user