chore(test): migrate event-listen-capturer (#5494)

* chore(test): migrate event-listen-capturer

* rename test file

* migrate test

test/karma/test-app/components.d.ts

@@ -46,8 +46,6 @@ export namespace Components {
     }
     interface EventCustomType {
     }
-    interface EventListenerCapture {
-    }
     interface ExternalImportA {
     }
     interface ExternalImportB {
@@ -419,12 +417,6 @@ declare global {
         prototype: HTMLEventCustomTypeElement;
         new (): HTMLEventCustomTypeElement;
     };
-    interface HTMLEventListenerCaptureElement extends Components.EventListenerCapture, HTMLStencilElement {
-    }
-    var HTMLEventListenerCaptureElement: {
-        prototype: HTMLEventListenerCaptureElement;
-        new (): HTMLEventListenerCaptureElement;
-    };
     interface HTMLExternalImportAElement extends Components.ExternalImportA, HTMLStencilElement {
     }
     var HTMLExternalImportAElement: {
@@ -1036,7 +1028,6 @@ declare global {
         "es5-addclass-svg": HTMLEs5AddclassSvgElement;
         "esm-import": HTMLEsmImportElement;
         "event-custom-type": HTMLEventCustomTypeElement;
-        "event-listener-capture": HTMLEventListenerCaptureElement;
         "external-import-a": HTMLExternalImportAElement;
         "external-import-b": HTMLExternalImportBElement;
         "external-import-c": HTMLExternalImportCElement;
@@ -1176,8 +1167,6 @@ declare namespace LocalJSX {
     interface EventCustomType {
         "onTestEvent"?: (event: EventCustomTypeCustomEvent<TestEventDetail>) => void;
     }
-    interface EventListenerCapture {
-    }
     interface ExternalImportA {
     }
     interface ExternalImportB {
@@ -1429,7 +1418,6 @@ declare namespace LocalJSX {
         "es5-addclass-svg": Es5AddclassSvg;
         "esm-import": EsmImport;
         "event-custom-type": EventCustomType;
-        "event-listener-capture": EventListenerCapture;
         "external-import-a": ExternalImportA;
         "external-import-b": ExternalImportB;
         "external-import-c": ExternalImportC;
@@ -1550,7 +1538,6 @@ declare module "@stencil/core" {
             "es5-addclass-svg": LocalJSX.Es5AddclassSvg & JSXBase.HTMLAttributes<HTMLEs5AddclassSvgElement>;
             "esm-import": LocalJSX.EsmImport & JSXBase.HTMLAttributes<HTMLEsmImportElement>;
             "event-custom-type": LocalJSX.EventCustomType & JSXBase.HTMLAttributes<HTMLEventCustomTypeElement>;
-            "event-listener-capture": LocalJSX.EventListenerCapture & JSXBase.HTMLAttributes<HTMLEventListenerCaptureElement>;
             "external-import-a": LocalJSX.ExternalImportA & JSXBase.HTMLAttributes<HTMLExternalImportAElement>;
             "external-import-b": LocalJSX.ExternalImportB & JSXBase.HTMLAttributes<HTMLExternalImportBElement>;
             "external-import-c": LocalJSX.ExternalImportC & JSXBase.HTMLAttributes<HTMLExternalImportCElement>;

test/wdio/event-listener-capture/cmp.test.tsx

@@ -0,0 +1,26 @@
+import { h } from '@stencil/core';
+import { render } from '@wdio/browser-runner/stencil';
+
+describe('event-listener-capture', function () {
+  const eventListenerCaptureCmp = () => $('event-listener-capture');
+
+  beforeEach(() => {
+    render({
+      template: () => <event-listener-capture></event-listener-capture>,
+    });
+  });
+
+  it('should render', async () => {
+    await expect(eventListenerCaptureCmp()).toBePresent();
+  });
+
+  it('should increment counter on click', async () => {
+    const counter = $('#counter');
+    await expect(counter).toHaveText('0');
+
+    const p = eventListenerCaptureCmp().$('#incrementer');
+    await expect(p).toBePresent();
+    await p.click();
+    await expect(counter).toHaveText('1');
+  });
+});