Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

can't use top-level await in projects where you set es2020 or something #8435

Open
3 tasks done
karl-police opened this issue Apr 28, 2024 · 2 comments
Open
3 tasks done

Comments

@karl-police
Copy link

karl-police commented Apr 28, 2024

🐛 bug report

Preflight Checklist

  • I have read the [Contributing Guidelines][contributing] for this project.
  • I agree to follow the [Code of Conduct][code_of_conduct] that this project
    adheres to.
  • I have searched the issue tracker for an issue that matches the one I want
    to file, without success.

Description of the problem

I can't use await

e.g. if you open the Browser console you can do something pointless like await console.log("HI") and it won't throw an error.
On Codesandbox you can't.

 

Similar to #8433 except that it's for top-level await.

To Reproduce

https://codesandbox.io/p/sandbox/hungry-forest-forked-3ssrkq?file=%2Fsrc%2Findex.ts

https://codesandbox.io/p/sandbox/codesandbox-github-async-await-issue-7hpwm8

@karl-police karl-police changed the title can't use top-level await in projects can't use top-level await in projects where you set es2020 or something Apr 28, 2024
@CompuIves
Copy link
Member

Thanks for the report! Yes, this issue is a bit more tricky to solve. When we run a project, we transpile all code and run our own require function for "bundling" the code. We transpile to commonjs, and top level await only works in ESM context. To run ESM directly, we need to rebuild the bundler from the ground up (perhaps based on service worker? I would do it that way). Transpiling top-level await is possible, by turning them into generators and having a custom runtime that executes the code and runs yield, but there currently does not exist a transpiler plugin for that.

So this one is harder to solve right now. I would recommend converting to a devbox in the meantime to circumvent this issue.

@stephenhebert
Copy link

It seems like transpiling the sandbox code defeats the integrity of the sandbox. ESM is well supported by modern browsers, and if compatibility with older browsers is not needed by the sandbox, it would be nice to be able to take advantage of ESM.

I love this product and I want it to succeed. I just heard about non-enterprise support for private repos, and signed up for a pro account to try it with my team. I've just spent several hours struggling to set up a starter template to suit our tech stack. Unfortunately, this issue makes codesandbox unusable for our use case.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants