refactor: use contstant event names prefixes

Author: Varixo

packages/qwik/src/core/client/vnode.ts

@@ -168,6 +168,7 @@ import {
 import { mergeMaps } from '../shared/utils/maps';
 import { _EFFECT_BACK_REF } from '../reactive-primitives/types';
 import { ElementVNode, TextVNode, VirtualVNode, VNode } from './vnode-impl';
+import { EventNameHtmlScope } from '../shared/utils/event-names';
 
 //////////////////////////////////////////////////////////////////////////////////////////////////////
 
@@ -399,7 +400,7 @@ export const vnode_ensureElementInflated = (vnode: VNode) => {
         } else if (attr.value === QContainerValue.TEXT && 'value' in element) {
           mapArray_set(props, 'value', element.value, 0);
         }
-      } else if (!key.startsWith('on:')) {
+      } else if (!key.startsWith(EventNameHtmlScope.on)) {
         const value = attr.value;
         const props = vnode_getProps(elementVNode);
         mapArray_set(props, key, value, 0);

packages/qwik/src/core/shared/utils/event-names.ts

@@ -15,7 +15,7 @@ export const enum EventNameJSXScope {
   document = 'document:on',
 }
 
-const enum EventNameHtmlScope {
+export const enum EventNameHtmlScope {
   on = 'on:',
   window = 'on-window:',
   document = 'on-document:',
@@ -34,7 +34,11 @@ export const isJsxPropertyAnEventName = (name: string): boolean => {
 };
 
 export const isHtmlAttributeAnEventName = (name: string): boolean => {
-  return /^on(|-(window|document)):/.test(name);
+  return (
+    name.startsWith(EventNameHtmlScope.on) ||
+    name.startsWith(EventNameHtmlScope.window) ||
+    name.startsWith(EventNameHtmlScope.document)
+  );
 };
 
 /**

packages/qwik/src/core/ssr/ssr-render-jsx.ts

@@ -439,12 +439,6 @@ function addQwikEventToSerializationContext(
   if (match) {
     const eventName = match[3];
     serializationCtx.$eventNames$.add(eventName);
-    console.log(
-      'addQwikEventToSerializationContext',
-      key,
-      eventName,
-      serializationCtx.$eventNames$
-    );
     serializationCtx.$eventQrls$.add(qrl);
   }
 }

packages/qwik/src/core/use/use-on.ts

@@ -8,6 +8,7 @@ import type {
 } from '../shared/jsx/types/jsx-qwik-attributes';
 import type { HostElement } from '../shared/types';
 import { USE_ON_LOCAL, USE_ON_LOCAL_FLAGS, USE_ON_LOCAL_SEQ_IDX } from '../shared/utils/markers';
+import { EventNameHtmlScope } from '../shared/utils/event-names';
 
 export type EventQRL<T extends string = AllEventKeys> =
   | QRL<EventHandler<EventFromName<T>, Element>>
@@ -27,7 +28,7 @@ export type EventQRL<T extends string = AllEventKeys> =
  */
 // </docs>
 export const useOn = <T extends KnownEventNames>(event: T | T[], eventQrl: EventQRL<T>) => {
-  _useOn('on:', event, eventQrl);
+  _useOn(EventNameHtmlScope.on, event, eventQrl);
 };
 
 // <docs markdown="../readme.md#useOnDocument">
@@ -60,7 +61,7 @@ export const useOn = <T extends KnownEventNames>(event: T | T[], eventQrl: Event
  */
 // </docs>
 export const useOnDocument = <T extends KnownEventNames>(event: T | T[], eventQrl: EventQRL<T>) => {
-  _useOn('on-document:', event, eventQrl);
+  _useOn(EventNameHtmlScope.document, event, eventQrl);
 };
 
 // <docs markdown="../readme.md#useOnWindow">
@@ -94,7 +95,7 @@ export const useOnDocument = <T extends KnownEventNames>(event: T | T[], eventQr
  */
 // </docs>
 export const useOnWindow = <T extends KnownEventNames>(event: T | T[], eventQrl: EventQRL<T>) => {
-  _useOn('on-window:', event, eventQrl);
+  _useOn(EventNameHtmlScope.window, event, eventQrl);
 };
 
 const _useOn = (prefix: string, eventName: string | string[], eventQrl: EventQRL) => {

packages/qwik/src/testing/element-fixture.ts

@@ -3,7 +3,11 @@ import type { ClientContainer } from '@qwik.dev/core/internal';
 import { vi } from 'vitest';
 import { assertDefined } from '../core/shared/error/assert';
 import type { Container, QElement, QwikLoaderEventScope } from '../core/shared/types';
-import { fromCamelToKebabCase } from '../core/shared/utils/event-names';
+import {
+  EventNameHtmlScope,
+  EventNameJSXScope,
+  fromCamelToKebabCase,
+} from '../core/shared/utils/event-names';
 import { QFuncsPrefix, QInstanceAttr } from '../core/shared/utils/markers';
 import { delay } from '../core/shared/utils/promises';
 import { invokeApply, newInvokeContextFromTuple } from '../core/use/use-core';
@@ -116,7 +120,7 @@ export async function trigger(
       cancelable: true,
     });
     Object.assign(event, eventPayload);
-    const prefix = scope ? 'on' + scope + ':' : 'on:';
+    const prefix = scope ? EventNameJSXScope.on + scope + ':' : EventNameHtmlScope.on;
     const attrName = prefix + fromCamelToKebabCase(eventName);
     await dispatch(element, attrName, event, scope);
   }