#How to call an async function from an integration?

37 messages · Page 1 of 1 (latest)

tepid siren
#

I'm working on a client-side search for my blog. It works by building a search index in astro:build:done. I want to add metascraper, but the API is async. Is there a way to make astro:build:done an async function, or call async functions from it? Assume I know absolutely no JavaScript or TypeScript and I'm just muddling my way through 🙂

slow seal
tepid siren
#

hm, when i do that my editor doesn't complain about the async, but it does complain about putting an await inside of it

#

is my editor wrong? 😄

#

doesn't seem like it

# 
 error   Transform failed with 1 error:
  /Users/jordan/Source/jordemort.github.io/src/search/astro.ts:29:12: ERROR: "await" can only be used inside an "async" function
  File:
    /Users/jordan/Source/jordemort.github.io/src/search/astro.ts
  Code:
    
    "await" can only be used inside an "async" function
    27 |  
    28 |              const html = fs.readFileSync(htmlpath).toString();
    29 |              await indexer.index(url, html);
       |              ^
    30 |            }
    31 |          });
#

that's the integration

marble pasture
#

what's your code?

#

ah thanks

#

you need to make
pages.forEach(({ pathname }) => {
async

slow seal
#

your callback for the foreach has to be async

#

oop you got to it first

tepid siren
#

ooh

marble pasture
tepid siren
#

i seem to be having problems waiting for completion now though :/

#

and when i build the site i get output like this: ```
Indexed https://jordemort.dev/blog/lwn-lxc-lxd-a-different-container-story/
Indexed https://jordemort.dev/blog/adding-copy-buttons-to-code-blocks/
Indexed https://jordemort.dev/blog/fixing-leaky-svg-style-tags/
Indexed https://jordemort.dev/blog/webmentions-and-pingbacks/
Indexed https://jordemort.dev/blog/caketop-website-launched/
Indexed https://jordemort.dev/blog/kill-all-the-boilerplate/
Indexed https://jordemort.dev/blog/fun-with-ccs-animation/
Indexed https://jordemort.dev/blog/tags-and-stylish-feeds/
Indexed https://jordemort.dev/blog/remark-all-the-things/
Indexed https://jordemort.dev/blog/feeds-five-ways/
Indexed https://jordemort.dev/blog/new-blog-here/
Wrote search index to /Users/jordan/Source/jordemort.github.io/dist/index.sqlite3
12:25:50 PM [build] 56 page(s) built in 4.56s
12:25:50 PM [build] Complete!
metadata? {
description: 'My portfolio & some occasional blogging',
title: 'Jordan Webb'
}
metadata? { description: 'Things that I have done', title: 'Portfolio' }
metadata? {
description: 'Development notes and technical musings',
title: 'Jordan Webb’s blog'
}

#

the stuff after let metadata = await scraper({ html, url }); doesn't fire until after astro thinks the build is done?

#

and it doesn't seem like the insertEntry after that ever runs

#

no console.log("Indexed %s with metascraper", url); lines

marble pasture
#

yeah so that's another caveat of using .forEach

#

you need to wrap it inside promise if you're using foreach with async

#

just do a for loop instead

#

and that'd work fine

#

afaik, @slow seal feel free to dive in!

tepid siren
#

ah ok

#

switched it to ```
for (var i = 0; i < pages.length; i++) {
const pathname = pages[i].pathname;
...
}

#

and that worked, is there a more elegant way?

slow seal
# 
for (const page in pages) {
  const pathname = page.pathname
}
tepid siren
#

my editor seems to think page in for (var page in pages) will be a string and when i console.log it it is 0 which is suprising

slow seal
#

You probably have to type the pages so your editor knows what type it is

tepid siren
#

yeah it really seems like for (const page in pages) { just gets me array indexes into pages, not the actual objects in pages itself

#

which is fine, i can work with that

#

thanks for your help!

marble pasture
#

awesome @tepid siren !