first step for tracing plugin execution

SQUASHED: AUTO-COMMIT-demos-tom-babel-plugin-tracer.js,AUTO-COMMIT-demos-tom-babel-plugin-tracer.md,AUTO-COMMIT-demos-tom-playground.js,AUTO-COMMIT-demos-tom-plugin-explorer-systemjs-config.js,AUTO-COMMIT-demos-tom-plugin-explorer-worker.js,AUTO-COMMIT-demos-tom-plugin-explorer-worker.md,AUTO-COMMIT-demos-tom-plugin-load-promise.js,AUTO-COMMIT-demos-tom-plugin-load-promise.md,AUTO-COMMIT-demos-tom-trace.js,AUTO-COMMIT-src-babylonian-programming-editor-worker-ast-worker-babel-wrapper.js,AUTO-COMMIT-src-client-reactive-reactive-jsx-babel-plugin-jsx-lively.js,AUTO-COMMIT-src-components-demo-lively-whyline-example.js,AUTO-COMMIT-src-components-demo-lively-whyline.js,AUTO-COMMIT-src-components-tools-babel-plugin-explorer-playground.js,AUTO-COMMIT-src-components-tools-lively-plugin-explorer.js,AUTO-COMMIT-src-components-tools-lively-plugin-explorer-playground2.workspace,AUTO-COMMIT-src-components-tools-lively-plugin-explorer-playground.workspace,AUTO-COMMIT-src-components-tools-plugin-selector.js,AUTO-COMMIT-src-external-babel-plugin-syntax-jsx.js,AUTO-COMMIT-src-external-babel-plugin-var-recorder-explanation.md,AUTO-COMMIT-src-external-babel-plugin-var-recorder.js,AUTO-COMMIT-src-external-systemjs-system.src.js,

Author: BraunTom

demos/tom/babel-plugin-tracer.js

@@ -0,0 +1,80 @@
+import Trace from 'demos/tom/trace.js';
+
+export default function({ types: t }) {
+    function error(path, message) {
+        throw path.buildCodeFrameError(message);
+    }
+
+    const returnVisitor = {
+        ReturnStatement(path) {
+            if (path.node.alreadyVisited) {
+                return;
+            }
+            path.node.alreadyVisited = true;
+            const log = callOnTrace('return');
+            const returnValue = path.node.argument ? path.node.argument : t.identifier('undefined');
+            path.node.argument = t.sequenceExpression([log, returnValue])
+        }
+    }
+
+    function callOnTrace(methodName, args = []) {
+        return t.callExpression(t.memberExpression(t.identifier(Trace.traceIdenifierName), t.identifier(methodName)),
+            args);
+    }
+
+    function modifyFunction(name, path) {
+        const body = path.get('body');
+        body.unshiftContainer('body', t.expressionStatement(callOnTrace('enterFunction', [t.stringLiteral(name)])));
+        body.pushContainer('body', t.expressionStatement(callOnTrace('leave')));
+        path.traverse(returnVisitor);
+    }
+
+    function resolveName(callee) {
+        if(callee.type === 'MemberExpression') {
+            return resolveName(callee.object) + `.${callee.property.name}`;
+        } else if(callee.type === 'CallExpression') {
+            return resolveName(callee.callee);
+        } else {
+            return callee.name;
+        }
+    }
+
+    function nameFromCallExpression(path) {
+        const callee = path.node.callee;
+        if (callee.type === 'MemberExpression') {
+            
+            return resolveName(callee)
+        } else {
+            return callee.name || 'anonymous function';
+        }
+    }
+
+    return {
+        name: 'tracer',
+        visitor: {
+            CallExpression(path) {
+                if (path.node.alreadyVisited || path.isGenerated()) {
+                    return;
+                }
+                debugger
+                const name = nameFromCallExpression(path);
+                path.node.alreadyVisited = true;
+                const log = callOnTrace('aboutToEnter', [t.stringLiteral(name)]);
+                const sequence = t.sequenceExpression([log, path.node]);
+                path.replaceWith(t.expressionStatement(sequence));
+            },
+            ArrowFunctionExpression(path) {
+
+            },
+            "ClassMethod|ObjectMethod"(path) {
+                const name = path.node.key.name;
+                modifyFunction(name, path);
+            },
+            "FunctionDeclaration|FunctionExpression"(path) {
+                const id = path.node.id;
+                const name = id ? id.name : 'anonymous function';
+                modifyFunction(name, path);
+            }
+        }
+    }
+}

demos/tom/playground.js

@@ -0,0 +1,3 @@
+export default function foo(a, b) {
+    deb();    return a + b;
+}

demos/tom/plugin-explorer-systemjs-config.js

