Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-10-26 19:55:39 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 952511 - markupview still change attribute values. r=pbrosset

Browse Source
This commit is contained in:
Michael Ratcliffe 2014-01-10 17:55:58 +00:00
parent 0e4a452417
commit 354780772e
2 changed files with 12 additions and 112 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

122
browser/devtools/markupview/markup-view.js
View File

@ -21,7 +21,6 @@ const {UndoStack} = require("devtools/shared/undo");
const {editableField, InplaceEditor} = require("devtools/shared/inplace-editor");
const {gDevTools} = Cu.import("resource:///modules/devtools/gDevTools.jsm", {});
const {HTMLEditor} = require("devtools/markupview/html-editor");
const {OutputParser} = require("devtools/output-parser");
const promise = require("sdk/core/promise");
const {Tooltip} = require("devtools/shared/widgets/Tooltip");
const EventEmitter = require("devtools/shared/event-emitter");
@ -65,7 +64,6 @@ function MarkupView(aInspector, aFrame, aControllerWindow) {
this._frame = aFrame;
this.doc = this._frame.contentDocument;
this._elt = this.doc.querySelector("#root");
this._outputParser = new OutputParser();
this.htmlEditor = new HTMLEditor(this.doc);
this.layoutHelpers = new LayoutHelpers(this.doc.defaultView);
@ -102,9 +100,6 @@ function MarkupView(aInspector, aFrame, aControllerWindow) {
this._boundFocus = this._onFocus.bind(this);
this._frame.addEventListener("focus", this._boundFocus, false);
this._handlePrefChange = this._handlePrefChange.bind(this);
gDevTools.on("pref-changed", this._handlePrefChange);
this._initPreview();
this._initTooltips();
this._initHighlighter();
@ -247,12 +242,6 @@ MarkupView.prototype = {
return this._containers.get(aNode);
},
_handlePrefChange: function(event, data) {
if (data.pref == "devtools.defaultColorUnit") {
this.update();
}
},
update: function() {
let updateChildren = function(node) {
this.getContainer(node).update();
@ -676,8 +665,10 @@ MarkupView.prototype = {
* node is scrolled on to screen.
*/
showNode: function(aNode, centered) {
let container = this.importNode(aNode);
let parent = aNode;
this.importNode(aNode);
while ((parent = parent.parentNode())) {
this.importNode(parent);
this.expandNode(parent);
@ -1065,8 +1056,6 @@ MarkupView.prototype = {
* Tear down the markup panel.
*/
destroy: function() {
gDevTools.off("pref-changed", this._handlePrefChange);
// Note that if the toolbox is closed, this will work fine, but will fail
// in case the browser is closed and will trigger a noSuchActor message.
this._hideBoxModel();
@ -1074,8 +1063,6 @@ MarkupView.prototype = {
this._hoveredNode = null;
this._inspector.toolbox.off("picker-node-hovered", this._onToolboxPickerHover);
this._outputParser = null;
this.htmlEditor.destroy();
this.htmlEditor = null;
@ -1907,106 +1894,19 @@ ElementEditor.prototype = {
this.attrs[aAttr.name] = attr;
name.textContent = aAttr.name;
if (typeof aAttr.value !== "undefined") {
let outputParser = this.markup._outputParser;
let frag = outputParser.parseHTMLAttribute(aAttr.value, {
urlClass: "theme-link",
baseURI: this.node.baseURI
});
frag = this._truncateFrag(frag);
val.appendChild(frag);
let collapsedValue;
if (aAttr.value.match(COLLAPSE_DATA_URL_REGEX)) {
collapsedValue = truncateString(aAttr.value, COLLAPSE_DATA_URL_LENGTH);
} else {
collapsedValue = truncateString(aAttr.value, COLLAPSE_ATTRIBUTE_LENGTH);
}
name.textContent = aAttr.name;
val.textContent = collapsedValue;
return attr;
},
/**
* We truncate HTML attributes to a text length defined by
* COLLAPSE_DATA_URL_LENGTH and COLLAPSE_ATTRIBUTE_LENGTH. Because we parse
* text into document fragments we need to process each fragment and truncate
* according to the fragment's textContent length.
*
* @param {DocumentFragment} frag
* The fragment to truncate.
* @return {[DocumentFragment]}
* Truncated fragment.
*/
_truncateFrag: function(frag) {
let text = frag.textContent;
if (!text) {
return frag;
}
let chars = 0;
let maxWidth = text.match(COLLAPSE_DATA_URL_REGEX) ?
COLLAPSE_DATA_URL_LENGTH : COLLAPSE_ATTRIBUTE_LENGTH;
let overBy = text.length - maxWidth;
let children = frag.childNodes;
let croppedNode = null;
if (overBy <= 0) {
return frag;
}
// For fragments containing only one single node we just need to truncate
// frag.textContent.
if (children.length === 1) {
let length = text.length;
let start = text.substr(0, maxWidth / 2);
let end = text.substr(length - maxWidth / 2, length - 1);
frag.textContent = start + "…" + end;
return frag;
}
// First maxWidth / 2 chars plus &hellip;
for (let i = 0; i < children.length; i++) {
let node = children[i];
let text = node.textContent;
let numChars = text.length;
if (chars + numChars > maxWidth / 2) {
let insertionPoint = maxWidth / 2 - chars;
let start = text.substr(0, insertionPoint) + "…";
let end = text.substr(insertionPoint);
if (end.length > maxWidth / 2) {
end = end.substr(end.length - maxWidth / 2);
}
node.textContent = start + end;
croppedNode = node;
break;
} else {
chars += numChars;
}
}
// Last maxWidth / two chars.
chars = 0;
for (let i = children.length - 1; i >= 0; i--) {
let node = children[i];
let text = node.textContent;
let numChars = text.length;
if (chars + numChars > maxWidth / 2) {
if (node !== croppedNode) {
node.parentNode.removeChild(node);
chars += numChars;
} else {
break;
}
} else {
chars += numChars;
}
}
return frag;
},
/**
* Parse a user-entered attribute string and apply the resulting
* attributes to the node. This operation is undoable.

2
browser/devtools/markupview/test/browser_inspector_markup_edit.js
View File

@ -38,7 +38,7 @@ function test() {
let LONG_ATTRIBUTE_COLLAPSED = "ABCDEFGHIJKLMNOPQRSTUVWXYZ-ABCDEFGHIJKLMNOPQRSTUVWXYZ-ABCDEF\u2026UVWXYZ-ABCDEFGHIJKLMNOPQRSTUVWXYZ-ABCDEFGHIJKLMNOPQRSTUVWXYZ";
let DATA_URL_INLINE_STYLE='color: red; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEUAAAD///+l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8yw83NDDeNGe4Ug9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC");';
let DATA_URL_INLINE_STYLE_COLLAPSED="color: #F00; background: url('data:image/png;base64,iVBORw0K\u2026w83NDDeNGe4Ug9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC');";
let DATA_URL_INLINE_STYLE_COLLAPSED='color: red; background: url("data:image/png;base64,iVBORw0KG\u2026NDDeNGe4Ug9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC");';
let DATA_URL_ATTRIBUTE = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEUAAAD///+l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8yw83NDDeNGe4Ug9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC";
let DATA_URL_ATTRIBUTE_COLLAPSED = "data:image/png;base64,iVBORw0K\u20269/AFGGFyjOXZtQAAAAAElFTkSuQmCC";