Install and integrate Esprima for code analysis to handle refactorings which are more complex than simple templates and single-line search/rewrite.

"Inline a variable" not working.

Example

1. Select param
2. Trigger inline
3. Logs error

function test() {
    var param = 1;
    console.log(param);
}

Convert named or anonymous function to fat-arrow lambda notation

function () {
    // function body
}

Converts to

() => { // function body }

Common actions are not properly covered with tests. This will be rectified before any enhancement work is done.

This is an issue coming out of the issue: #31

Code update should negate a boolean expression. The cases will work as follows:

• simple condition: cond -> !cond
• multiple conditions: cond1 && cond2 -> !(cond1 && cond2)
• negate a negation: !cond -> cond
• negate a negated multiple condition expression: !(cond1 && cond2) -> (cond1 && cond2)
• negating a parenthetically grouped condition: (cond1 && cond2) -> !(cond1 && cond2)

Selecting this or function body only

ee.on('event', function(params) {
    // do something
});

and firing convert to named function should give this:

function new_handler (params) {
    // do something
}
mediator.on('event', new_handler);

Context: I often start with closures. When they get too complex I start to refactor them by moving to named functions.

Make var|const|let optional so an equal sign is sufficient to make the conversion.

Need action which converts anonymous function assigned to a variable to a fully qualified named function with no assignment.

var myFn = function () {
    // do stuff
}

Converts to:

function myFn () {
    // do stuff
}

Currently, the extension doesn't work on the JavaScript within the <script> tag of a single file vue component. These files have .vue extension.

Is there a way to make the extension work with these files?

Probably my newbie-ness, but I've noticed that no refactorings seem to be available for .jsx files? If I rename the file to .js, then the refactoring commands appear.

Might it be possible to add .jsx as a compatible file type?

Take a variable and inlines the value

function myFn () {
    var foo = 'my value';
    console.log(foo);
    return foo;
}

converts to

function myFn () {
    console.log('my value');
    returnm 'my value';
}

As an example, when I try to extract a variable and press ctrl+shift+j v, I get the following warning:

WARN: command 'cmstead.jsRefactor.extractVariable' not found

This goes for other keyboard shortcuts as well, such as extracting methods.

I am using the following:
vscode: version 1.19.2
JS Refactor: version 2.11.4

It would be nice if convert operations would work with multi-selection.

When a variable is represented by a compound token, a new variable is created, but replacement is not performed within source scope.

When I select all the code or just the function declaration here:

ee.on('event', function(params) {
// do something
});

And hit shift+ctrl+j shift+ctrl+n it only shows me a notification No appropriate anonymous or member function to convert. Should it give me lines below?

function new_handler (params) {
    // do something
}
mediator.on('event', new_handler);

I think that Convert To Named Function should extract a function from a selected code.

This would be great especially for extracting objects

Showcase

after(mock.stopAll);

// selecting mock.stopAll and using wrap in arrow function should produce
after(() => {
  mock.stopAll();
});

// selecting mock.stopAll and using wrap in anonymous function should produce
after(function () {
  mock.stopAll();
});

// selecting mock.stopAll and using wrap in generator function should produce
after(function *() {
  mock.stopAll();
});

// selecting mock.stopAll and using wrap in anonymous async function should produce
after(async function () {
  mock.stopAll();
});

Would love to be able to do that with your plugin.

=> should insert (<cursor1>) => { <cursor2> }

It would be cool to be able to convert stuff like "test"+i to test${i} automatically (markdown swallows the template literal quotes, I hope you know what I mean).

This seems to have been introduced some time ago, but was discovered through the following issue:

#48

The installer seems to work as expected, however the hotkeys are not configured as a mac user would expect.

Switching to Babylon will allow for support of Typescript, Flow and a variety of late-proposal level syntax which is not currently supported by Esprima. This may require a relatively large effort, so it may take some time.

Convert named function to a prototype object member function:

{
    function foo () {}
}

Converts to:

{
    foo: function () {}
}

Basic idea: Add refactoring options to context menu in editor

I am adding this enhancement because it is, by far, the most requested item and I have no idea how to implement it. I am currently seeking an answer (if there is one to be had) but if someone has any information to help, it would be greatly appreciated.

If you have any ideas, please investigate and share

Useful for hoisting and extracting object member functions when refactoring from prototypes and exported objects to named functions.

myFn: function () {

// converts to
function myFn () {

Requested: remove names in snippet templates, found harmful

iife: fix missing characters

Extract value as a variable:

function myFn () {
    console.log('my value');
    return 'my value';
}

Extraction:

function myFn () {
    var foo = 'my value';
    console.log(foo);
    return foo;
}

Hi, this extensions looks great.

I found an issue when I was trying to extract a value to a variable. It's working with ES5 functions, but not with arrow functions.

How to reproduce

Extracting the string 'param' to a variable won't work in this example.

const arrorFunc = (input) => {
  this.arrowFunc('param');
};

You'll get:

Should allow type casting for:

Number, Boolean, String, Object

The result would look like this:

Number(value)
Boolean(value)
String(value)
Object(value)

Item of note, any value which is cast to object will need to be accessed by valueOf, i.e. castValue.valueOf()

Extract to function and wrap in function and anonymous function are outdented to the edge of the document. They should indent to the level the code being wrapped is indented to.

When trying to extract a variable in a closure, it appears the scope seeking behavior is not always correct. Though this does not seem to affect most common use cases, it is an issue which needs to be investigated and remedied in time.

Select a function and add it to module exports if no exports object exists create a new entry.

The install appears to work, but after reload the commands cannot be found from keybindings.

I attempted to manually install all packages via npm i but that fails on [email protected]

I've commented on an existing issue for Edge about the problem (including some potential workarounds that didn't).

This appears to be an issue with Edge or an Edge dependency.

Create a console log snippet since it is a common action

When you wrap a function that contains an if conditional, the indentation of the if gets messed um.

When a function is wrapped in an executed function, offer an option to rebind unbound variables within the function.

console.log(foo, bar);

Without rebinding (current behavior):

function myFn () {
    console.log(foo, bar);
}

myFn();

With rebinding:

function myFn (foo, bar) {
    console.log(foo, bar);
}

myFn(foo, bar);

Currently, export function does not work properly if only function name is selected. This should be an acceptable selection for an export command

Hi, I have a lot of inplace anonymous functions, and this is great.

I was trying to install into VS 2017 with little success, I was wondering how to pull that code out to named functions, with good practices.

Convert lambda expression to function

() => { // function body }

Convert to

function () {
    // function body
}

Snippet to create new prototypal object:

function MyFoo () {}
MyFoo.prototype = {};

Update command palette action names to be namespaced with JS Refactorings: so they all come up together. This will help when people can't remember what options they have while research for the context menu is ongoing.

New code indenting always uses tabs. Correct indentation characters should be used from document options.

Wrap code in an if block:

// code doing stuff

wraps ->

if (predicate) {
    // code doing stuff
}

Select a text, hit 'introduce function', new function created with name as the selected text.

Having this:

var foo = {
    bar: quux
};

Selecting quux and hitting introduce function should lead to:

function quux() {
    <cursor>
}
var foo = {
    bar: quux
};

This refactoring reduces nesting level, makes flow easier to understand

Before

function foo() {
  if (cond) {              // <-- Caret is here
    bar()
  }
}

After

function foo() {
  if (!cond) {
    return
  }
  bar();
}

Creates a new conditional block

if (/* tab stop */) {
    /* tab stop */
}

The refactorings are using var when inlining or extracting variables. Would be great to migrate to const instead. Another way would be to add Extract constant as additional action for the user.

Comparing with IntelliJ idea, they are offering both options:

https://www.jetbrains.com/help/idea/2017.1/extract-variable-in-javascript.html

Is it possible to move refactorings into lightbulb instead of shoving everything into context menu?

Line indentation is off depending on how selections are made.

It seems like this extension (perhaps?) doesn't like ES6. When I tried to extract "new Foo(SOME_CONSTANT)" from:

describe('some test', () => {
  it('does something', async () => {
    const result = await new Foo(SOME_CONSTANT).perform();
    console.log(result);
  });
});

I got the error "Cannot extract variable if it is not inside a function". Since the variable I'm trying to extract is inside a function, but it's in an arrow function and not a function function, it seems like the problem might be that the extension isn't treating arrow functions the same as their older function versions.