[DevTools] Better locations for snippets

- highlight errors in snippet source; - fix location of Syntax Errors in console messge; - fix location of Snippet result in console message BUG=479712 R=lushnikov@chromium.org Review-Url: https://codereview.chromium.org/2173233002 Cr-Commit-Position: refs/heads/master@{#407706}

[DevTools] Better locations for snippets
- highlight errors in snippet source; - fix location of Syntax Errors in console messge; - fix location of Snippet result in console message BUG=479712 R=lushnikov@chromium.org Review-Url: https://codereview.chromium.org/2173233002 Cr-Commit-Position: refs/heads/master@{#407706}
897ee2fb · kozyatinskiy · Commit bot · 5f911460 · 897ee2fb · 897ee2fb
Commit 897ee2fb authored Jul 25, 2016 by kozyatinskiy Committed by Commit bot Jul 26, 2016
5 changed files
--- a/third_party/WebKit/LayoutTests/http/tests/inspector/console-test.js
+++ b/third_party/WebKit/LayoutTests/http/tests/inspector/console-test.js
@@ -368,6 +368,14 @@ InspectorTest.waitUntilMessageReceived = function(callback)
    InspectorTest.addSniffer(InspectorTest.consoleModel, "addMessage", callback, false);
 }
+InspectorTest.waitUntilMessageReceivedPromise = function()
+{
+    var callback;
+    var promise = new Promise((fullfill) => callback = fullfill);
+    InspectorTest.waitUntilMessageReceived(callback);
+    return promise;
+}
 InspectorTest.waitUntilNthMessageReceived = function(count, callback)
 {
    function override()
@@ -380,6 +388,14 @@ InspectorTest.waitUntilNthMessageReceived = function(count, callback)
    InspectorTest.addSniffer(InspectorTest.consoleModel, "addMessage", override, false);
 }
