Fix custom locator registration format and timing issues

Fixed the "Unknown engine" error for Playwright custom locators by:
1. Using correct registration format with {content: selectorEngineCode} instead of object format
2. Moving registration to _init() method for earlier timing
3. Creating global registry to handle multiple helper instances
4. Generating JavaScript code strings for selector engines that execute in browser context

The issue was that Playwright's selectors.register() expects JavaScript code as a string with 'content' property, not JavaScript objects directly.

Co-authored-by: kobenguyent <[email protected]>

Author: Copilot

lib/helper/Playwright.js

@@ -38,6 +38,7 @@ let playwright
 let perfTiming
 let defaultSelectorEnginesInitialized = false
 let registeredCustomLocatorStrategies = new Set()
+let globalCustomLocatorStrategies = new Map()
 
 const popupStore = new Popup()
 const consoleLogStore = new Console()
@@ -348,8 +349,18 @@ class Playwright extends Helper {
     this.customLocatorStrategies = typeof config.customLocatorStrategies === 'object' && config.customLocatorStrategies !== null ? config.customLocatorStrategies : null
     this._customLocatorsRegistered = false
 
+    // Add custom locator strategies to global registry for early registration
+    if (this.customLocatorStrategies) {
+      for (const [strategyName, strategyFunction] of Object.entries(this.customLocatorStrategies)) {
+        globalCustomLocatorStrategies.set(strategyName, strategyFunction)
+      }
+    }
+
     // override defaults with config
     this._setConfig(config)
+    
+    // Ensure _init() is called early to register custom selectors
+    this._init().catch(console.warn)
   }
 
   _validateConfig(config) {
@@ -472,6 +483,49 @@ class Playwright extends Helper {
       await playwright.selectors.register('__value', createValueEngine)
       await playwright.selectors.register('__disabled', createDisabledEngine)
       if (process.env.testIdAttribute) await playwright.selectors.setTestIdAttribute(process.env.testIdAttribute)
+      
+      // Register all custom locator strategies from the global registry
+      for (const [strategyName, strategyFunction] of globalCustomLocatorStrategies.entries()) {
+        if (!registeredCustomLocatorStrategies.has(strategyName)) {
+          try {
+            // Create a selector engine as JavaScript code string
+            const selectorEngineCode = `
+              (() => ({
+                create(root, target) {
+                  return null;
+                },
+                query(root, selector) {
+                  try {
+                    const strategyFunction = ${strategyFunction.toString()};
+                    const result = strategyFunction(selector, root);
+                    return Array.isArray(result) ? result[0] : result;
+                  } catch (error) {
+                    console.warn('Error in custom locator "${strategyName}":', error);
+                    return null;
+                  }
+                },
+                queryAll(root, selector) {
+                  try {
+                    const strategyFunction = ${strategyFunction.toString()};
+                    const result = strategyFunction(selector, root);
+                    return Array.isArray(result) ? result : result ? [result] : [];
+                  } catch (error) {
+                    console.warn('Error in custom locator "${strategyName}":', error);
+                    return [];
+                  }
+                }
+              }))()
+            `;
+
+            await playwright.selectors.register(strategyName, { content: selectorEngineCode })
+            registeredCustomLocatorStrategies.add(strategyName)
+          } catch (error) {
+            if (!error.message.includes('already registered')) {
+              console.warn(`Failed to register global custom locator strategy '${strategyName}':`, error)
+            }
+          }
+        }
+      }
     } catch (e) {
       console.warn(e)
     }
@@ -861,10 +915,6 @@ class Playwright extends Helper {
       this.debugSection('Url', target.url())
     })
 
-    // Register custom locator strategies for this helper instance
-    await this._registerCustomLocatorStrategies()
-    this._customLocatorsRegistered = true
-
     this.isRunning = true
     return this.browser
   }
@@ -893,47 +943,6 @@ class Playwright extends Helper {
     return !!(this.customLocatorStrategies && Object.keys(this.customLocatorStrategies).length > 0)
   }
 
