Commit a31ef787 authored by timothy@apple.com's avatar timothy@apple.com
Browse files

Make input in the Web Inspector console print before any output

        that might be added by the called function.

        https://bugs.webkit.org/show_bug.cgi?id=19931

        Reviewed by Oliver Hunt.

        * inspector/front-end/Console.js:
        (WebInspector.Console.prototype._enterKeyPressed): Add the command
        message before evaluating the result. Associate the originating
        command to the result, so if they are adjacent there is no divider.
        (WebInspector.ConsoleCommand): No longer take a result.
        (WebInspector.ConsoleCommand.prototype.toMessageElement): Result
        code removed since it isn't used now.
        (WebInspector.ConsoleCommandResult): Subclass ConsoleMessage.
        (WebInspector.ConsoleCommandResult.prototype.toMessageElement):
        Call the ConsoleMessage toMessageElement and add a style class.
        * inspector/front-end/inspector.css: Add a new style class for
        adjacent results to hide the divider. Also tweak the position of
        the disclosure triangle for objects to not use the left margin.

git-svn-id: http://svn.webkit.org/repository/webkit/trunk@41352 268f45cc-cd09-0410-ab3c-d52691b4dbfc
parent 300dc10a
2009-02-28 Timothy Hatcher <timothy@apple.com>
Make input in the Web Inspector console print before any output
that might be added by the called function.
https://bugs.webkit.org/show_bug.cgi?id=19931
Reviewed by Oliver Hunt.
* inspector/front-end/Console.js:
(WebInspector.Console.prototype._enterKeyPressed): Add the command
message before evaluating the result. Associate the originating
command to the result, so if they are adjacent there is no divider.
(WebInspector.ConsoleCommand): No longer take a result.
(WebInspector.ConsoleCommand.prototype.toMessageElement): Result
code removed since it isn't used now.
(WebInspector.ConsoleCommandResult): Subclass ConsoleMessage.
(WebInspector.ConsoleCommandResult.prototype.toMessageElement):
Call the ConsoleMessage toMessageElement and add a style class.
* inspector/front-end/inspector.css: Add a new style class for
adjacent results to hide the divider. Also tweak the position of
the disclosure triangle for objects to not use the left margin.
2009-03-01 Chris Fleizach <cfleizach@apple.com> 2009-03-01 Chris Fleizach <cfleizach@apple.com>
   
