Fix getAsFileSystemHandle() example (mdn#40572)

* Fix getAsFileSystemHandle() example

* Update files/en-us/web/api/datatransferitem/getasfilesystemhandle/index.md

Co-authored-by: sideshowbarker <mike@w3.org>

---------

Co-authored-by: sideshowbarker <mike@w3.org>

Author: Josh-Cena

files/en-us/web/api/datatransferitem/getasfilesystemhandle/index.md

@@ -39,6 +39,9 @@ None.
 This example uses the `getAsFileSystemHandle()` method to return
 {{domxref('FileSystemHandle', 'file handles', '', 'nocode')}} for dropped items.
 
+> [!NOTE]
+> Because `getAsFileSystemHandle()` can only retrieve the entry handle in the same tick as the `drop` event handler, there must be no `await` before it. This is why we synchronously invoke `getAsFileSystemHandle()` for all items first, and then wait for their results concurrently.
+
 ```js
 elem.addEventListener("dragover", (e) => {
   // Prevent navigation.
@@ -47,17 +50,18 @@ elem.addEventListener("dragover", (e) => {
 elem.addEventListener("drop", async (e) => {
   // Prevent navigation.
   e.preventDefault();
+  const handlesPromises = [...e.dataTransfer.items]
+    // kind will be 'file' for file/directory entries.
+    .filter((x) => x.kind === "file")
+    .map((x) => x.getAsFileSystemHandle());
+  const handles = await Promise.all(handlesPromises);
 
   // Process all of the items.
-  for (const item of e.dataTransfer.items) {
-    // kind will be 'file' for file/directory entries.
-    if (item.kind === "file") {
-      const entry = await item.getAsFileSystemHandle();
-      if (entry.kind === "file") {
-        // run code for if entry is a file
-      } else if (entry.kind === "directory") {
-        // run code for is entry is a directory
-      }
+  for (const handle of handles) {
+    if (handle.kind === "file") {
+      // run code for if handle is a file
+    } else if (handle.kind === "directory") {
+      // run code for is handle is a directory
     }
   }
 });