Use CustomEvent and event naming convention

sutterj · web-flow · commit 46e0a05eb4ee · 2025-01-10T20:54:02.000Z
diff --git a/src/auto-check-element.ts b/src/auto-check-element.ts
@@ -109,7 +109,7 @@ export class AutoCheckElement extends HTMLElement {
 
     input.addEventListener('blur', changeHandler)
     input.addEventListener('input', changeHandler)
-    input.addEventListener('triggerValidation', changeHandler)
+    input.addEventListener('triggervalidation', changeHandler)
     input.autocomplete = 'off'
     input.spellcheck = false
   }
@@ -139,7 +139,7 @@ export class AutoCheckElement extends HTMLElement {
     const input = this.input
     if (!input) return
 
-    input.dispatchEvent(new Event('triggerValidation'))
+    input.dispatchEvent(new CustomEvent('triggervalidation'))
   }
 
   static get observedAttributes(): string[] {
@@ -235,7 +235,7 @@ function handleChange(checker: () => void, event: Event) {
       !autoCheckElement.validateOnKeystroke &&
       autoCheckElement.hasAttribute('dirty')) || // Only validate on blur if only-validate-on-blur is set, input is dirty, and input is not current validating on keystroke
     (event.type === 'input' && autoCheckElement.onlyValidateOnBlur && autoCheckElement.validateOnKeystroke) || // Only validate on key inputs in only-validate-on-blur mode if validate-on-keystroke is set (when input is invalid)
-    event.type === 'triggerValidation' // Trigger validation manually
+    event.type === 'triggervalidation' // Trigger validation manually
   ) {
     setLoadingState(event)
     checker()
