synvert-core-javascript

logo

Main workflow AwesomeCode Status for synvert-hq/synvert-core-javascript

Synvert core provides a set of DSLs to rewrite javascript code. e.g.

const Synvert = require("@synvert-hq/synvert-core");

new Synvert.Rewriter("jquery", "deprecate-event-shorthand", () => {
  description('jQuery event shorthand is deprecated.');

  withinFiles(Synvert.ALL_FILES, function () {
    // $('#test').click(function(e) { });
    // =>
    // $('#test').on('click', function(e) { });
    findNode(`.CallExpression[callee=.MemberExpression[object IN (/^\\$/ /^jQuery/)][property=click]]
                [arguments.length=1][arguments.0.type IN (FunctionExpression ArrowFunctionExpression)]`, () => {
      replace("callee.property", { with: "on" });
      insert("'click', ", { to: "arguments.0", at: "beginning" });
    });

    // $form.submit();
    // =>
    // $form.trigger('submit');
    withNode(
      {
        nodeType: "CallExpression",
        callee: { nodeType: "MemberExpression", object: /^\$/, property: 'submit' },
        arguments: { length: 0 },
      },
      () => {
        replace(["callee.property", "arguments"], { with: "trigger('submit')" });
      }
    );
  });
});

Want to see more examples, check out synvert-snippets-javascript.

Want to use the CLI, check out synvert-javascript.

DSL are as follows

Scopes:

Conditions:

Actions:

  • append - append the code to the bottom of the current node body
  • prepend - prepend the code to the top of the current node body
  • insert - insert code
  • insertAfter - insert the code next to the current node
  • insertBefore - insert the code previous to the current node
  • replace - replace the code of specified child nodes
  • delete - delete code the code of specified child nodes
  • remove - remove the whole code of current node
  • replaceWith - replace the whole code of current node
  • noop - no operation
  • group - group actions

Others:

Properties: