<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[181306] trunk/Source/WebInspectorUI</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/181306">181306</a></dd>
<dt>Author</dt> <dd>joepeck@webkit.org</dd>
<dt>Date</dt> <dd>2015-03-09 20:01:01 -0700 (Mon, 09 Mar 2015)</dd>
</dl>
<h3>Log Message</h3>
<pre>Web Inspector: Inline Error / Warning message for Issues
https://bugs.webkit.org/show_bug.cgi?id=142520
Reviewed by Timothy Hatcher.
* Localizations/en.lproj/localizedStrings.js:
* UserInterface/Main.html:
New strings and new files.
* UserInterface/Controllers/IssueManager.js:
(WebInspector.IssueManager.prototype.issueWasAdded):
* UserInterface/Models/IssueMessage.js:
(WebInspector.IssueMessage):
(WebInspector.IssueMessage.prototype.get columnNumber):
* UserInterface/Protocol/ConsoleObserver.js:
(WebInspector.ConsoleObserver.prototype.messageAdded):
Correctly pass the column number into IssueMessage.
* UserInterface/Models/LineWidget.js:
(WebInspector.LineWidget):
(WebInspector.LineWidget.prototype.get codeMirrorLineWidget):
(WebInspector.LineWidget.prototype.get widgetElement):
Create a new Model class for a LineWidget. The root element
should never change, but its children can be updated.
* UserInterface/Views/SourceCodeTextEditor.css:
(.source-code.text-editor .CodeMirror-linewidget):
Override styles so that widgets can overlap line content.
(.source-code.text-editor > .CodeMirror .issue-widget):
(.source-code.text-editor > .CodeMirror .issue-widget.inline):
Float issue widgets to the right side of the editor.
(.source-code.text-editor > .CodeMirror .issue-widget > .arrow):
(.source-code.text-editor > .CodeMirror .issue-widget.inline > .arrow):
Pure CSS arrow for widgets on the same line as their issue.
(.source-code.text-editor > .CodeMirror .issue-widget > .icon):
(.source-code.text-editor > .CodeMirror .issue-widget > .icon.icon-warning):
(.source-code.text-editor > .CodeMirror .issue-widget > .icon.icon-error):
Issue icon styles for the different issue types.
(.source-code.text-editor > .CodeMirror .issue-widget.warning):
(.source-code.text-editor > .CodeMirror .issue-widget.inline.warning):
(.source-code.text-editor > .CodeMirror .issue-widget.inline.warning > .arrow):
(.source-code.text-editor > .CodeMirror .issue-widget.error):
(.source-code.text-editor > .CodeMirror .issue-widget.inline.error):
(.source-code.text-editor > .CodeMirror .issue-widget.inline.error > .arrow):
Different colors for the different issue types.
(.source-code.text-editor > .CodeMirror .issue-widget > .text):
(.source-code.text-editor > .CodeMirror .issue-widget.inline > .text):
Text positioning when on the same line or when expanded.
* UserInterface/Views/SourceCodeTextEditor.js:
(WebInspector.SourceCodeTextEditor.prototype._addIssue):
(WebInspector.SourceCodeTextEditor.prototype._iconClassNameForIssueLevel):
(WebInspector.SourceCodeTextEditor.prototype._updateIssueWidgetForIssues):
(WebInspector.SourceCodeTextEditor.prototype._isWidgetToggleable):
(WebInspector.SourceCodeTextEditor.prototype._handleWidgetClick):
Create widgets for issues.
(WebInspector.SourceCodeTextEditor.prototype._contentDidPopulate):
(WebInspector.SourceCodeTextEditor.prototype.textEditorUpdatedFormatting):
(WebInspector.SourceCodeTextEditor.prototype._clearWidgets):
(WebInspector.SourceCodeTextEditor.prototype._reinsertAllIssues):
Update all widgets in certain cases.
* UserInterface/Views/TextEditor.js:
(WebInspector.TextEditor.prototype.addStyleClassToLine):
This assertion is known to happen for issues added to an editor
before the content has loaded.
(WebInspector.TextEditor.prototype.createWidgetForLine):
Create a widget for a line.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkSourceWebInspectorUIChangeLog">trunk/Source/WebInspectorUI/ChangeLog</a></li>
<li><a href="#trunkSourceWebInspectorUILocalizationsenlprojlocalizedStringsjs">trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceControllersIssueManagerjs">trunk/Source/WebInspectorUI/UserInterface/Controllers/IssueManager.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceMainhtml">trunk/Source/WebInspectorUI/UserInterface/Main.html</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceModelsIssueMessagejs">trunk/Source/WebInspectorUI/UserInterface/Models/IssueMessage.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceProtocolConsoleObserverjs">trunk/Source/WebInspectorUI/UserInterface/Protocol/ConsoleObserver.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsSourceCodeTextEditorcss">trunk/Source/WebInspectorUI/UserInterface/Views/SourceCodeTextEditor.css</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsSourceCodeTextEditorjs">trunk/Source/WebInspectorUI/UserInterface/Views/SourceCodeTextEditor.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsTextEditorjs">trunk/Source/WebInspectorUI/UserInterface/Views/TextEditor.js</a></li>
</ul>
<h3>Added Paths</h3>
<ul>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceModelsLineWidgetjs">trunk/Source/WebInspectorUI/UserInterface/Models/LineWidget.js</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkSourceWebInspectorUIChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/ChangeLog (181305 => 181306)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/ChangeLog 2015-03-10 02:18:24 UTC (rev 181305)
+++ trunk/Source/WebInspectorUI/ChangeLog 2015-03-10 03:01:01 UTC (rev 181306)
</span><span class="lines">@@ -1,3 +1,81 @@
</span><ins>+2015-03-09 Joseph Pecoraro <pecoraro@apple.com>
+
+ Web Inspector: Inline Error / Warning message for Issues
+ https://bugs.webkit.org/show_bug.cgi?id=142520
+
+ Reviewed by Timothy Hatcher.
+
+ * Localizations/en.lproj/localizedStrings.js:
+ * UserInterface/Main.html:
+ New strings and new files.
+
+ * UserInterface/Controllers/IssueManager.js:
+ (WebInspector.IssueManager.prototype.issueWasAdded):
+ * UserInterface/Models/IssueMessage.js:
+ (WebInspector.IssueMessage):
+ (WebInspector.IssueMessage.prototype.get columnNumber):
+ * UserInterface/Protocol/ConsoleObserver.js:
+ (WebInspector.ConsoleObserver.prototype.messageAdded):
+ Correctly pass the column number into IssueMessage.
+
+ * UserInterface/Models/LineWidget.js:
+ (WebInspector.LineWidget):
+ (WebInspector.LineWidget.prototype.get codeMirrorLineWidget):
+ (WebInspector.LineWidget.prototype.get widgetElement):
+ Create a new Model class for a LineWidget. The root element
+ should never change, but its children can be updated.
+
+ * UserInterface/Views/SourceCodeTextEditor.css:
+ (.source-code.text-editor .CodeMirror-linewidget):
+ Override styles so that widgets can overlap line content.
+
+ (.source-code.text-editor > .CodeMirror .issue-widget):
+ (.source-code.text-editor > .CodeMirror .issue-widget.inline):
+ Float issue widgets to the right side of the editor.
+
+ (.source-code.text-editor > .CodeMirror .issue-widget > .arrow):
+ (.source-code.text-editor > .CodeMirror .issue-widget.inline > .arrow):
+ Pure CSS arrow for widgets on the same line as their issue.
+
+ (.source-code.text-editor > .CodeMirror .issue-widget > .icon):
+ (.source-code.text-editor > .CodeMirror .issue-widget > .icon.icon-warning):
+ (.source-code.text-editor > .CodeMirror .issue-widget > .icon.icon-error):
+ Issue icon styles for the different issue types.
+
+ (.source-code.text-editor > .CodeMirror .issue-widget.warning):
+ (.source-code.text-editor > .CodeMirror .issue-widget.inline.warning):
+ (.source-code.text-editor > .CodeMirror .issue-widget.inline.warning > .arrow):
+ (.source-code.text-editor > .CodeMirror .issue-widget.error):
+ (.source-code.text-editor > .CodeMirror .issue-widget.inline.error):
+ (.source-code.text-editor > .CodeMirror .issue-widget.inline.error > .arrow):
+ Different colors for the different issue types.
+
+ (.source-code.text-editor > .CodeMirror .issue-widget > .text):
+ (.source-code.text-editor > .CodeMirror .issue-widget.inline > .text):
+ Text positioning when on the same line or when expanded.
+
+ * UserInterface/Views/SourceCodeTextEditor.js:
+ (WebInspector.SourceCodeTextEditor.prototype._addIssue):
+ (WebInspector.SourceCodeTextEditor.prototype._iconClassNameForIssueLevel):
+ (WebInspector.SourceCodeTextEditor.prototype._updateIssueWidgetForIssues):
+ (WebInspector.SourceCodeTextEditor.prototype._isWidgetToggleable):
+ (WebInspector.SourceCodeTextEditor.prototype._handleWidgetClick):
+ Create widgets for issues.
+
+ (WebInspector.SourceCodeTextEditor.prototype._contentDidPopulate):
+ (WebInspector.SourceCodeTextEditor.prototype.textEditorUpdatedFormatting):
+ (WebInspector.SourceCodeTextEditor.prototype._clearWidgets):
+ (WebInspector.SourceCodeTextEditor.prototype._reinsertAllIssues):
+ Update all widgets in certain cases.
+
+ * UserInterface/Views/TextEditor.js:
+ (WebInspector.TextEditor.prototype.addStyleClassToLine):
+ This assertion is known to happen for issues added to an editor
+ before the content has loaded.
+
+ (WebInspector.TextEditor.prototype.createWidgetForLine):
+ Create a widget for a line.
+
</ins><span class="cx"> 2015-03-06 Joseph Pecoraro <pecoraro@apple.com>
</span><span class="cx">
</span><span class="cx"> Web Inspector: JS Pretty Printing: "case" or "default" outside of switch causes unbalanced indentation
</span></span></pre></div>
<a id="trunkSourceWebInspectorUILocalizationsenlprojlocalizedStringsjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js (181305 => 181306)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js 2015-03-10 02:18:24 UTC (rev 181305)
+++ trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js 2015-03-10 03:01:01 UTC (rev 181306)
</span><span class="lines">@@ -16,6 +16,9 @@
</span><span class="cx"> localizedStrings["%.2fms"] = "%.2fms";
</span><span class="cx"> localizedStrings["%.2fs"] = "%.2fs";
</span><span class="cx"> localizedStrings["%.3fms"] = "%.3fms";
</span><ins>+localizedStrings["%d Errors"] = "%d Errors";
+localizedStrings["%d Errors, %d Warnings"] = "%d Errors, %d Warnings";
+localizedStrings["%d Warnings"] = "%d Warnings";
</ins><span class="cx"> localizedStrings["%d \xd7 %d pixels"] = "%d \xd7 %d pixels";
</span><span class="cx"> localizedStrings["%d \xd7 %d pixels (Natural: %d \xd7 %d pixels)"] = "%d \xd7 %d pixels (Natural: %d \xd7 %d pixels)";
</span><span class="cx"> localizedStrings["%d matches"] = "%d matches";
</span><span class="lines">@@ -60,6 +63,7 @@
</span><span class="cx"> localizedStrings["Anonymous Scripts"] = "Anonymous Scripts";
</span><span class="cx"> localizedStrings["Anonymous StyleSheet %d"] = "Anonymous StyleSheet %d";
</span><span class="cx"> localizedStrings["Application Cache"] = "Application Cache";
</span><ins>+localizedStrings["Assertion"] = "Assertion";
</ins><span class="cx"> localizedStrings["Assertion Failed"] = "Assertion Failed";
</span><span class="cx"> localizedStrings["Assertion failed:"] = "Assertion failed:";
</span><span class="cx"> localizedStrings["Assertion with message: %s"] = "Assertion with message: %s";
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceControllersIssueManagerjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Controllers/IssueManager.js (181305 => 181306)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Controllers/IssueManager.js 2015-03-10 02:18:24 UTC (rev 181305)
+++ trunk/Source/WebInspectorUI/UserInterface/Controllers/IssueManager.js 2015-03-10 03:01:01 UTC (rev 181306)
</span><span class="lines">@@ -50,7 +50,7 @@
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.IssueManager.Event.Cleared);
</span><span class="cx"> },
</span><span class="cx">
</span><del>- issueWasAdded: function(source, level, text, url, lineNumber, parameters)
</del><ins>+ issueWasAdded: function(source, level, text, url, lineNumber, columnNumber, parameters)
</ins><span class="cx"> {
</span><span class="cx"> var modifiedLineNumber;
</span><span class="cx"> if (lineNumber) {
</span><span class="lines">@@ -58,7 +58,7 @@
</span><span class="cx"> modifiedLineNumber = lineNumber - 1;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- var issue = new WebInspector.IssueMessage(source, level, text, url, modifiedLineNumber, parameters);
</del><ins>+ var issue = new WebInspector.IssueMessage(source, level, text, url, modifiedLineNumber, columnNumber, parameters);
</ins><span class="cx"> this._issues.push(issue);
</span><span class="cx">
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.IssueManager.Event.IssueWasAdded, {issue});
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceMainhtml"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Main.html (181305 => 181306)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Main.html 2015-03-10 02:18:24 UTC (rev 181305)
+++ trunk/Source/WebInspectorUI/UserInterface/Main.html 2015-03-10 03:01:01 UTC (rev 181306)
</span><span class="lines">@@ -250,6 +250,7 @@
</span><span class="cx"> <script src="Models/KeyboardShortcut.js"></script>
</span><span class="cx"> <script src="Models/LayoutTimelineRecord.js"></script>
</span><span class="cx"> <script src="Models/LazySourceCodeLocation.js"></script>
</span><ins>+ <script src="Models/LineWidget.js"></script>
</ins><span class="cx"> <script src="Models/LogObject.js"></script>
</span><span class="cx"> <script src="Models/NativeFunctionParameters.js"></script>
</span><span class="cx"> <script src="Models/NetworkTimeline.js"></script>
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceModelsIssueMessagejs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Models/IssueMessage.js (181305 => 181306)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Models/IssueMessage.js 2015-03-10 02:18:24 UTC (rev 181305)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/IssueMessage.js 2015-03-10 03:01:01 UTC (rev 181306)
</span><span class="lines">@@ -23,13 +23,15 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><del>-WebInspector.IssueMessage = function(source, level, text, url, lineNumber, parameters)
</del><ins>+WebInspector.IssueMessage = function(source, level, text, url, lineNumber, columnNumber, parameters)
</ins><span class="cx"> {
</span><span class="cx"> WebInspector.Object.call(this);
</span><span class="cx">
</span><span class="cx"> this._level = level;
</span><span class="cx"> this._text = text;
</span><span class="cx">
</span><ins>+ // FIXME: Move to a SourceCodeLocation.
+
</ins><span class="cx"> // FIXME <http://webkit.org/b/76404>: Remove the string equality checks for undefined
</span><span class="cx"> // once we don't get that value anymore from WebCore.
</span><span class="cx">
</span><span class="lines">@@ -40,6 +42,9 @@
</span><span class="cx"> if (typeof lineNumber === "number" && lineNumber >= 0)
</span><span class="cx"> this._lineNumber = lineNumber;
</span><span class="cx">
</span><ins>+ if (typeof columnNumber === "number" && columnNumber >= 0)
+ this._columnNumber = columnNumber;
+
</ins><span class="cx"> if (parameters && parameters !== "undefined") {
</span><span class="cx"> this._parameters = [];
</span><span class="cx"> for (var i = 0; i < parameters.length; ++i) {
</span><span class="lines">@@ -175,6 +180,7 @@
</span><span class="cx">
</span><span class="cx"> WebInspector.IssueMessage.prototype = {
</span><span class="cx"> constructor: WebInspector.IssueMessage,
</span><ins>+ __proto__: WebInspector.Object.prototype,
</ins><span class="cx">
</span><span class="cx"> get type()
</span><span class="cx"> {
</span><span class="lines">@@ -201,9 +207,14 @@
</span><span class="cx"> return this._lineNumber;
</span><span class="cx"> },
</span><span class="cx">
</span><ins>+ get columnNumber()
+ {
+ return this._columnNumber;
+ },
+
</ins><span class="cx"> // Private
</span><span class="cx">
</span><del>- _formatTextIfNecessary: function()
</del><ins>+ _formatTextIfNecessary()
</ins><span class="cx"> {
</span><span class="cx"> if (!this._parameters)
</span><span class="cx"> return;
</span><span class="lines">@@ -238,5 +249,3 @@
</span><span class="cx"> this._text = resultText;
</span><span class="cx"> }
</span><span class="cx"> };
</span><del>-
-WebInspector.IssueMessage.prototype.__proto__ = WebInspector.Object.prototype;
</del></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceModelsLineWidgetjsfromrev181305trunkSourceWebInspectorUIUserInterfaceProtocolConsoleObserverjs"></a>
<div class="copfile"><h4>Copied: trunk/Source/WebInspectorUI/UserInterface/Models/LineWidget.js (from rev 181305, trunk/Source/WebInspectorUI/UserInterface/Protocol/ConsoleObserver.js) (0 => 181306)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Models/LineWidget.js (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/LineWidget.js 2015-03-10 03:01:01 UTC (rev 181306)
</span><span class="lines">@@ -0,0 +1,63 @@
</span><ins>+/*
+ * Copyright (C) 2015 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ * notice, this list of conditions and the following disclaimer in the
+ * documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+WebInspector.LineWidget = function(codeMirrorLineWidget, widgetElement)
+{
+ WebInspector.Object.call(this);
+
+ console.assert(widgetElement instanceof Element);
+
+ this._codeMirrorLineWidget = codeMirrorLineWidget;
+ this._widgetElement = widgetElement;
+};
+
+WebInspector.LineWidget.prototype = {
+ constructor: WebInspector.LineWidget,
+ __proto__: WebInspector.Object.prototype,
+
+ // Public
+
+ get codeMirrorLineWidget()
+ {
+ return this._codeMirrorLineWidget;
+ },
+
+ get widgetElement()
+ {
+ return this._widgetElement;
+ },
+
+ clear()
+ {
+ this._codeMirrorLineWidget.clear();
+ },
+
+ update()
+ {
+ // FIXME: Later version of CodeMirror has update.
+ if (this._codeMirrorLineWidget.update)
+ this._codeMirrorLineWidget.update();
+ }
+};
</ins></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceProtocolConsoleObserverjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Protocol/ConsoleObserver.js (181305 => 181306)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Protocol/ConsoleObserver.js 2015-03-10 02:18:24 UTC (rev 181305)
+++ trunk/Source/WebInspectorUI/UserInterface/Protocol/ConsoleObserver.js 2015-03-10 03:01:01 UTC (rev 181306)
</span><span class="lines">@@ -35,6 +35,9 @@
</span><span class="cx">
</span><span class="cx"> messageAdded: function(message)
</span><span class="cx"> {
</span><ins>+ if (message.type === "assert" && !message.text)
+ message.text = WebInspector.UIString("Assertion");
+
</ins><span class="cx"> if (message.level === "warning" || message.level === "error")
</span><span class="cx"> WebInspector.issueManager.issueWasAdded(message.source, message.level, message.text, message.url, message.line, message.column || 0, message.parameters);
</span><span class="cx">
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsSourceCodeTextEditorcss"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SourceCodeTextEditor.css (181305 => 181306)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/SourceCodeTextEditor.css 2015-03-10 02:18:24 UTC (rev 181305)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SourceCodeTextEditor.css 2015-03-10 03:01:01 UTC (rev 181306)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -23,14 +23,110 @@
</span><span class="cx"> * THE POSSIBILITY OF SUCH DAMAGE.
</span><span class="cx"> */
</span><span class="cx">
</span><ins>+.source-code.text-editor .CodeMirror-linewidget {
+ overflow: initial;
+ z-index: 3; /* overlap line content */
+}
+
+.source-code.text-editor > .CodeMirror .warning {
+ background-color: rgb(253, 249, 226);
+}
+
</ins><span class="cx"> .source-code.text-editor > .CodeMirror .error {
</span><span class="cx"> background-color: rgb(255, 220, 208);
</span><span class="cx"> }
</span><span class="cx">
</span><del>-.source-code.text-editor > .CodeMirror .warning {
</del><ins>+.source-code.text-editor > .CodeMirror .issue-widget {
+ float: right;
+ padding: 0 5px 1px 5px;
+ border-bottom-left-radius: 5px;
+ cursor: default;
+}
+
+.source-code.text-editor > .CodeMirror .issue-widget.inline {
+ position: relative;
+ top: -13px;
+
+ padding: 0px 5px 0 3px;
+ border-bottom-left-radius: 0;
+}
+
+.source-code.text-editor > .CodeMirror .issue-widget > .arrow {
+ display: none;
+}
+
+.source-code.text-editor > .CodeMirror .issue-widget.inline > .arrow {
+ position: absolute;
+ left: -5.5px;
+ display: block;
+
+ top: 0px;
+ width: 0px;
+ height: 0px;
+
+ border-top: 6.5px solid transparent;
+ border-bottom: 6.5px solid transparent;
+ border-right: 5.5px solid transparent;
+}
+
+.source-code.text-editor > .CodeMirror .issue-widget > .icon {
+ height: 9px;
+ width: 9px;
+ padding-right: 12px;
+
+ background-size: 9px 9px;
+ background-repeat: no-repeat;
+ background-position-y: 1px;
+}
+
+.source-code.text-editor > .CodeMirror .issue-widget > .icon.icon-warning {
+ background-image: url(../Images/Warning.svg);
+}
+
+.source-code.text-editor > .CodeMirror .issue-widget > .icon.icon-error {
+ background-image: url(../Images/Error.svg);
+}
+
+.source-code.text-editor > .CodeMirror .issue-widget.warning {
</ins><span class="cx"> background-color: rgb(253, 249, 226);
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+.source-code.text-editor > .CodeMirror .issue-widget.inline.warning {
+ background-color: rgb(254, 233, 177);
+}
+
+.source-code.text-editor > .CodeMirror .issue-widget.inline.warning > .arrow {
+ border-right-color: rgb(254, 233, 177);
+}
+
+.source-code.text-editor > .CodeMirror .issue-widget.error {
+ background-color: rgb(255, 220, 208);
+}
+
+.source-code.text-editor > .CodeMirror .issue-widget.inline.error {
+ background-color: rgb(255, 173, 153);
+}
+
+.source-code.text-editor > .CodeMirror .issue-widget.inline.error > .arrow {
+ border-right-color: rgb(255, 173, 153);
+}
+
+.source-code.text-editor > .CodeMirror .issue-widget > .text {
+ font-family: -webkit-system-font, sans-serif;
+}
+
+.source-code.text-editor > .CodeMirror .issue-widget.inline > .text {
+ display: inline-block;
+
+ max-width: 300px;
+ height: 12px;
+ padding-top: 1px;
+
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ overflow: hidden;
+}
+
</ins><span class="cx"> .popover .debugger-popover-content {
</span><span class="cx"> font-family: Menlo, monospace;
</span><span class="cx"> font-size: 11px;
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsSourceCodeTextEditorjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SourceCodeTextEditor.js (181305 => 181306)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/SourceCodeTextEditor.js 2015-03-10 02:18:24 UTC (rev 181305)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SourceCodeTextEditor.js 2015-03-10 03:01:01 UTC (rev 181306)
</span><span class="lines">@@ -1,5 +1,5 @@
</span><span class="cx"> /*
</span><del>- * Copyright (C) 2013 Apple Inc. All rights reserved.
</del><ins>+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
</ins><span class="cx"> *
</span><span class="cx"> * Redistribution and use in source and binary forms, with or without
</span><span class="cx"> * modification, are permitted provided that the following conditions
</span><span class="lines">@@ -29,7 +29,8 @@
</span><span class="cx">
</span><span class="cx"> this._sourceCode = sourceCode;
</span><span class="cx"> this._breakpointMap = {};
</span><del>- this._issuesLineNumberMap = {};
</del><ins>+ this._issuesLineNumberMap = new Map;
+ this._widgetMap = new Map;
</ins><span class="cx"> this._contentPopulated = false;
</span><span class="cx"> this._invalidLineNumbers = {0: true};
</span><span class="cx"> this._ignoreContentDidChange = 0;
</span><span class="lines">@@ -90,8 +91,8 @@
</span><span class="cx"> WebInspector.SourceCodeTextEditor.DurationToMouseOverTokenToMakeHoveredToken = 500;
</span><span class="cx"> WebInspector.SourceCodeTextEditor.DurationToMouseOutOfHoveredTokenToRelease = 1000;
</span><span class="cx"> WebInspector.SourceCodeTextEditor.DurationToUpdateTypeTokensAfterScrolling = 100;
</span><del>-
</del><span class="cx"> WebInspector.SourceCodeTextEditor.AutoFormatMinimumLineLength = 500;
</span><ins>+WebInspector.SourceCodeTextEditor.WidgetContainsMultipleIssuesSymbol = Symbol("source-code-widget-contains-multiple-issues");
</ins><span class="cx">
</span><span class="cx"> WebInspector.SourceCodeTextEditor.Event = {
</span><span class="cx"> ContentWillPopulate: "source-code-text-editor-content-will-populate",
</span><span class="lines">@@ -438,18 +439,11 @@
</span><span class="cx"> this.dispatchEventToListeners(WebInspector.SourceCodeTextEditor.Event.ContentDidPopulate);
</span><span class="cx">
</span><span class="cx"> // We add the issues each time content is populated. This is needed because lines might not exist
</span><del>- // if we tried added them before when the full content wasn't avaiable. (When populating with
</del><ins>+ // if we tried added them before when the full content wasn't available. (When populating with
</ins><span class="cx"> // partial script content this can be called multiple times.)
</span><span class="cx">
</span><del>- this._issuesLineNumberMap = {};
</del><ins>+ this._reinsertAllIssues();
</ins><span class="cx">
</span><del>- var issues = WebInspector.issueManager.issuesForSourceCode(this._sourceCode);
- for (var i = 0; i < issues.length; ++i) {
- var issue = issues[i];
- console.assert(this._matchesIssue(issue));
- this._addIssue(issue);
- }
-
</del><span class="cx"> this._updateEditableMarkers();
</span><span class="cx"> },
</span><span class="cx">
</span><span class="lines">@@ -814,22 +808,155 @@
</span><span class="cx">
</span><span class="cx"> _addIssue: function(issue)
</span><span class="cx"> {
</span><del>- var lineNumberIssues = this._issuesLineNumberMap[issue.lineNumber];
- if (!lineNumberIssues)
- lineNumberIssues = this._issuesLineNumberMap[issue.lineNumber] = [];
</del><ins>+ // FIXME: Issue should have a SourceCodeLocation.
+ var sourceCodeLocation = this._sourceCode.createSourceCodeLocation(issue.lineNumber, issue.columnNumber);
+ var lineNumber = sourceCodeLocation.formattedLineNumber;
</ins><span class="cx">
</span><ins>+ var lineNumberIssues = this._issuesLineNumberMap.get(lineNumber);
+ if (!lineNumberIssues) {
+ lineNumberIssues = [];
+ this._issuesLineNumberMap.set(lineNumber, lineNumberIssues);
+ }
+
+ // Avoid displaying duplicate issues on the same line.
+ for (var existingIssue of lineNumberIssues) {
+ if (existingIssue.columnNumber === issue.columnNumber && existingIssue.text === issue.text)
+ return;
+ }
+
</ins><span class="cx"> lineNumberIssues.push(issue);
</span><span class="cx">
</span><span class="cx"> if (issue.level === WebInspector.IssueMessage.Level.Error)
</span><del>- this.addStyleClassToLine(issue.lineNumber, WebInspector.SourceCodeTextEditor.LineErrorStyleClassName);
</del><ins>+ this.addStyleClassToLine(lineNumber, WebInspector.SourceCodeTextEditor.LineErrorStyleClassName);
</ins><span class="cx"> else if (issue.level === WebInspector.IssueMessage.Level.Warning)
</span><del>- this.addStyleClassToLine(issue.lineNumber, WebInspector.SourceCodeTextEditor.LineWarningStyleClassName);
</del><ins>+ this.addStyleClassToLine(lineNumber, WebInspector.SourceCodeTextEditor.LineWarningStyleClassName);
</ins><span class="cx"> else
</span><span class="cx"> console.error("Unknown issue level");
</span><span class="cx">
</span><del>- // FIXME <rdar://problem/10854857>: Show the issue message on the line as a bubble.
</del><ins>+ var widget = this._issueWidgetForLine(lineNumber);
+ if (widget) {
+ if (issue.level === WebInspector.IssueMessage.Level.Error)
+ widget.widgetElement.classList.add(WebInspector.SourceCodeTextEditor.LineErrorStyleClassName);
+ else if (issue.level === WebInspector.IssueMessage.Level.Warning)
+ widget.widgetElement.classList.add(WebInspector.SourceCodeTextEditor.LineWarningStyleClassName);
+
+ this._updateIssueWidgetForIssues(widget, lineNumberIssues);
+ }
</ins><span class="cx"> },
</span><span class="cx">
</span><ins>+ _issueWidgetForLine: function(lineNumber)
+ {
+ var widget = this._widgetMap.get(lineNumber);
+ if (widget)
+ return widget;
+
+ widget = this.createWidgetForLine(lineNumber);
+ if (!widget)
+ return null;
+
+ var widgetElement = widget.widgetElement;
+ widgetElement.classList.add("issue-widget");
+ widgetElement.classList.add("inline");
+ widgetElement.addEventListener("click", this._handleWidgetClick.bind(this, widget, lineNumber));
+
+ this._widgetMap.set(lineNumber, widget);
+
+ return widget;
+ },
+
+ _iconClassNameForIssueLevel: function(level)
+ {
+ if (level === WebInspector.IssueMessage.Level.Warning)
+ return "icon-warning";
+
+ console.assert(level === WebInspector.IssueMessage.Level.Error);
+ return "icon-error";
+ },
+
+ _updateIssueWidgetForIssues: function(widget, issues)
+ {
+ var widgetElement = widget.widgetElement;
+ widgetElement.removeChildren();
+
+ if (widgetElement.classList.contains("inline") || issues.length === 1) {
+ var arrowElement = widgetElement.appendChild(document.createElement("span"));
+ arrowElement.className = "arrow";
+
+ var iconElement = widgetElement.appendChild(document.createElement("span"));
+ iconElement.className = "icon";
+
+ var textElement = widgetElement.appendChild(document.createElement("span"));
+ textElement.className = "text";
+
+ if (issues.length === 1) {
+ iconElement.classList.add(this._iconClassNameForIssueLevel(issues[0].level));
+ textElement.textContent = issues[0].text;
+ } else {
+ var errorsCount = 0;
+ var warningsCount = 0;
+ for (var issue of issues) {
+ if (issue.level === WebInspector.IssueMessage.Level.Error)
+ ++errorsCount;
+ else if (issue.level === WebInspector.IssueMessage.Level.Warning)
+ ++warningsCount;
+ }
+
+ if (warningsCount && errorsCount) {
+ iconElement.classList.add(this._iconClassNameForIssueLevel(issue.level));
+ textElement.textContent = WebInspector.UIString("%d Errors, %d Warnings").format(errorsCount, warningsCount);
+ } else if (errorsCount) {
+ iconElement.classList.add(this._iconClassNameForIssueLevel(issue.level));
+ textElement.textContent = WebInspector.UIString("%d Errors").format(errorsCount);
+ } else if (warningsCount) {
+ iconElement.classList.add(this._iconClassNameForIssueLevel(issue.level));
+ textElement.textContent = WebInspector.UIString("%d Warnings").format(warningsCount);
+ }
+
+ widget[WebInspector.SourceCodeTextEditor.WidgetContainsMultipleIssuesSymbol] = true;
+ }
+ } else {
+ for (var issue of issues) {
+ var iconElement = widgetElement.appendChild(document.createElement("span"));
+ iconElement.className = "icon";
+ iconElement.classList.add(this._iconClassNameForIssueLevel(issue.level));
+
+ var textElement = widgetElement.appendChild(document.createElement("span"));
+ textElement.className = "text";
+ textElement.textContent = issue.text;
+
+ widgetElement.appendChild(document.createElement("br"));
+ }
+ }
+
+ widget.update();
+ },
+
+ _isWidgetToggleable: function(widget)
+ {
+ if (widget[WebInspector.SourceCodeTextEditor.WidgetContainsMultipleIssuesSymbol])
+ return true;
+
+ if (!widget.widgetElement.classList.contains("inline"))
+ return true;
+
+ var textElement = widget.widgetElement.lastChild;
+ if (textElement.offsetWidth !== textElement.scrollWidth)
+ return true;
+
+ return false;
+ },
+
+ _handleWidgetClick: function(widget, lineNumber, event)
+ {
+ if (!this._isWidgetToggleable(widget))
+ return;
+
+ widget.widgetElement.classList.toggle("inline");
+
+ var lineNumberIssues = this._issuesLineNumberMap.get(lineNumber);
+ this._updateIssueWidgetForIssues(widget, lineNumberIssues);
+ },
+
</ins><span class="cx"> _breakpointInfoForBreakpoint: function(breakpoint)
</span><span class="cx"> {
</span><span class="cx"> return {resolved: breakpoint.resolved, disabled: breakpoint.disabled, autoContinue: breakpoint.autoContinue};
</span><span class="lines">@@ -1066,8 +1193,8 @@
</span><span class="cx"> this._sourceCode.resource.formatterSourceMap = this.formatterSourceMap;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- // Some breakpoints may have moved, some might not have. Just go through
- // and remove and reinsert all the breakpoints.
</del><ins>+ // Some breakpoints / issues may have moved, some might not have. Just go through
+ // and remove and reinsert all the breakpoints / issues.
</ins><span class="cx">
</span><span class="cx"> var oldBreakpointMap = this._breakpointMap;
</span><span class="cx"> this._breakpointMap = {};
</span><span class="lines">@@ -1081,8 +1208,30 @@
</span><span class="cx"> this.setBreakpointInfoForLineAndColumn(newLineInfo.lineNumber, newLineInfo.columnNumber, this._breakpointInfoForBreakpoint(breakpoint));
</span><span class="cx"> }
</span><span class="cx"> }
</span><ins>+
+ this._reinsertAllIssues();
</ins><span class="cx"> },
</span><span class="cx">
</span><ins>+ _clearWidgets: function()
+ {
+ for (var widget of this._widgetMap.values())
+ widget.clear();
+
+ this._widgetMap.clear();
+ },
+
+ _reinsertAllIssues: function()
+ {
+ this._issuesLineNumberMap.clear();
+ this._clearWidgets();
+
+ var issues = WebInspector.issueManager.issuesForSourceCode(this._sourceCode);
+ for (var issue of issues) {
+ console.assert(this._matchesIssue(issue));
+ this._addIssue(issue);
+ }
+ },
+
</ins><span class="cx"> _debuggerDidPause: function(event)
</span><span class="cx"> {
</span><span class="cx"> this._updateTokenTrackingControllerState();
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsTextEditorjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TextEditor.js (181305 => 181306)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/TextEditor.js 2015-03-10 02:18:24 UTC (rev 181305)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TextEditor.js 2015-03-10 03:01:01 UTC (rev 181306)
</span><span class="lines">@@ -576,7 +576,6 @@
</span><span class="cx"> addStyleClassToLine: function(lineNumber, styleClassName)
</span><span class="cx"> {
</span><span class="cx"> var lineHandle = this._codeMirror.getLineHandle(lineNumber);
</span><del>- console.assert(lineHandle);
</del><span class="cx"> if (!lineHandle)
</span><span class="cx"> return null;
</span><span class="cx">
</span><span class="lines">@@ -603,6 +602,17 @@
</span><span class="cx"> return this._codeMirror.toggleLineClass(lineHandle, "wrap", styleClassName);
</span><span class="cx"> },
</span><span class="cx">
</span><ins>+ createWidgetForLine: function(lineNumber)
+ {
+ var lineHandle = this._codeMirror.getLineHandle(lineNumber);
+ if (!lineHandle)
+ return null;
+
+ var widgetElement = document.createElement("div");
+ var lineWidget = this._codeMirror.addLineWidget(lineHandle, widgetElement, {coverGutter: false, noHScroll: true, handleMouseEvents: true});
+ return new WebInspector.LineWidget(lineWidget, widgetElement);
+ },
+
</ins><span class="cx"> get lineCount()
</span><span class="cx"> {
</span><span class="cx"> return this._codeMirror.lineCount();
</span></span></pre>
</div>
</div>
</body>
</html>