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

New Js Example: Top level await implementation for modern Browsers #337

Open
filoscoder opened this issue May 28, 2023 · 2 comments
Open

Comments

@filoscoder
Copy link

I've been struggling to get running the javascript example on the documentation.

As it is well known, since ES2022, we can use top level await in javascript modules.

I can confirm that below example works.

✅ Tested on PDF generation HTML template with Puppeteer, run in NodeJS application.

<head>
  <!-- ...other files and HTML tags... -->
  <!-- Load the RDKit JS file -->
  <script src="https://unpkg.com/@rdkit/rdkit/dist/RDKit_minimal.js"></script>

  <!-- Instantiate the WASM module. The inline script below could live elsewhere inside your application code. -->
  <script type="module">
      const RDKitModule = await initRDKitModule(); // <-- Top level await

      const smiles = "CC(=O)Oc1ccccc1C(=O)O";
      const mol = RDKitModule.get_mol(smiles);
      const svg = mol.get_svg();
      console.log(svg);
  </script>
  <!-- ...your application code goes here... -->
</head>

Conclusion

After all, I got the proposed js example working. I just moved all my javascript code inside the .then statement.

Yeap, it works, but looks very messy and decreases readability.
Since most of the users are running modern browsers and my team works only with >=ES6, I really wanted that juicy syntactic sugar 🍭

I suggest adding the above example in the docs?

what do you say @MichelML

@MichelML
Copy link
Collaborator

@filoscoder this is great, definitely we should add examples with async/await soon

@filoscoder
Copy link
Author

@filoscoder this is great, definitely we should add examples with async/await soon

That's good to know, hope this example helps future users :)

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

2 participants