test: top level await esbuild compatibility (vitejs#3944)

packages/playground/vue/AsyncComponent.vue

@@ -0,0 +1,15 @@
+<template>
+  <h2>Async Component</h2>
+  <p>Testing TLA and for await compatibility with esbuild</p>
+  <p class="async-component">ab == {{ test }}</p>
+</template>
+
+<script setup lang="ts">
+let test = ''
+const forAwaitTest = async (array): Promise<void> => {
+  for await (const value of array) {
+    test += value
+  }
+}
+await forAwaitTest([Promise.resolve('a'), Promise.resolve('b')]).catch(() => { })
+</script>

packages/playground/vue/Main.vue

@@ -15,6 +15,9 @@
     <div class="slotted">this should be red</div>
   </Slotted>
   <ScanDep />
+  <Suspense>
+    <AsyncComponent />
+  </Suspense>
 </template>
 
 <script setup lang="ts">
@@ -27,6 +30,7 @@ import CustomBlock from './CustomBlock.vue'
 import SrcImport from './src-import/SrcImport.vue'
 import Slotted from './Slotted.vue'
 import ScanDep from './ScanDep.vue'
+import AsyncComponent from './AsyncComponent.vue'
 
 import { ref } from 'vue'
 

packages/playground/vue/__tests__/vue.spec.ts

@@ -182,3 +182,9 @@ describe('custom blocks', () => {
     expect(await page.textContent('.custom-block')).toMatch('こんにちは')
   })
 })
+
+describe('async component', () => {
+  test('should work', async () => {
+    expect(await page.textContent('.async-component')).toMatch('ab == ab')
+  })
+})