Await an array of Promises mapped from Object entries-CodePudding

With the following snippet code the function should await all the promises mapped from the Object entries node. For instance the $eval function comes from the Playwright library and throws an error due to the fact that the target document in which the evaluate is performed will be closed by the time that the promises should be awaited.

The above error can be fixed by nesting another await Promise.all but I'm not getting why the external await Promise.all is not properly handling the inner loop given that I'm returning an array of Promise

const tableBodyRows = await page.locator(`tbody >> tr`).elementHandles()
      await Promise.all(
        tableData[pageIndex].map(async ({ node }, idx) => {
          // await Promise.all(
            return Object.entries(node).map(async ([key, val]) => {
              const cellText = await tableBodyRows[idx].$eval(
                `td.${key.toLowerCase()}`,
                (cell: HTMLTableCellElement) => cell.textContent,
              )
              return expect(cellText).toEqual(val)
            })
          // )
        }),
      )

CodePudding user response：

As the others have said - you are returning an array of arrays. If your target is es2019 or later - you can replace the map call, with flatMap

const tableBodyRows = await page.locator(`tbody >> tr`).elementHandles()
      await Promise.all(
        tableData[pageIndex].flatMap(async ({ node }, idx) => {
          // await Promise.all(
            return Object.entries(node).map(async ([key, val]) => {
              const cellText = await tableBodyRows[idx].$eval(
                `td.${key.toLowerCase()}`,
                (cell: HTMLTableCellElement) => cell.textContent,
              )
              return expect(cellText).toEqual(val)
            })
          // )
        }),
      )

CodePudding user response：

The result of your map is an array of arrays like this:

await Promise.all([[promise1, prmise2], [promise3, promise4]])

You need to flatten input of Promise.all first like this:

  await Promise.all(
    tableData[pageIndex].reduce(async (acc, { node }, idx) => {
      return [
        ...acc,
        ...Object.entries(node).map(async ([key, val]) => {
          const cellText = await tableBodyRows[idx].$eval(
            `td.${key.toLowerCase()}`,
            (cell: HTMLTableCellElement) => cell.textContent
          );
          return expect(cellText).toEqual(val);
        }),
      ];
    }, [])
  );

CodePudding user response：

I think you want to use Promise.allSettled() instead of inner Promise.all()