@@ -0,0 +1,88 @@
+/*
+*
+* This file is meant to be importet in the plugin explorer worker via importScript
+*
+*/
+
+const pluginTransformationPlugin = lively4url + '/demos/tom/babel-plugin-tracer.js';
+
+
+function makeOptionsObject(plugins) {
+    return {
+        babelOptions: {
+            es2015: false,
+            stage2: false,
+            stage3: false,
+            plugins
+        }
+    }
+}
+const moduleOptionsNon = makeOptionsObject([]);
+const pluginOptions = makeOptionsObject([pluginTransformationPlugin])
+
+SystemJS.config({
+    baseURL: lively4url + '/',
+    map: {
+        // #Discussion have to use absolute paths here, because it is not clear what the baseURL is
+        'plugin-babel': lively4url + '/src/external/babel/plugin-babel2.js',
+        'systemjs-plugin-babel': lively4url + '/src/external/babel/plugin-babel.js', // seems not to be loaded
+        'systemjs-babel-build': lively4url + '/src/external/babel/systemjs-babel-browser.js',
+
+        // aexpr support
+        'active-expression': lively4url + '/src/client/reactive/active-expression/active-expression.js',
+        'active-expression-rewriting': lively4url +
+            '/src/client/reactive/active-expression-rewriting/active-expression-rewriting.js',
+        'active-expression-proxies': lively4url +
+            '/src/client/reactive/active-expression-proxies/active-expression-proxies.js',
+        'babel-plugin-active-expression-rewriting': lively4url +
+            '/src/client/reactive/babel-plugin-active-expression-rewriting/index.js',
+        'babel-plugin-databindings': lively4url + '/src/client/reactive/babel-plugin-databindings/index.js',
+        'babel-plugin-active-expression-proxies': lively4url +
+            '/src/client/reactive/babel-plugin-active-expression-proxies/index.js',
+        'active-expression-frame-based': lively4url +
+            '/src/client/reactive/active-expression-convention/active-expression-frame-based.js',
+        'active-group': lively4url + '/src/client/reactive/active-group/select.js',
+
+        // jsx support
+        'babel-plugin-syntax-jsx': lively4url + '/src/external/babel-plugin-syntax-jsx.js',
+        'babel-plugin-jsx-lively': lively4url + '/src/client/reactive/reactive-jsx/babel-plugin-jsx-lively.js',
+        'babel-plugin-rp-jsx': lively4url + '/src/client/reactive/rp-jsx/babel-plugin-rp-jsx.js',
+        'reactive-jsx': lively4url + '/src/client/reactive/reactive-jsx/reactive-jsx.js',
+        'babel-plugin-rp19-jsx': lively4url + '/src/client/reactive/rp19-jsx/babel-plugin-rp19-jsx.js',
+        'rp19-jsx': lively4url + '/src/client/reactive/rp19-jsx/rp19-jsx.js',
+
+        // estree support
+        'babel-plugin-estree': lively4url + '/src/external/babel-plugin-estree.js',
+
+        // stage 0 support
+        'babel-plugin-transform-do-expressions': lively4url +
+            '/src/external/babel-plugin-transform-do-expressions.js',
+        'babel-plugin-transform-function-bind': lively4url +
+            '/src/external/babel-plugin-transform-function-bind.js',
+        'babel-plugin-syntax-do-expressions': lively4url +
+            '/src/external/babel-plugin-syntax-do-expressions.js',
+        'babel-plugin-syntax-function-bind': lively4url + '/src/external/babel-plugin-syntax-function-bind.js',
+        'babel-plugin-syntax-async-generators': lively4url +
+            '/src/external/babel-plugin-syntax-async-generators.js',
+        'babel-plugin-syntax-object-rest-spread': lively4url +
+            '/src/external/babel-plugin-syntax-object-rest-spread.js',
+
+        // support for doits
+        'babel-plugin-doit-result': lively4url + '/src/external/babel-plugin-doit-result.js',
+        'babel-plugin-doit-this-ref': lively4url + '/src/external/babel-plugin-doit-this-ref.js',
+        'babel-plugin-doit-async': lively4url + '/src/external/babel-plugin-doit-async.js',
+        'babel-plugin-locals': lively4url + '/src/external/babel-plugin-locals.js',
+        'babel-plugin-var-recorder': lively4url + '/src/external/babel-plugin-var-recorder.js',
+        'babel-plugin-var-recorder-dev': lively4url + '/src/external/babel-plugin-var-recorder-dev.js',
+        'workspace-loader': lively4url + '/src/client/workspace-loader.js',
+
+        // utils
+        'lang': lively4url + '/src/client/lang/lang.js',
+        'lang-ext': lively4url + '/src/client/lang/lang-ext.js',
+
+        // utils
+        'utils': lively4url + '/src/client/utils.js'
+    },
+    transpiler: 'plugin-babel',
+    meta: {}
+});

demos/tom/plugin-explorer-worker.js

