SyntaxError: unexpected reserved word 'await' in async function

Question

Here is my code. Can't figure out why the error occured. The function is async type.

 const func = async () => { {submission[0].emoticons.map((item, idx) => { console.log('apngToFrame is working') const imgsrc = `${url}${item.id}` var container2 = document.querySelector('.output2') const response = await fetch(imgsrc) const buffer = await response.arrayBuffer() const apng = parseAPNG(buffer) if (apng instanceof Error){ console.error('apng.message', apng.message) return ; } await apng.createImages() apng.frames.forEach(f => { container2.appendChild(f.imageElement) }) })} }

Answer 1

Add async for the callback function that you are using in the map

const func = async () => {
      {submission[0].emoticons.map(async(item, idx) => {
        console.log('apngToFrame is working')
        const imgsrc = `${url}${item.id}`
        var container2 = document.querySelector('.output2')
        const response = await fetch(imgsrc)
        const buffer = await response.arrayBuffer()
        const apng = parseAPNG(buffer)
        if (apng instanceof Error){
          console.error('apng.message', apng.message)
          return ;
        }
        await apng.createImages()
        apng.frames.forEach(f => {
          container2.appendChild(f.imageElement)
        })
      })}
    }