sgilroy / async-await-codemod Goto Github PK
View Code? Open in Web Editor NEWCodemod script for migrating promise-based functions to use async/await syntax
Codemod script for migrating promise-based functions to use async/await syntax
Hi, thank you, for such a useful codemod :).
I just added support of jscodeshift to a pluggable code transformer
putout, and used your codemod
for tests.
Putout
does something similar to eslint
but with more transforms, and it's better then jscodeshift
because it supports plugins, and can be used in a day-to-day basis.
Your codemod
can be integrated to any project with:
npm i https://github.com/sgilroy/async-await-codemod.git
And updating .putout.json
with:
{
"jscodeshiftPlugins": [
"async-await-codemod/async-await"
]
}
(such a long path, because you don't use main
entry of package.json
)
Also user can provide custom message with help of such modifications of .putout.json
:
{
"jscodeshiftPlugins": [
["async-await-codemod/async-await", "async-await should be used instead of Promises"]
]
}
And then just run putout lib test
or putout lib test --fix
for fixing.
async-await-codemod
already works good, but would be great if you publish it to npm
and add main
section. And will be amazing if you convert your codemod
to putout plugin ๐ (it will have ability to report problem parts, and to use a rich babel infrastructure).
Anyways even without converting your codemod
already can be used with putout
in more pleasant way then with jscodeshift
, and here is why:
IDE
that has eslint
extensionsHere is how it looks like for such code:
function promise() {
return hello().then(world);
}
$ putout jscodeshift.js
/home/coderaiser/putout/packages/putout/jscodeshift.js
2:0 error async-await should be used instead of Promises jscodeshift/async-await-codemod/async-await
โ 1 errors in 1 files
fixable with the `--fix` option
By the way, async-await-codemod
is in the list of recommended jscodeshift
codemods that is recommended to be used with putout
๐.
Really needed a transform without the limitations this has, so I wrote https://github.com/codemodsquad/asyncify. Still a bit of a work in progress but I'll be improving it over the next few weeks
Looks like it doesn't support error callbacks of the form
.then(response => response, error => error);
Granted, not the most orthodox code in the world, but it does however support , error => { return error })
.
(Awesome lib btw!)
approx diff,
class Measure {
- _saveEnrollment(payload: { testName: string, variation: string }) {
โฆ
+ _saveEnrollment async function(payload: { testName: string, variation: string }) {
}
Should be
+ async _saveEnrollment(payload: { testName: string, variation: string }) {
https://github.com/rwjblue/codemod-cli
Right now, there are too many setup instructions for this tool to be composable. I'd love to use it though!
It just needs a bin file that runs the codemod.
For example,
export default function blurImageData(
imageData: ImageData,
radius: number = 50
): Promise<ImageData> {
const { height, width } = imageData;
// The pixel values that are contained in ImageData objects
// are stored in a Uint8ClampedArray (which in turn is a
// writable view of an ArrayBuffer). The easiest way to
// blur those pixels using a Web Worker would be to pass
// the typed array directly to the worker. However, this
// would incur a performance penalty because the whole
// array gets copied whenever it crosses the Web Worker
// boundary. To get around this, we pass a "transferable"
// version of the underlying buffer back and forth and
// set it on our initial imageData once it's been blurred.
return (
// First, clone the internal buffer because it's read-only to start.
// This still requires an expensive memcpy, but it'll only happen once
// rather than twice if the typed array was passed directly.
Promise.resolve(imageData.data.buffer.slice(0))
// Next, we mark the buffer as transferable so the Worker can take
// over its memory. The buffer will now be empty in this thread.
.then(bufferCopy => makeTransferable(bufferCopy))
// Now, we spin up a Worker (if necessary) and pass it our data.
.then(transferable => promiseBlur(transferable, width, height, radius))
// Finally, we construct a new typed array and wrap it in ImageData.
.then(newBuffer => new Uint8ClampedArray(newBuffer))
.then(pixels => imageData.data.set(pixels))
.then(() => imageData)
);
}
transforms to,
export default async function blurImageData(
imageData: ImageData,
radius: number = 50
): Promise<ImageData> {
const { height, width } = imageData;
await Promise.resolve(imageData.data.buffer.slice(0))
// Next, we mark the buffer as transferable so the Worker can take
// over its memory. The buffer will now be empty in this thread.
.then(bufferCopy => makeTransferable(bufferCopy))
// Now, we spin up a Worker (if necessary) and pass it our data.
.then(transferable => promiseBlur(transferable, width, height, radius))
// Finally, we construct a new typed array and wrap it in ImageData.
.then(newBuffer => new Uint8ClampedArray(newBuffer))
.then(pixels => imageData.data.set(pixels));
return imageData;
}
This is most evident in React lifecycle methods like componentDidMount
which is transforms to an async method. (Currently componentDidMount async function
due to #3 )
Regardless of whether it's for React, doesn't seem prudent for this codemod to change the contract of the code. E.g.,
function doesSomethingWithAPromise(): void {
promise.then(doSomething);
}
is being converted to:
async function doesSomethingWithAPromise(): Promise<void> {
await promise;
doSomething();
}
(hypothetically, haven't tested with this particular snippet) Point is that the return type has been changed from void
to Promise<void>
.
The following examples each currently result in errors:
function doesSomethingWithAPromise() {
promise.then(doSomething);
}
function returnsSomethingDone() {
return promise.then(doSomething);
}
Error:
TypeError: Cannot read property 'type' of undefined
at transformFunction (async-await.js:123:23)
at NodePath.paths.forEach.path (async-await.js:166:13)
at __paths.forEach (node_modules/jscodeshift/dist/Collection.js:76:36)
at Array.forEach (<anonymous>)
at Collection.forEach (node_modules/jscodeshift/dist/Collection.js:75:18)
at replaceType (async-await.js:165:13)
at transformer (async-await.js:173:3)
at runInlineTest (node_modules/jscodeshift/dist/testUtils.js:28:18)
at runTest (node_modules/jscodeshift/dist/testUtils.js:73:3)
at Object.it (node_modules/jscodeshift/dist/testUtils.js:90:7)
Instead, they should be transformed as follows:
async function doesSomethingWithAPromise() {
const promiseResult = await promise;
doSomething(promiseResult);
}
async function returnsSomethingDone() {
const promiseResult = await promise;
return doSomething(promiseResult);
}
For example,
}).then(([, session]) => {
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.