JSFiddle - React, Tailwind, and code Playground

by ocorpening

HTML

Press the 'test aspects' button first to instrument the code<p><br/>
Then press the 'test1' button and watch the console to see the tracing.
<p><br/>
<input type="button" onclick="testAspects()" value="test aspects">
<input type="button" onclick="test.test1('arg for test1')" value="test1">
    <br/><br/>
    Item of note: On Chrome there is an odd error with the last line advising 'this' is executed, but it is nonfatal.<br/><br/>
    On Firefox and IE however it is fatal, and only test1 is instrumented.<br/><br/>
    In a local eclipse project it all works in both browsers so this appears to be a jsfiddle oddity.

JavaScript

dojo.require("dojo.string");
dojo.require("dojox.lang.aspect");
var test =
{
    test1 : function(arg1Test1)
    {
        console.log("this is test1");
        test2(arg1Test1, "fred");
    }
};

function test2(arg1Test2, arg2Test2)
{
    console.log("test2");
}

function TraceEverything(context, id)
{
    this.name = context.joinPoint.targetName;
    this.prefix = dojo.string.pad("", context.depth * 2, "--", true) + "-- #" + (id || 1);
    this.before = function(/* arguments */)
    {
        var args = Array.prototype.join.call(arguments, ", ");
        console.log(this.prefix + " => entering " + this.name + "(" + args + ")");
    };
    this.afterReturning = function(retVal)
    {
        if (retVal !== undefined)
        {
            console.log(this.prefix + " <= afterR " + this.name + " returns " + retVal);
        }
    };
    this.afterThrowing = function(excp)
    {
        console.log(this.prefix + " <= afterT " + this.name + " throws: " + excp);
    };
    this.after = function()
    {
        console.log(this.prefix + " => leaving " + this.name);
    };
}

function testAspects()
{
    var aop = dojox.lang.aspect;

    aop.advise(test, /\w/, TraceEverything);
    aop.advise(this, /\w/, TraceEverything);
}