+InspectorTest.waitUntilNthMessageReceivedPromise = function(count)
+{
+    var callback;
+    var promise = new Promise((fullfill) => callback = fullfill);
+    InspectorTest.waitUntilNthMessageReceived(count, callback);
+    return promise;
+}
 InspectorTest.changeExecutionContext = function(namePrefix)
 {
    var selector = WebInspector.ConsoleView.instance()._executionContextModel._selectElement;

--- a/third_party/WebKit/LayoutTests/inspector/console/console-link-to-snippet-expected.txt
+++ b/third_party/WebKit/LayoutTests/inspector/console/console-link-to-snippet-expected.txt
+CONSOLE MESSAGE: line 1: 239
+CONSOLE ERROR: line 2: 42
+Test that link to snippet works.
+Running: testConsoleLogAndReturnMessageLocation
+name1:1 239
+name1:1 42
+Running: testSnippetSyntaxError
+Line Message was added: name2 Error 'Uncaught SyntaxError: Unexpected token }':1:1
+name2:2 Uncaught SyntaxError: Unexpected token }
+Running: testConsoleErrorHighlight
+Line Message was added: name3 Error '42':1:10
+name3:2 42(anonymous function) @ name3:2
--- a/third_party/WebKit/LayoutTests/inspector/console/console-link-to-snippet.html
+++ b/third_party/WebKit/LayoutTests/inspector/console/console-link-to-snippet.html
+<html>
+<head>
+<script src="../../http/tests/inspector/inspector-test.js"></script>
+<script src="../../http/tests/inspector/sources-test.js"></script>
+<script src="../../http/tests/inspector/console-test.js"></script>
+<script>
+function test()
+{
+    InspectorTest.addSniffer(WebInspector.UISourceCode.prototype, "addLineMessage", dumpLineMessage, true);
+    InspectorTest.runTestSuite([
+        function testConsoleLogAndReturnMessageLocation(next)
+        {
+            InspectorTest.waitUntilNthMessageReceivedPromise(2)
+                .then(() => InspectorTest.dumpConsoleMessages())
+                .then(() => WebInspector.ConsoleView.clearConsole())
+                .then(() => next());
+            createSnippetPromise("console.log(239);42")
+                .then(uiSourceCode => selectSourceCode(uiSourceCode))
+                .then(uiSourceCode => renameSourceCodePromise("name1", uiSourceCode))
+                .then(() => runSelectedSnippet());
+        },
+        function testSnippetSyntaxError(next)
+        {
+            InspectorTest.waitUntilNthMessageReceivedPromise(1)
+                .then(() => InspectorTest.dumpConsoleMessages())
+                .then(() => WebInspector.ConsoleView.clearConsole())
+                .then(() => next());
+            createSnippetPromise("\n }")
+                .then(uiSourceCode => selectSourceCode(uiSourceCode))
+                .then(uiSourceCode => renameSourceCodePromise("name2", uiSourceCode))
+                .then(() => runSelectedSnippet());
+        },
+        function testConsoleErrorHighlight(next)
+        {
+            InspectorTest.waitUntilNthMessageReceivedPromise(1)
+                .then(() => InspectorTest.dumpConsoleMessages())
+                .then(() => WebInspector.ConsoleView.clearConsole())
+                .then(() => next());
+            createSnippetPromise("\n  console.error(42);")
+                .then(uiSourceCode => selectSourceCode(uiSourceCode))
+                .then(uiSourceCode => renameSourceCodePromise("name3", uiSourceCode))
+                .then(() => runSelectedSnippet());
+        }
+    ]);
+    function createSnippetPromise(content)
+    {
+        var callback;
+        var promise = new Promise(fullfill => callback = fullfill);
+        WebInspector.scriptSnippetModel._project.createFile("", null, content, callback);
+        return promise;
+    }
+    function renameSourceCodePromise(newName, uiSourceCode)
+    {
+        var callback;
+        var promise = new Promise(fullfill => callback = fullfill);
+        uiSourceCode.rename(newName, () => callback(uiSourceCode));
+        return promise;
+    }
+    function selectSourceCode(uiSourceCode)
+    {
+        WebInspector.SourcesPanel.instance()._sourceSelected({ data: { uiSourceCode: uiSourceCode }});
+        return uiSourceCode;
+    }
+    function dumpLineMessage(level, text, lineNumber, columnNumber)
+    {
+        InspectorTest.addResult(`Line Message was added: ${this.url()} ${level} '${text}':${lineNumber}:${columnNumber}`);
+    }
+    function runSelectedSnippet()
+    {
+        WebInspector.SourcesPanel.instance()._runSnippet();
+    }
+}
+</script>
+</head>
+<body onload="runTest()">
+<p>Test that link to snippet works.</p>
+</body>
+</html>
--- a/third_party/WebKit/Source/devtools/front_end/bindings/PresentationConsoleMessageHelper.js
+++ b/third_party/WebKit/Source/devtools/front_end/bindings/PresentationConsoleMessageHelper.js
@@ -67,7 +67,7 @@ WebInspector.PresentationConsoleMessageHelper.prototype = {
     */
    _consoleMessageAdded: function(message)
    {
-        if (!message.url || !message.isErrorOrWarning())
+        if (!message.isErrorOrWarning())
            return;
        var rawLocation = this._rawLocation(message);
@@ -86,14 +86,14 @@ WebInspector.PresentationConsoleMessageHelper.prototype = {
        var debuggerModel = WebInspector.DebuggerModel.fromTarget(message.target());
        if (!debuggerModel)
            return null;
+        if (message.scriptId)
+            return debuggerModel.createRawLocationByScriptId(message.scriptId, message.line, message.column);
        var callFrame = message.stackTrace && message.stackTrace.callFrames ? message.stackTrace.callFrames[0] : null;
-        var lineNumber = callFrame ? callFrame.lineNumber : message.line;
-        var columnNumber = callFrame ? callFrame.columnNumber : message.column;
        if (callFrame)
-            columnNumber = callFrame.columnNumber;
+            return debuggerModel.createRawLocationByScriptId(callFrame.scriptId, callFrame.lineNumber, callFrame.columnNumber);
-        if (message.scriptId)
+        if (message.url)
-            return debuggerModel.createRawLocationByScriptId(message.scriptId, lineNumber, columnNumber);
+            return debuggerModel.createRawLocationByURL(message.url, message.line, message.column);
-        return debuggerModel.createRawLocationByURL(message.url || "", lineNumber, columnNumber);
+        return null;
    },
    /**

--- a/third_party/WebKit/Source/devtools/front_end/snippets/ScriptSnippetModel.js
+++ b/third_party/WebKit/Source/devtools/front_end/snippets/ScriptSnippetModel.js
@@ -225,9 +225,17 @@ WebInspector.ScriptSnippetModel.prototype = {
        var mapping = this._mappingForTarget.get(target);
        mapping._setEvaluationIndex(evaluationIndex, uiSourceCode);
        var evaluationUrl = mapping._evaluationSourceURL(uiSourceCode);
-        var expression = uiSourceCode.workingCopy();
+        uiSourceCode.requestContent().then(compileSnippet.bind(this));
-        WebInspector.console.show();
-        runtimeModel.compileScript(expression, "", true, executionContext.id, compileCallback.bind(this));
+        /**
+         * @this {WebInspector.ScriptSnippetModel}
+         */
+        function compileSnippet()
+        {
+            var expression = uiSourceCode.workingCopy();
+            WebInspector.console.show();
+            runtimeModel.compileScript(expression, "", true, executionContext.id, compileCallback.bind(this));
+        }
        /**
         * @param {!RuntimeAgent.ScriptId=} scriptId
@@ -240,12 +248,12 @@ WebInspector.ScriptSnippetModel.prototype = {
            if (mapping.evaluationIndex(uiSourceCode) !== evaluationIndex)
                return;
+            mapping._addScript(executionContext.debuggerModel.scriptForId(scriptId || exceptionDetails.scriptId), uiSourceCode);
            if (!scriptId) {
                this._printRunOrCompileScriptResultFailure(target, exceptionDetails, evaluationUrl);
                return;
            }
-            mapping._addScript(executionContext.debuggerModel.scriptForId(scriptId), uiSourceCode);
            var breakpointLocations = this._removeBreakpoints(uiSourceCode);
            this._restoreBreakpoints(uiSourceCode, breakpointLocations);
@@ -272,7 +280,7 @@ WebInspector.ScriptSnippetModel.prototype = {
        function runCallback(target, result, exceptionDetails)
        {
            if (!exceptionDetails)
-                this._printRunScriptResult(target, result, sourceURL);
+                this._printRunScriptResult(target, result, scriptId, sourceURL);
            else
                this._printRunOrCompileScriptResultFailure(target, exceptionDetails, sourceURL);
        }
@@ -281,9 +289,10 @@ WebInspector.ScriptSnippetModel.prototype = {
    /**
     * @param {!WebInspector.Target} target
     * @param {?RuntimeAgent.RemoteObject} result
+     * @param {!RuntimeAgent.ScriptId} scriptId
     * @param {?string=} sourceURL
     */
-    _printRunScriptResult: function(target, result, sourceURL)
+    _printRunScriptResult: function(target, result, scriptId, sourceURL)
    {
        var consoleMessage = new WebInspector.ConsoleMessage(
            target,
@@ -296,7 +305,10 @@ WebInspector.ScriptSnippetModel.prototype = {
            undefined,
            undefined,
            [result],
-            undefined);
+            undefined,
+            undefined,
+            undefined,
+            scriptId);
        target.consoleModel.addMessage(consoleMessage);
    },
@@ -318,7 +330,10 @@ WebInspector.ScriptSnippetModel.prototype = {
            exceptionDetails.columnNumber,
            undefined,
            undefined,
-            exceptionDetails.stackTrace);
+            exceptionDetails.stackTrace,
+            undefined,
+            undefined,
+            exceptionDetails.stackTrace ? undefined : exceptionDetails.scriptId);
        target.consoleModel.addMessage(consoleMessage);
    },