Top-level await does not seem to work in Meteor 3
alisnic opened this issue · comments
Given I have a file with the following contents:
import axios from "axios";
const getAndrei = async () => {
const response = await axios.get('https://api.github.com/users/alisnic')
return response.data
};
const Andrei = await getAndrei();
export default Andrei;
And then I import it:
import Andrei from './tla.js'
console.log('imported', Andrei)
Expected behaviour
json data from the response is logged
Actual behaviour
The output is imported { [Symbol(__esModule)]: true }
.
In Meteor 2, everything works. Repo with repro - https://github.com/alisnic/meteor3-tla-repro (do a npm start to see the log).
meteor/packages
meteor-base@1.5.2-beta300.0 # Packages every Meteor app needs to have
mobile-experience@1.1.1-beta300.0 # Packages for a great mobile UX
mongo@2.0.0-beta300.0 # The database Meteor supports right now
reactive-var@1.0.13-beta300.0 # Reactive variable for tracker
standard-minifier-css@1.9.3-beta300.0 # CSS minifier run for production mode
standard-minifier-js@3.0.0-beta300.0 # JS minifier run for production mode
es5-shim@4.8.1-beta300.0 # ECMAScript 5 compatibility for older browsers
ecmascript@0.16.8-beta300.0 # Enable ECMAScript2015+ syntax in app code
typescript@4.9.5-beta300.0 # Enable TypeScript syntax in .ts and .tsx modules
shell-server@0.6.0-beta300.0 # Server-side component of the `meteor shell` command
hot-module-replacement@0.5.4-beta300.0 # Update client in development without reloading the page
@zodern maybe you can shed some light here? what am I doing wrong?
hmm, we have a similar problem, with Meteor 3 beta 4
collection.ts
export const Roles = await getRolesCollection();
model.ts
import {
Roles,
} from './collections';
console.log('rolesModel', Roles);
Roles here is undefined.
Any update here?
New simpler repro repo:
https://github.com/perbergland/tla-repro/tree/main
The produced reified code for tla-file.js does NOT look correct. It differs from the example in the reify readme file since it is not marked as async: true
/////////////////////////////////////////////////////////////////////////////////////////////
// //
// server/tla-file.js //
// //
/////////////////////////////////////////////////////////////////////////////////////////////
//
!module.wrapAsync(async function (module1, __reifyWaitForDeps__, __reify_async_result__) {
"use strict";
try {
module1.export({
tlaValue: () => tlaValue,
someFunction: () => someFunction
});
let axios;
module1.link("axios", {
default(v) {
axios = v;
}
}, 0);
if (__reifyWaitForDeps__()) (await __reifyWaitForDeps__())();
const asyncMethod = async () => {
return 4;
};
console.log("before tla init");
const tlaValue = await asyncMethod();
console.log("after tla init");
const someFunction = () => {
return 7;
};
__reify_async_result__();
} catch (_reifyError) {
return __reify_async_result__(_reifyError);
}
__reify_async_result__()
}, {
self: this,
async: false
});
``
This is a bug in https://github.com/meteor/reify - it does not handle the case where the await is in the right hand side of a top level assignment, e.g.
const x = await functionCall();
I would rate this as a top level priority to fix for Meteor 3
https://github.com/meteor/reify does not have a separate issue list, so this is as good place as any to track the bug.
Workaround:
Add a top level await call in the imported file, e.g.
await 0;
anywhere in the file
The code to fix (along with a new test case) is:
Thanks to @zodern for the pointer to the reify code that needs fixing