@rachelallyson/hero-hook-form 1.2.0 → 2.1.0

package/dist/cypress/index.js

@@ -0,0 +1,897 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __esm = (fn, res) => function __init() {
+  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/cypress/utils.ts
+function withRetry(operation, config = DEFAULT_CONFIG) {
+  if (!config.retry) {
+    return operation();
+  }
+  let attempts = 0;
+  const maxAttempts = config.maxRetries + 1;
+  const retryOperation = () => {
+    attempts++;
+    return operation().then(
+      (result) => {
+        return result;
+      },
+      (error) => {
+        if (attempts < maxAttempts) {
+          cy.log(`Retry attempt ${attempts}/${maxAttempts} for operation`);
+          cy.wait(config.retryDelay);
+          return retryOperation();
+        }
+        throw error;
+      }
+    );
+  };
+  return retryOperation();
+}
+function findFieldByLabel(label) {
+  return `label:contains("${label}")`;
+}
+function findFieldByPlaceholder(placeholder) {
+  return `input[placeholder*="${placeholder}"], textarea[placeholder*="${placeholder}"]`;
+}
+function findFieldByType(type) {
+  return HERO_UI_SELECTORS.inputs[type] || `input[type="${type}"]`;
+}
+function buildHeroUISelector(type, subtype) {
+  switch (type) {
+    case "input":
+      return subtype ? HERO_UI_SELECTORS.inputs[subtype] : "input";
+    case "textarea":
+      return HERO_UI_SELECTORS.textarea;
+    case "dropdown":
+      return subtype === "trigger" ? HERO_UI_SELECTORS.dropdown.trigger : HERO_UI_SELECTORS.dropdown.option;
+    case "checkbox":
+      return subtype === "role" ? HERO_UI_SELECTORS.checkbox.role : HERO_UI_SELECTORS.checkbox.input;
+    case "switch":
+      return subtype === "role" ? HERO_UI_SELECTORS.switch.role : HERO_UI_SELECTORS.switch.input;
+    case "radio":
+      return subtype === "group" ? HERO_UI_SELECTORS.radio.group : HERO_UI_SELECTORS.radio.input;
+    case "slider":
+      return HERO_UI_SELECTORS.slider;
+    case "button":
+      return subtype ? HERO_UI_SELECTORS.button[subtype] : HERO_UI_SELECTORS.button.generic;
+    default:
+      return "input";
+  }
+}
+function waitForStable(selector, timeout = 1e3) {
+  return cy.get(selector, { timeout }).should("be.visible");
+}
+function forceClickWithRetry(selector, config = DEFAULT_CONFIG) {
+  return withRetry(() => {
+    return cy.get(selector).click({ force: true });
+  }, config);
+}
+function typeWithClear(selector, value, options = {}) {
+  const element = cy.get(selector);
+  if (options.clear !== false) {
+    element.clear({ force: true });
+  }
+  return element.type(value, { force: true });
+}
+function logFormState() {
+  cy.get("form").then(($form) => {
+    const formData = {};
+    $form.find("input, textarea, select").each((index, element) => {
+      const $el = Cypress.$(element);
+      const name = $el.attr("name") || `field_${index}`;
+      const type = $el.attr("type") || element.tagName.toLowerCase();
+      const value = $el.val();
+      formData[name] = { type, value };
+    });
+    cy.log("Form state:", formData);
+  });
+}
+function extractFormData() {
+  return cy.get("form").then(($form) => {
+    const formData = {};
+    $form.find("input, textarea, select").each((index, element) => {
+      const $el = Cypress.$(element);
+      const name = $el.attr("name") || `field_${index}`;
+      const value = $el.val();
+      if (value !== void 0 && value !== "") {
+        formData[name] = value;
+      }
+    });
+    return formData;
+  });
+}
+function elementExists(selector) {
+  return cy.get("body").then(($body) => {
+    return $body.find(selector).length > 0;
+  });
+}
+function detectFieldType(value) {
+  if (typeof value === "boolean") return "checkbox";
+  if (typeof value === "number") return "number";
+  if (typeof value === "string") {
+    if (value.includes("@")) return "email";
+    if (/^\d{3}-\d{3}-\d{4}$/.test(value)) return "tel";
+    if (value.toLowerCase().includes("password")) return "password";
+  }
+  return "text";
+}
+var HERO_UI_SELECTORS, DEFAULT_CONFIG;
+var init_utils = __esm({
+  "src/cypress/utils.ts"() {
+    "use strict";
+    HERO_UI_SELECTORS = {
+      inputs: {
+        text: 'input[type="text"]',
+        email: 'input[type="email"]',
+        tel: 'input[type="tel"]',
+        password: 'input[type="password"]',
+        number: 'input[type="number"]',
+        url: 'input[type="url"]',
+        search: 'input[type="search"]'
+      },
+      textarea: "textarea",
+      dropdown: {
+        trigger: 'button[aria-haspopup="listbox"]',
+        option: '[role="option"]'
+      },
+      checkbox: {
+        input: 'input[type="checkbox"]',
+        role: '[role="checkbox"]'
+      },
+      switch: {
+        input: 'input[role="switch"]',
+        role: '[role="switch"]'
+      },
+      radio: {
+        input: 'input[type="radio"]',
+        group: '[role="radiogroup"]'
+      },
+      slider: 'input[type="range"]',
+      button: {
+        submit: 'button[type="submit"]',
+        reset: 'button[type="reset"]',
+        generic: "button"
+      }
+    };
+    DEFAULT_CONFIG = {
+      strict: false,
+      timeout: 4e3,
+      retry: true,
+      maxRetries: 3,
+      retryDelay: 100
+    };
+  }
+});
+
+// src/cypress/helpers.ts
+function fillInputByType(type, value, index = 0, options = {}) {
+  const selector = type === "textarea" ? buildHeroUISelector("textarea") : buildHeroUISelector("input", type);
+  const element = index > 0 ? cy.get(selector).eq(index) : cy.get(selector).first();
+  return withRetry(() => {
+    if (options.clear !== false) {
+      element.clear({ force: true });
+    }
+    return element.type(value, { force: true });
+  }, DEFAULT_CONFIG);
+}
+function fillInputByPlaceholder(placeholder, value, options = {}) {
+  const selector = `input[placeholder*="${placeholder}"], textarea[placeholder*="${placeholder}"]`;
+  return withRetry(() => {
+    const element = cy.get(selector);
+    if (options.clear !== false) {
+      element.clear({ force: true });
+    }
+    return element.type(value, { force: true });
+  }, DEFAULT_CONFIG);
+}
+function fillInputByLabel(label, value, options = {}) {
+  return withRetry(() => {
+    return cy.contains("label", label).closest("div").find("input, textarea").first().then(($el) => {
+      if (options.clear !== false) {
+        cy.wrap($el).clear({ force: true });
+      }
+      return cy.wrap($el).type(value, { force: true });
+    });
+  }, DEFAULT_CONFIG);
+}
+function fillTextarea(value, index = 0, options = {}) {
+  const selector = HERO_UI_SELECTORS.textarea;
+  return withRetry(() => {
+    const element = index > 0 ? cy.get(selector).eq(index) : cy.get(selector).first();
+    if (options.clear !== false) {
+      element.clear({ force: true });
+    }
+    return element.type(value, { force: true });
+  }, DEFAULT_CONFIG);
+}
+function selectDropdownOption(optionValue, dropdownIndex = 0) {
+  const triggerSelector = HERO_UI_SELECTORS.dropdown.trigger;
+  const optionSelector = HERO_UI_SELECTORS.dropdown.option;
+  return withRetry(() => {
+    const trigger = dropdownIndex > 0 ? cy.get(triggerSelector).eq(dropdownIndex) : cy.get(triggerSelector).first();
+    trigger.click();
+    cy.get(optionSelector).should("exist");
+    if (optionValue) {
+      cy.get(optionSelector).contains(optionValue).click({ force: true });
+    } else {
+      cy.get(optionSelector).first().click({ force: true });
+    }
+    cy.get(triggerSelector).eq(dropdownIndex).should("have.attr", "aria-expanded", "false");
+    return cy.get(triggerSelector).eq(dropdownIndex);
+  }, DEFAULT_CONFIG);
+}
+function selectDropdownByLabel(label, optionValue) {
+  return withRetry(() => {
+    cy.contains("label", label).should("exist");
+    return cy.get('button[aria-haspopup="listbox"]').first().click().then(() => {
+      cy.get('[role="option"]').should("exist");
+      if (optionValue) {
+        cy.get('[role="option"]').contains(optionValue).click({ force: true });
+      } else {
+        cy.get('[role="option"]').first().click({ force: true });
+      }
+    });
+  }, DEFAULT_CONFIG);
+}
+function checkCheckbox(index = 0) {
+  const selector = HERO_UI_SELECTORS.checkbox.input;
+  const element = index > 0 ? cy.get(selector).eq(index) : cy.get(selector).first();
+  return withRetry(() => {
+    return element.check();
+  }, DEFAULT_CONFIG);
+}
+function checkCheckboxByLabel(label) {
+  return withRetry(() => {
+    return cy.contains("label", label).closest("div").find('input[type="checkbox"]').check({ force: true });
+  }, DEFAULT_CONFIG);
+}
+function checkSwitch(index = 0) {
+  const selector = HERO_UI_SELECTORS.switch.input;
+  const element = index > 0 ? cy.get(selector).eq(index) : cy.get(selector).first();
+  return withRetry(() => {
+    return element.check();
+  }, DEFAULT_CONFIG);
+}
+function uncheckCheckbox(index = 0) {
+  const selector = HERO_UI_SELECTORS.checkbox.input;
+  const element = index > 0 ? cy.get(selector).eq(index) : cy.get(selector).first();
+  return withRetry(() => {
+    return element.uncheck();
+  }, DEFAULT_CONFIG);
+}
+function uncheckSwitch(index = 0) {
+  const selector = HERO_UI_SELECTORS.switch.input;
+  const element = index > 0 ? cy.get(selector).eq(index) : cy.get(selector).first();
+  return withRetry(() => {
+    return element.uncheck();
+  }, DEFAULT_CONFIG);
+}
+function moveSlider(value, index = 0) {
+  const selector = HERO_UI_SELECTORS.slider;
+  const element = index > 0 ? cy.get(selector).eq(index) : cy.get(selector).first();
+  return withRetry(() => {
+    return element.invoke("val", value).trigger("change");
+  }, DEFAULT_CONFIG);
+}
+function expectValidationError(message) {
+  return cy.contains(message).should("be.visible");
+}
+function expectNoValidationErrors() {
+  return cy.get("body").should("not.contain", "error").and("not.contain", "invalid");
+}
+function expectFieldError(fieldLabel, errorMessage) {
+  return cy.contains("label", fieldLabel).closest("div").should("contain", errorMessage);
+}
+function expectFieldValid(fieldLabel) {
+  return cy.contains("label", fieldLabel).closest("div").should("not.contain", "error").and("not.contain", "invalid");
+}
+function triggerValidation(submitButton = false) {
+  if (submitButton) {
+    return cy.get(HERO_UI_SELECTORS.button.submit).first().click();
+  }
+  return cy.get("input").first().blur();
+}
+function submitForm() {
+  return cy.get(HERO_UI_SELECTORS.button.submit).first().click();
+}
+function submitAndExpectSuccess(successIndicator) {
+  cy.get(HERO_UI_SELECTORS.button.submit).first().click();
+  if (successIndicator) {
+    return cy.contains(successIndicator).should("be.visible");
+  }
+  return cy.get("body").should("contain.one.of", ["success", "submitted", "complete", "thank you"]);
+}
+function submitAndExpectErrors(errorMessage, formIndex = 0) {
+  cy.get(HERO_UI_SELECTORS.button.submit).eq(formIndex).click();
+  cy.get("form").should("exist");
+  cy.wait(500);
+  if (errorMessage) {
+    cy.get("body").then(($body) => {
+      if ($body.text().includes(errorMessage)) {
+        cy.contains(errorMessage).should("be.visible");
+      } else {
+        cy.log("Expected error message not found:", errorMessage);
+        cy.get('[class*="text-danger"], [class*="text-red"], [class*="error"]').then(($errors) => {
+          cy.log("Found validation errors:", $errors.length);
+          $errors.each((index, error) => {
+            cy.log(`Error ${index}:`, error.textContent);
+          });
+        });
+        cy.contains(errorMessage).should("be.visible");
+      }
+    });
+  }
+  return cy.get("form");
+}
+function resetForm() {
+  return cy.get("body").then(($body) => {
+    if ($body.find(HERO_UI_SELECTORS.button.reset).length > 0) {
+      return cy.get(HERO_UI_SELECTORS.button.reset).click();
+    }
+    return cy.get("input, textarea").each(($el) => {
+      cy.wrap($el).clear();
+    });
+  });
+}
+function interceptFormSubmission(method, url, alias) {
+  cy.intercept(method, url).as(alias);
+  return cy.get(HERO_UI_SELECTORS.button.submit).first().click();
+}
+function verifyFormExists() {
+  return cy.get("form").should("exist");
+}
+function verifyFieldExists(selector) {
+  return cy.get(selector).should("exist");
+}
+function verifyFieldValue(type, value, index = 0) {
+  const selector = type === "textarea" ? buildHeroUISelector("textarea") : buildHeroUISelector("input", type);
+  const element = index > 0 ? cy.get(selector).eq(index) : cy.get(selector).first();
+  return element.should("have.value", value);
+}
+function verifyFieldCount(selector, count) {
+  return cy.get(selector).filter(":visible").not('[type="hidden"]').should("have.length", count);
+}
+function getFormData() {
+  return extractFormData();
+}
+function fillCompleteForm(formData) {
+  return cy.then(() => {
+    Object.entries(formData).forEach(([key, value]) => {
+      if (value === null || value === void 0) return;
+      const fieldType = detectFieldType(value);
+      switch (fieldType) {
+        case "text":
+        case "email":
+        case "tel":
+        case "password":
+        case "number":
+          fillInputByType(fieldType, String(value));
+          break;
+        case "checkbox":
+          if (value) {
+            checkCheckbox();
+          }
+          break;
+        default:
+          cy.get("body").then(($body) => {
+            if ($body.find(`label:contains("${key}")`).length > 0) {
+              fillInputByLabel(key, String(value));
+            } else {
+              fillInputByType("text", String(value));
+            }
+          });
+      }
+    });
+    return cy.get("form");
+  });
+}
+function testFieldInteraction(fieldType, value) {
+  const selector = buildHeroUISelector("input", fieldType);
+  return cy.get(selector).first().clear().type(value).should("have.value", value);
+}
+function testFormFlow(steps) {
+  return cy.then(() => {
+    steps.forEach((step, index) => {
+      cy.log(`Executing step ${index + 1}: ${step.type}`);
+      switch (step.type) {
+        case "fill":
+          if (step.field && step.value) {
+            fillInputByLabel(step.field, String(step.value));
+          }
+          break;
+        case "select":
+          if (step.field && step.value) {
+            selectDropdownByLabel(step.field, String(step.value));
+          }
+          break;
+        case "check":
+          if (step.field) {
+            checkCheckboxByLabel(step.field);
+          }
+          break;
+        case "uncheck":
+          if (step.field) {
+            cy.contains("label", step.field).closest("div").find(HERO_UI_SELECTORS.checkbox.input).uncheck();
+          }
+          break;
+        case "submit":
+          submitForm();
+          break;
+        case "wait":
+          if (step.waitTime) {
+            cy.wait(step.waitTime);
+          }
+          break;
+      }
+      if (step.expect) {
+        cy.get("body").should("contain", step.expect);
+      }
+    });
+    return cy.get("form");
+  });
+}
+function testRealTimeValidation(fieldLabel, invalidValue, expectedError) {
+  fillInputByLabel(fieldLabel, invalidValue);
+  cy.contains("label", fieldLabel).closest("div").find("input, textarea, select").blur();
+  if (expectedError) {
+    return expectFieldError(fieldLabel, expectedError);
+  } else {
+    return expectFieldError(fieldLabel, "This field is required");
+  }
+}
+function testRequiredFieldValidation(fieldLabel, expectedError) {
+  cy.contains("label", fieldLabel).closest("div").find("input, textarea, select").clear().blur();
+  if (expectedError) {
+    return expectFieldError(fieldLabel, expectedError);
+  } else {
+    return expectFieldError(fieldLabel, "This field is required");
+  }
+}
+function testEmailValidation(email, shouldBeValid) {
+  cy.get('input[type="email"]').first().clear().type(email).blur();
+  if (shouldBeValid) {
+    return expectFieldValid("Email");
+  } else {
+    return expectFieldError("Email");
+  }
+}
+function testPhoneValidation(phone, shouldBeValid) {
+  cy.get('input[type="tel"]').first().clear().type(phone).blur();
+  if (shouldBeValid) {
+    return expectFieldValid("Phone");
+  } else {
+    return expectFieldError("Phone");
+  }
+}
+function testPasswordValidation(password, shouldBeValid) {
+  cy.get('input[type="password"]').first().clear().type(password).blur();
+  if (shouldBeValid) {
+    return expectFieldValid("Password");
+  } else {
+    return expectFieldError("Password");
+  }
+}
+function testRequiredFieldsValidation() {
+  submitForm();
+  cy.get("form").should("exist");
+  return expectValidationError("required") || expectValidationError("Required");
+}
+var formSubmissionHelpers, dynamicFormHelpers, performanceHelpers, typeInferenceHelpers;
+var init_helpers = __esm({
+  "src/cypress/helpers.ts"() {
+    "use strict";
+    init_utils();
+    formSubmissionHelpers = {
+      /**
+       * Submit form and wait for success
+       */
+      submitAndWaitForSuccess: (submitButtonText = "Submit") => {
+        cy.get('button[type="submit"]').contains(submitButtonText).click();
+        cy.get('button[type="submit"]').should("contain", "Submitting");
+        cy.get('button[type="submit"]').should("contain", "Success!");
+      },
+      /**
+       * Submit form and wait for error
+       */
+      submitAndWaitForError: (submitButtonText = "Submit") => {
+        cy.get('button[type="submit"]').contains(submitButtonText).click();
+        cy.get('button[type="submit"]').should("contain", "Submitting");
+        cy.get('button[type="submit"]').should("contain", "Error");
+      },
+      /**
+       * Reset form to initial state
+       */
+      resetForm: (resetButtonText = "Reset") => {
+        cy.get('button[type="button"]').contains(resetButtonText).click();
+      },
+      /**
+       * Wait for enhanced form status
+       */
+      waitForFormStatus: (status) => {
+        if (status === "loading") {
+          cy.contains("Submitting form...").should("be.visible");
+        } else if (status === "success") {
+          cy.contains("Form submitted successfully!").should("be.visible");
+        } else if (status === "error") {
+          cy.contains("Error submitting form").should("be.visible");
+        }
+      },
+      /**
+       * Dismiss form status message
+       */
+      dismissFormStatus: () => {
+        cy.get('button[aria-label*="Dismiss"]').click();
+      }
+    };
+    dynamicFormHelpers = {
+      /**
+       * Test conditional field visibility
+       */
+      testConditionalField: (triggerField, triggerValue, conditionalFieldLabel) => {
+        fillInputByLabel(triggerField, triggerValue);
+        cy.contains("label", conditionalFieldLabel).should("be.visible");
+      },
+      /**
+       * Test conditional field hiding
+       */
+      testConditionalFieldHidden: (triggerField, triggerValue, conditionalFieldLabel) => {
+        fillInputByLabel(triggerField, triggerValue);
+        cy.contains("label", conditionalFieldLabel).should("not.exist");
+      },
+      /**
+       * Add item to field array
+       */
+      addFieldArrayItem: (addButtonText = "Add Item") => {
+        cy.get("button").contains(addButtonText).click();
+      },
+      /**
+       * Remove item from field array
+       */
+      removeFieldArrayItem: (itemIndex = 0, removeButtonText = "Remove") => {
+        cy.get("button").contains(removeButtonText).eq(itemIndex).click();
+      },
+      /**
+       * Test field array limits
+       */
+      testFieldArrayLimits: (min, max, addButtonText = "Add Item", removeButtonText = "Remove") => {
+        if (min > 0) {
+          cy.get("button").contains(removeButtonText).should("not.exist");
+        }
+        for (let i = 0; i < max; i++) {
+          cy.get("button").contains(addButtonText).click();
+        }
+        cy.get("button").contains(addButtonText).should("not.exist");
+      },
+      /**
+       * Test dynamic section visibility
+       */
+      testDynamicSection: (triggerField, triggerValue, sectionTitle) => {
+        fillInputByLabel(triggerField, triggerValue);
+        cy.contains(sectionTitle).should("be.visible");
+      },
+      /**
+       * Test dynamic section hiding
+       */
+      testDynamicSectionHidden: (triggerField, triggerValue, sectionTitle) => {
+        fillInputByLabel(triggerField, triggerValue);
+        cy.contains(sectionTitle).should("not.exist");
+      }
+    };
+    performanceHelpers = {
+      /**
+       * Test debounced validation
+       */
+      testDebouncedValidation: (fieldLabel, value, delay = 300) => {
+        fillInputByLabel(fieldLabel, value);
+        cy.wait(delay);
+        cy.get("body").should("contain", "error");
+      },
+      /**
+       * Test form performance with many fields
+       */
+      testFormPerformance: (fieldCount) => {
+        const startTime = Date.now();
+        for (let i = 0; i < fieldCount; i++) {
+          fillInputByType("text", `value${i}`);
+        }
+        const endTime = Date.now();
+        const duration = endTime - startTime;
+        cy.log(`Form with ${fieldCount} fields took ${duration}ms to fill`);
+        expect(duration).to.be.lessThan(5e3);
+      },
+      /**
+       * Test memoization by checking re-renders
+       */
+      testMemoization: (componentName) => {
+        cy.log(`Testing memoization for ${componentName}`);
+        fillInputByType("text", "test");
+        cy.log("Memoization test completed");
+      },
+      /**
+       * Add field array item for testing
+       */
+      addFieldArrayItem: (addButtonText = "Add Item") => {
+        cy.get("button").contains(addButtonText).click();
+      }
+    };
+    typeInferenceHelpers = {
+      /**
+       * Test auto-inferred form validation
+       */
+      testInferredValidation: (fieldLabel, value, shouldBeValid) => {
+        fillInputByLabel(fieldLabel, value);
+        if (shouldBeValid) {
+          expectFieldValid(fieldLabel);
+        } else {
+          expectFieldError(fieldLabel);
+        }
+      },
+      /**
+       * Test cross-field validation
+       */
+      testCrossFieldValidation: (field1, value1, field2, value2, shouldBeValid) => {
+        fillInputByLabel(field1, value1);
+        fillInputByLabel(field2, value2);
+        cy.get("input").first().blur();
+        if (shouldBeValid) {
+          expectNoValidationErrors();
+        } else {
+          expectValidationError("match");
+        }
+      },
+      /**
+       * Test password confirmation validation
+       */
+      testPasswordConfirmation: (password, confirmPassword, shouldMatch) => {
+        fillInputByLabel("Password", password);
+        fillInputByLabel("Confirm Password", confirmPassword);
+        if (shouldMatch) {
+          expectNoValidationErrors();
+        } else {
+          expectValidationError("match");
+        }
+      }
+    };
+  }
+});
+
+// src/cypress/commands.ts
+var commands_exports = {};
+var init_commands = __esm({
+  "src/cypress/commands.ts"() {
+    "use strict";
+    init_helpers();
+    Cypress.Commands.add("fillInputByType", fillInputByType);
+    Cypress.Commands.add("fillInputByPlaceholder", fillInputByPlaceholder);
+    Cypress.Commands.add("fillInputByLabel", fillInputByLabel);
+    Cypress.Commands.add("fillTextarea", fillTextarea);
+    Cypress.Commands.add("selectDropdownOption", selectDropdownOption);
+    Cypress.Commands.add("selectDropdownByLabel", selectDropdownByLabel);
+    Cypress.Commands.add("checkCheckbox", checkCheckbox);
+    Cypress.Commands.add("checkCheckboxByLabel", checkCheckboxByLabel);
+    Cypress.Commands.add("checkSwitch", checkSwitch);
+    Cypress.Commands.add("uncheckCheckbox", uncheckCheckbox);
+    Cypress.Commands.add("uncheckSwitch", uncheckSwitch);
+    Cypress.Commands.add("moveSlider", moveSlider);
+    Cypress.Commands.add("expectValidationError", expectValidationError);
+    Cypress.Commands.add("expectNoValidationErrors", expectNoValidationErrors);
+    Cypress.Commands.add("expectFieldError", expectFieldError);
+    Cypress.Commands.add("expectFieldValid", expectFieldValid);
+    Cypress.Commands.add("triggerValidation", triggerValidation);
+    Cypress.Commands.add("submitAndExpectSuccess", submitAndExpectSuccess);
+    Cypress.Commands.add("submitAndExpectErrors", submitAndExpectErrors);
+    Cypress.Commands.add("verifyFormExists", verifyFormExists);
+    Cypress.Commands.add("verifyFieldExists", verifyFieldExists);
+    Cypress.Commands.add("verifyFieldValue", verifyFieldValue);
+    Cypress.Commands.add("verifyFieldCount", verifyFieldCount);
+    Cypress.Commands.add("getFormData", getFormData);
+    Cypress.Commands.add("fillCompleteForm", fillCompleteForm);
+    Cypress.Commands.add("testFieldInteraction", testFieldInteraction);
+    Cypress.Commands.add("testFormFlow", testFormFlow);
+    Cypress.Commands.add("submitForm", submitForm);
+    Cypress.Commands.add("resetForm", resetForm);
+    Cypress.Commands.add("interceptFormSubmission", interceptFormSubmission);
+    Cypress.Commands.add("fillField", fillInputByLabel);
+    Cypress.Commands.add("selectOption", selectDropdownByLabel);
+    Cypress.Commands.add("fillEmail", (value) => fillInputByType("email", value));
+    Cypress.Commands.add("fillPhone", (value) => fillInputByType("tel", value));
+    Cypress.Commands.add("fillPassword", (value) => fillInputByType("password", value));
+    Cypress.Commands.add("fillText", (value) => fillInputByType("text", value));
+    Cypress.Commands.add("logFormState", () => {
+      cy.get("form").then(($form) => {
+        const formData = {};
+        $form.find("input, textarea, select").each((index, element) => {
+          const $el = Cypress.$(element);
+          const name = $el.attr("name") || `field_${index}`;
+          const type = $el.attr("type") || element.tagName.toLowerCase();
+          const value = $el.val();
+          formData[name] = { type, value };
+        });
+        cy.log("Form state:", formData);
+      });
+    });
+    Cypress.Commands.add("waitForFormReady", () => {
+      cy.get("form").should("exist");
+      cy.get("input, textarea, select").should("be.visible");
+    });
+    Cypress.Commands.add("clearForm", () => {
+      cy.get("input, textarea").each(($el) => {
+        cy.wrap($el).clear();
+      });
+    });
+    Cypress.Commands.add("verifyFormValid", () => {
+      cy.get("form").should("exist");
+      cy.get("body").should("not.contain", "error");
+      cy.get("body").should("not.contain", "invalid");
+    });
+    Cypress.Commands.add("screenshotForm", (name) => {
+      const screenshotName = name || `form-${Date.now()}`;
+      cy.screenshot(screenshotName);
+    });
+  }
+});
+
+// src/cypress/index.ts
+init_utils();
+init_helpers();
+function registerHeroFormCommands() {
+  init_commands();
+}
+var SETUP_INSTRUCTIONS = {
+  installation: "npm install @rachelallyson/hero-hook-form",
+  import: "import '@rachelallyson/hero-hook-form/cypress';",
+  usage: `
+    // Basic field interactions
+    cy.fillInputByType('email', 'test@example.com');
+    cy.fillInputByLabel('First Name', 'John');
+    cy.selectDropdownByLabel('Country', 'United States');
+    cy.checkCheckboxByLabel('Terms and Conditions');
+    
+    // Form submission
+    cy.submitForm();
+    cy.submitAndExpectSuccess('Thank you for your submission');
+    
+    // Validation testing
+    cy.expectValidationError('This field is required');
+    cy.expectNoValidationErrors();
+    
+    // Complex form flows
+    cy.fillCompleteForm({
+      firstName: 'John',
+      lastName: 'Doe',
+      email: 'john@example.com',
+      country: 'United States',
+      agreeToTerms: true
+    });
+  `
+};
+var COMMANDS_REFERENCE = {
+  fieldInteractions: [
+    "fillInputByType(type, value, index?, options?)",
+    "fillInputByPlaceholder(placeholder, value, options?)",
+    "fillInputByLabel(label, value, options?)",
+    "fillTextarea(value, index?, options?)",
+    "selectDropdownOption(optionValue, dropdownIndex?)",
+    "selectDropdownByLabel(label, optionValue)",
+    "checkCheckbox(index?)",
+    "checkCheckboxByLabel(label)",
+    "checkSwitch(index?)",
+    "uncheckCheckbox(index?)",
+    "uncheckSwitch(index?)",
+    "moveSlider(value, index?)"
+  ],
+  validation: [
+    "expectValidationError(message)",
+    "expectNoValidationErrors()",
+    "expectFieldError(fieldLabel, errorMessage)",
+    "expectFieldValid(fieldLabel)",
+    "triggerValidation(submitButton?)"
+  ],
+  submission: [
+    "submitForm()",
+    "submitAndExpectSuccess(successIndicator?)",
+    "submitAndExpectErrors()",
+    "resetForm()",
+    "interceptFormSubmission(method, url, alias)"
+  ],
+  state: [
+    "verifyFormExists()",
+    "verifyFieldExists(selector)",
+    "verifyFieldValue(selector, value)",
+    "verifyFieldCount(selector, count)",
+    "getFormData()"
+  ],
+  complex: [
+    "fillCompleteForm(formData)",
+    "testFieldInteraction(fieldType, value)",
+    "testFormFlow(steps)"
+  ],
+  convenience: [
+    "fillEmail(value)",
+    "fillPhone(value)",
+    "fillPassword(value)",
+    "fillText(value)"
+  ],
+  debug: [
+    "logFormState()",
+    "waitForFormReady()",
+    "clearForm()",
+    "verifyFormValid()",
+    "screenshotForm(name?)"
+  ]
+};
+if (typeof Cypress !== "undefined") {
+  registerHeroFormCommands();
+}
+export {
+  COMMANDS_REFERENCE,
+  DEFAULT_CONFIG,
+  HERO_UI_SELECTORS,
+  SETUP_INSTRUCTIONS,
+  buildHeroUISelector,
+  checkCheckbox,
+  checkCheckboxByLabel,
+  checkSwitch,
+  detectFieldType,
+  dynamicFormHelpers,
+  elementExists,
+  expectFieldError,
+  expectFieldValid,
+  expectNoValidationErrors,
+  expectValidationError,
+  extractFormData,
+  fillCompleteForm,
+  fillInputByLabel,
+  fillInputByPlaceholder,
+  fillInputByType,
+  fillTextarea,
+  findFieldByLabel,
+  findFieldByPlaceholder,
+  findFieldByType,
+  forceClickWithRetry,
+  formSubmissionHelpers,
+  getFormData,
+  interceptFormSubmission,
+  logFormState,
+  moveSlider,
+  performanceHelpers,
+  registerHeroFormCommands,
+  resetForm,
+  selectDropdownByLabel,
+  selectDropdownOption,
+  submitAndExpectErrors,
+  submitAndExpectSuccess,
+  submitForm,
+  testEmailValidation,
+  testFieldInteraction,
+  testFormFlow,
+  testPasswordValidation,
+  testPhoneValidation,
+  testRealTimeValidation,
+  testRequiredFieldValidation,
+  testRequiredFieldsValidation,
+  triggerValidation,
+  typeInferenceHelpers,
+  typeWithClear,
+  uncheckCheckbox,
+  uncheckSwitch,
+  verifyFieldCount,
+  verifyFieldExists,
+  verifyFieldValue,
+  verifyFormExists,
+  waitForStable,
+  withRetry
+};