@@ -0,0 +1,44 @@
+// first lines copied from src/worker/livelyworker.js
+self.window = self;
+
+// as lively4url would not be defined otherwise we need to compute it here
+const myPath = '/demos/tom/plugin-explorer-worker.js';
+self.lively4url = self.location.toString().replace(myPath, "");
+
+
+importScripts(lively4url + '/src/external/systemjs/system.src.js');
+importScripts(lively4url + '/demos/tom/plugin-explorer-systemjs-config.js')
+
+// not sure why I need this but without it I cannot import the plugins
+System.import(pluginTransformationPlugin);
+
+
+Promise.all(['demos/tom/trace.js', 'systemjs-babel-build'].map(name => System.import(name)))
+    .then(function(arr) {
+        const Trace = arr[0].default;
+        const babel = arr[1].default.babel;
+
+        self.onmessage = function(msg) {
+            const config = {
+                filename: 'tmpfile.js',
+                moduleIds: false,
+                babelrc: false,
+            };
+            System.config({
+                meta: {
+                    '*.js': pluginOptions,
+                    [pluginTransformationPlugin]: moduleOptionsNon
+                }
+            })
+
+            Promise.all(msg.data.urls.map(url => System.import(url)))
+                .then(function(modules) {
+                    config.plugins = modules.map(module => module.default);
+                    config.sourceFileName = 'tmpfile.js';
+                    window[Trace.traceIdenifierName] = new Trace();
+                    const result = babel.transform(msg.data.source, config);
+                    debugger
+                    postMessage({transformedAST: JSON.stringify(result.ast), transformedCode: result.code, trace: window[Trace.traceIdenifierName]});
+                })
+        }
+    });

demos/tom/plugin-load-promise.js

@@ -0,0 +1,13 @@
+const worker = new Worker('demos/tom/plugin-explorer-worker.js')
+
+export default function(source, urls) {
+    return new Promise((resolve, reject) => {
+        worker.onmessage = function(msg) {
+            resolve(msg.data)
+        }
+        worker.onerror = function(msg) {
+            reject(msg)
+        }
+        worker.postMessage({source, urls})
+    })
+}

demos/tom/trace.js

@@ -0,0 +1,36 @@
+class Event {
+    constructor(type, data) {
+        this.type = type;
+        this.data = data;
+    }
+}
+
+class Trace {
+    constructor() {
+        this._log = [];
+    }
+    
+    log(event) {
+        this._log.push(event);
+    }
+    
+    aboutToEnter(name) {
+        this.log(new Event('aboutToEnter', name));
+    }
+    
+    enterFunction(name) {
+        this.log(new Event('enterFunction', name));
+    }
+    
+    leave() {
+        this.log(new Event('leave'));
+    }
+    
+    return() {
+        this.log(new Event('return'));
+    }
+}
+
+Trace.traceIdenifierName = 'currentTrace';
+
+export default Trace;

src/components/demo/lively-whyline-example.js

@@ -4,15 +4,15 @@ obj.v.w.x = obj ? "cool" : "oh no";
 var boo, a, b;
 ([a, b, ...boo] = "abcdef");
 ({a, mojo: b} = {a: 1, mojo: 3});
-
+ 
 if (a < 0) {
   a--
 } else if (a == 0) {
   a *= a;
 } else {
   a++
 }
-
+ 
 function foo(a,b) {
   let c = a + b;
   for (var i = 0; i < 2; i++) {
@@ -25,6 +25,7 @@ function foo(a,b) {
   }
   return;
 }
-
+ 
 foo(a, b)
-let d = a + b
+let d = a + b
+

src/components/tools/babel-plugin-explorer-playground.js

@@ -1,36 +1,13 @@
-export default function (babel) {
-  const { types: t, template, transformFromAst, traverse } = babel;
-  return {
-    name: "underscore-decorator",
-    visitor: {
-      FunctionDeclaration(path) {
-          if(path.node.isDecorated) {
-              return;
-          }
-        const nameParts = path.node.id.name.split('_');
-        if (nameParts.length < 2) {
-            return;
-        }
-          let body = path.node.body;
-        
-          for (const id of nameParts.slice(0, -1).reverse()) {
-             body = t.callExpression(
-                 t.identifier(id), 
-                 [t.arrowFunctionExpression([], body)])
-        }
-          
-      const fun = t.functionDeclaration(
-            path.node.id, 
-            path.node.params, 
-            t.blockStatement([t.returnStatement(body)]
-        ));
-          fun.isDecorated = true;
-          path.replaceWith(fun);          
-      },//*/
-        
-        ReturnStatement(path) {
-            // debugger
+export default function({ types: t }) {
+    return {
+        name: 'test-plugin',
+        visitor: {
+            Program(path) {
+                debugger;
+              
+                path.unshiftContainer('body', t.debuggerStatement());
+                
+            }
         }
     }
-  };
 }