update types on example page

Author: caulfield

packages/demo/src/examples/example07.ts

@@ -3,6 +3,7 @@ import { type MultipleSelectInstance, multipleSelect } from 'multiple-select-van
 export default class Example {
   btnElm?: HTMLButtonElement | null;
   ms: MultipleSelectInstance[] = [];
+  ms3?: MultipleSelectInstance;
 
   mount() {
     this.ms = multipleSelect('#select1, #select2') as MultipleSelectInstance[];
@@ -12,7 +13,7 @@ export default class Example {
           resolve({ '1': 'First', '2': 'Second', '3': 'Third', '4': 'Fourth', '5': 'Fifth' });
         });
       },
-    });
+    }) as MultipleSelectInstance;
     this.btnElm = document.querySelector('.submit7');
     this.btnElm!.addEventListener('click', this.clickListener);
   }
@@ -23,8 +24,8 @@ export default class Example {
     // destroy ms instance(s) to avoid DOM leaks
     this.ms.forEach(m => m.destroy());
     this.ms = [];
-    this.ms3.destroy();
-    this.ms = undefined;
+    this.ms3?.destroy();
+    this.ms3 = undefined;
   }
 
   clickListener = () => {

playwright/e2e/example07.spec.ts

@@ -21,10 +21,12 @@ test.describe('Example 07 - Submit Data', () => {
     let dialogText = '';
     page.on('dialog', async (alert) => {
       dialogText = alert.message();
+      console.log('closing')
       await alert.dismiss();
     });
 
     await page.goto('#/example07');
+
     await page.locator('[data-test=select2].ms-parent').click();
     await page.getByRole('option').filter({ hasText: 'Third' }).locator('span').click();
     await page.getByRole('option').filter({ hasText: 'Fourth' }).locator('span').click();
@@ -41,5 +43,13 @@ test.describe('Example 07 - Submit Data', () => {
     await page.locator('[data-test=select2].ms-parent').click();
     await page.getByTestId('submit').click();
     await expect(dialogText).toBe('select1=1&select2=1&select2=2');
+
+    // select lazy loaded data
+    await page.waitForTimeout(1);
+    await page.locator('[data-test=select3].ms-parent').click();
+    await page.getByRole('option').filter({ hasText: 'First' }).locator('span').click();
+    await page.locator('[data-test=select3].ms-parent').click();
+    await page.getByTestId('submit').click();
+    await expect(dialogText).toBe('select1=1&select2=1&select2=2&select3=1');
   });
 });