named-evals.html   [plain text]


<html>
<head>
<script>

function log(message) {
    console.log(message)
}

var funcBody = "(){\n" + 
"   var thisFunc = arguments.callee;\n" +
"   if (!thisFunc.name) thisFunc.displayName = 'f%';\n" + 
"   log(thisFunc.name || thisFunc.displayName);\n" +
"}";

var funcs = [];
var patterns = [
    // proper use of @sourceURL comment
    "//@sourceURL=f%.js\nfuncs.push(function" + funcBody + ")",
    "//@sourceURL=f%.js\nfuncs.push(function f%" + funcBody + ")",
    " //@sourceURL=f%.js\nfuncs.push(function f%" + funcBody + ")",
    "// @sourceURL=f%.js\nfuncs.push(function f%" + funcBody + ")",
    "//@ sourceURL=f%.js\nfuncs.push(function f%" + funcBody + ")",
    "//@sourceURL =f%.js\nfuncs.push(function f%" + funcBody + ")",
    "//@sourceURL= f%.js\nfuncs.push(function f%" + funcBody + ")",
    "//@sourceURL=f%.js \nfuncs.push(function f%" + funcBody + ")",
    " // @ sourceURL = f%.js \nfuncs.push(function f%" + funcBody + ")",
    "//@sourceURL=f%.js\nfuncs.push(function f%" + funcBody + ");\n//@sourceURL=should-not-see\n",
    "funcs.push(function f%" + funcBody + ")\n//@sourceURL=f%.js\n",
    "funcs.push(function f%" + funcBody + ")\n//@sourceURL=f%.js \n",
    "funcs.push(function f%" + funcBody + ")\n//@sourceURL=f%.js",
    
    // improper or non-existant use of @sourceURL comment
    "funcs.push(function f%" + funcBody + ")",
    "//@sourceurl=f%.js\nfuncs.push(function f%" + funcBody + ")",
    "//sourceURL=f%.js\nfuncs.push(function f%" + funcBody + ")",
    "/*@sourceURL=f%.js*/\nfuncs.push(function f%" + funcBody + ")",
    "//\nsourceURL='f%.js';\nfuncs.push(function f%" + funcBody + ")",
    "//@sourceURL=\nfuncs.push(function" + funcBody + ")",
];


for (var i=0; i<patterns.length; i++) {
    eval(patterns[i].replace(/%/g, i));
}

</script>
</head>

<body>
<p>This page's JavaScript calls functions from named eval()'s.
    
<p>Used to test <a href="https://bugs.webkit.org/show_bug.cgi?id=25475">https://bugs.webkit.org/show_bug.cgi?id=25475</a>

<p>Load the Web Inspector and look at
the script's panel, and the script list drop-down control.  
You should see entries for scripts named 
<tt>"(program):f0.js"</tt> through <tt>"(program):f12.js"</tt>.  The entries were named
via proper use of the <tt>//@sourceURL</tt> comment.  There will also be entries
named <tt>"(program)"</tt> for source that does not properly use, or use at all,
the <tt>//@sourceURL</tt> comment.

<p>Now, set a breakpoint in the body of the <tt>"f0"</tt> function in the
<tt>"(program):f0.js"</tt> script.  Then click this button:

<p><input type="button" value="run" onclick="funcs[0]()">

<p>When stopped at the breakpoint, the entry for the function in the
call stack control should the name of the script, <tt>"(program):f0.js"</tt>,
beside the function name <tt>"f0"</tt>.  Note the function name for 
<tt>f0</tt> is set with the new <tt>"displayName"</tt> property.
</body>
</html>