-  async _registerCustomLocatorStrategies() {
-    if (this._isCustomLocatorStrategyDefined()) {
-      for (const [strategyName, strategyFunction] of Object.entries(this.customLocatorStrategies)) {
-        try {
-          this.debugSection('Playwright', `registering custom locator strategy: ${strategyName}`)
-
-          // Create a selector engine object similar to the default engines
-          const selectorEngine = {
-            query(root, selector) {
-              try {
-                const result = strategyFunction(selector, root);
-                return Array.isArray(result) ? result[0] : result;
-              } catch (error) {
-                console.warn(`Error in custom locator "${strategyName}":`, error);
-                return null;
-              }
-            },
-            
-            queryAll(root, selector) {
-              try {
-                const result = strategyFunction(selector, root);
-                return Array.isArray(result) ? result : result ? [result] : [];
-              } catch (error) {
-                console.warn(`Error in custom locator "${strategyName}":`, error);
-                return [];
-              }
-            }
-          }
-
-          await playwright.selectors.register(strategyName, selectorEngine)
-          registeredCustomLocatorStrategies.add(strategyName)
-        } catch (error) {
-          // Ignore "already registered" errors, warn about others
-          if (!error.message.includes('already registered')) {
-            console.warn(`Failed to register custom locator strategy '${strategyName}':`, error)
-          }
-        }
-      }
-    }
-  }
-
   /**
    * Create a new browser context with a page. \
    * Usually it should be run from a custom helper after call of `_startBrowser()`
@@ -1166,9 +1175,6 @@ class Playwright extends Helper {
     const src = new Locator(srcElement)
     const dst = new Locator(destElement)
 
-    // Ensure custom locators are registered
-    await this._ensureCustomLocatorsRegistered()
-
     if (options) {
       return this.page.dragAndDrop(buildLocatorString(src), buildLocatorString(dst), options)
     }
@@ -1330,27 +1336,6 @@ class Playwright extends Helper {
     return this.page.title()
   }
 
-  async _ensureCustomLocatorsRegistered() {
-    // Only register once, and only if we have strategies defined
-    if (this._customLocatorsRegistered || !this._isCustomLocatorStrategyDefined()) {
-      return
-    }
-
-    try {
-      // If browser isn't running yet, start it to register selectors
-      if (!this.isRunning && !this.options.manualStart) {
-        await this._startBrowser()
-      } else {
-        // If browser is running but custom locators not registered, register them now
-        await this._registerCustomLocatorStrategies()
-      }
-      this._customLocatorsRegistered = true
-    } catch (error) {
-      console.warn('Failed to register custom locators:', error.message)
-      // Continue execution - the error will surface when the locator is actually used
-    }
-  }
-
   /**
    * Get elements by different locator types, including strict locator
    * Should be used in custom helpers:
@@ -1360,9 +1345,6 @@ class Playwright extends Helper {
    * ```
    */
   async _locate(locator) {
-    // Ensure custom locators are registered before any locator operations
-    await this._ensureCustomLocatorsRegistered()
-
     const context = await this._getContext()
 
     if (this.frame) return findElements(this.frame, locator)
@@ -1394,9 +1376,6 @@ class Playwright extends Helper {
    * ```
    */
   async _locateElement(locator) {
-    // Ensure custom locators are registered before any locator operations
-    await this._ensureCustomLocatorsRegistered()
-
     const context = await this._getContext()
     return findElement(context, locator)
   }
@@ -2678,9 +2657,6 @@ class Playwright extends Helper {
     const waitTimeout = sec ? sec * 1000 : this.options.waitForTimeout
     locator = new Locator(locator, 'css')
 
-    // Ensure custom locators are registered
-    await this._ensureCustomLocatorsRegistered()
-
     const context = await this._getContext()
     try {
       await context.locator(buildLocatorString(locator)).first().waitFor({ timeout: waitTimeout, state: 'attached' })
@@ -2698,9 +2674,6 @@ class Playwright extends Helper {
     const waitTimeout = sec ? sec * 1000 : this.options.waitForTimeout
     locator = new Locator(locator, 'css')
 
-    // Ensure custom locators are registered
-    await this._ensureCustomLocatorsRegistered()
-
     const context = await this._getContext()
     let count = 0
 
@@ -2731,9 +2704,6 @@ class Playwright extends Helper {
     const waitTimeout = sec ? sec * 1000 : this.options.waitForTimeout
     locator = new Locator(locator, 'css')
 
-    // Ensure custom locators are registered
-    await this._ensureCustomLocatorsRegistered()
-
     const context = await this._getContext()
     let waiter
     let count = 0
@@ -2765,9 +2735,6 @@ class Playwright extends Helper {
     const waitTimeout = sec ? sec * 1000 : this.options.waitForTimeout
     locator = new Locator(locator, 'css')
 
-    // Ensure custom locators are registered
-    await this._ensureCustomLocatorsRegistered()
-
     const context = await this._getContext()
     let waiter
     let count = 0
@@ -2884,9 +2851,6 @@ class Playwright extends Helper {
     const waitTimeout = sec ? sec * 1000 : this.options.waitForTimeout
     const errorMessage = `Text "${text}" was not found on page after ${waitTimeout / 1000} sec.`
 
-    // Ensure custom locators are registered
-    await this._ensureCustomLocatorsRegistered()
-
     const contextObject = await this._getContext()
 
     if (context) {
@@ -3108,9 +3072,6 @@ class Playwright extends Helper {
     const waitTimeout = sec ? sec * 1000 : this.options.waitForTimeout
     locator = new Locator(locator, 'css')
 
-    // Ensure custom locators are registered
-    await this._ensureCustomLocatorsRegistered()
-
     let waiter
     const context = await this._getContext()
     if (!locator.isXPath()) {