Reviewed by Oliver Hunt. Reviewed by Oliver Hunt.
...@@ -446,6 +446,9 @@ WebInspector.Console.prototype = { ...@@ -446,6 +446,9 @@ WebInspector.Console.prototype = {
if (!str.length) if (!str.length)
return; return;
var commandMessage = new WebInspector.ConsoleCommand(str);
this.addMessage(commandMessage);
var result; var result;
var exception = false; var exception = false;
try { try {
...@@ -459,8 +462,8 @@ WebInspector.Console.prototype = { ...@@ -459,8 +462,8 @@ WebInspector.Console.prototype = {
this.prompt.historyOffset = 0; this.prompt.historyOffset = 0;
this.prompt.text = ""; this.prompt.text = "";
var level = exception ? WebInspector.ConsoleMessage.MessageLevel.Error : WebInspector.ConsoleMessage.MessageLevel.Log; var level = (exception ? WebInspector.ConsoleMessage.MessageLevel.Error : WebInspector.ConsoleMessage.MessageLevel.Log);
this.addMessage(new WebInspector.ConsoleCommand(str, result, this._format(result), level)); this.addMessage(new WebInspector.ConsoleCommandResult(result, level, commandMessage));
}, },
_mouseOverNode: function(event) _mouseOverNode: function(event)
...@@ -859,11 +862,9 @@ WebInspector.ConsoleMessage.MessageLevel = { ...@@ -859,11 +862,9 @@ WebInspector.ConsoleMessage.MessageLevel = {
EndGroup: 8 EndGroup: 8
} }
WebInspector.ConsoleCommand = function(command, result, formattedResultElement, level) WebInspector.ConsoleCommand = function(command)
{ {
this.command = command; this.command = command;
this.formattedResultElement = formattedResultElement;
this.level = level;
} }
WebInspector.ConsoleCommand.prototype = { WebInspector.ConsoleCommand.prototype = {
...@@ -878,30 +879,28 @@ WebInspector.ConsoleCommand.prototype = { ...@@ -878,30 +879,28 @@ WebInspector.ConsoleCommand.prototype = {
commandTextElement.textContent = this.command; commandTextElement.textContent = this.command;
element.appendChild(commandTextElement); element.appendChild(commandTextElement);
var resultElement = document.createElement("div"); return element;
resultElement.className = "console-message"; }
element.appendChild(resultElement); }
switch (this.level) { WebInspector.ConsoleCommandResult = function(result, level, originatingCommand)
case WebInspector.ConsoleMessage.MessageLevel.Log: {
resultElement.addStyleClass("console-log-level"); WebInspector.ConsoleMessage.call(this, WebInspector.ConsoleMessage.MessageSource.JS, level, -1, null, null, 1, result);
break;
case WebInspector.ConsoleMessage.MessageLevel.Warning:
resultElement.addStyleClass("console-warning-level");
break;
case WebInspector.ConsoleMessage.MessageLevel.Error:
resultElement.addStyleClass("console-error-level");
}
var resultTextElement = document.createElement("span"); this.originatingCommand = originatingCommand;
resultTextElement.className = "console-message-text"; }
resultTextElement.appendChild(this.formattedResultElement);
resultElement.appendChild(resultTextElement);
WebInspector.ConsoleCommandResult.prototype = {
toMessageElement: function()
{
var element = WebInspector.ConsoleMessage.prototype.toMessageElement.call(this);
element.addStyleClass("console-user-command-result");
return element; return element;
} }
} }
WebInspector.ConsoleCommandResult.prototype.__proto__ = WebInspector.ConsoleMessage.prototype;
WebInspector.ConsoleGroup = function(parentGroup, level) WebInspector.ConsoleGroup = function(parentGroup, level)
{ {
this.parentGroup = parentGroup; this.parentGroup = parentGroup;
...@@ -928,8 +927,11 @@ WebInspector.ConsoleGroup.prototype = { ...@@ -928,8 +927,11 @@ WebInspector.ConsoleGroup.prototype = {
element.addEventListener("click", this._titleClicked.bind(this), true); element.addEventListener("click", this._titleClicked.bind(this), true);
} else } else
this.messagesElement.appendChild(element); this.messagesElement.appendChild(element);
if (element.previousSibling && msg.originatingCommand && element.previousSibling.command === msg.originatingCommand)
element.previousSibling.addStyleClass("console-adjacent-user-command-result");
}, },
_titleClicked: function(event) _titleClicked: function(event)
{ {
var groupTitleElement = event.target.enclosingNodeOrSelfWithClass("console-group-title-level"); var groupTitleElement = event.target.enclosingNodeOrSelfWithClass("console-group-title-level");
......
...@@ -463,6 +463,10 @@ body.console-visible #console { ...@@ -463,6 +463,10 @@ body.console-visible #console {
background-image: url(Images/userInputIcon.png); background-image: url(Images/userInputIcon.png);
} }
.console-user-command-result::before {
background-image: url(Images/userInputResultIcon.png);
}
.console-message, .console-user-command { .console-message, .console-user-command {
position: relative; position: relative;
border-bottom: 1px solid rgb(240, 240, 240); border-bottom: 1px solid rgb(240, 240, 240);
...@@ -470,6 +474,14 @@ body.console-visible #console { ...@@ -470,6 +474,14 @@ body.console-visible #console {
min-height: 16px; min-height: 16px;
} }
.console-adjacent-user-command-result {
border-bottom: none;
}
.console-adjacent-user-command-result + .console-user-command-result::before {
background-image: none;
}
.console-message::before, .console-user-command::before, #console-prompt::before, .console-group-title-level::before { .console-message::before, .console-user-command::before, #console-prompt::before, .console-group-title-level::before {
position: absolute; position: absolute;
display: block; display: block;
...@@ -576,20 +588,20 @@ body.console-visible #console { ...@@ -576,20 +588,20 @@ body.console-visible #console {
} }
.console-group-messages .section { .console-group-messages .section {
margin: 0; margin: 0 0 0 12px !important;
} }
.console-group-messages .section .header { .console-group-messages .section .header {
padding: 0 8px 0 0; padding: 0 8px 0 0;
background-image: none; background-image: none;
border: none; border: none;
min-height: 16px; min-height: 0;
} }
.console-group-messages .section .header::before { .console-group-messages .section .header::before {
position: absolute; position: absolute;
top: 1px; top: 1px;
left: 12px; left: 1px;
width: 8px; width: 8px;
height: 8px; height: 8px;
content: url(Images/treeRightTriangleBlack.png); content: url(Images/treeRightTriangleBlack.png);
...@@ -618,10 +630,19 @@ body.console-visible #console { ...@@ -618,10 +630,19 @@ body.console-visible #console {
margin-top: -1px; margin-top: -1px;
} }
.console-formatted-object, .console-formatted-node {
position: relative;
display: block;
}
.console-formatted-object .section, .console-formatted-node .section { .console-formatted-object .section, .console-formatted-node .section {
position: static; position: static;
} }
.console-formatted-object .properties, .console-formatted-node .properties {
padding-left: 0 !important;
}
.auto-complete-text { .auto-complete-text {
color: rgb(128, 128, 128); color: rgb(128, 128, 128);
-webkit-user-select: none; -webkit-user-select: none;
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment