fix(fixture): support function TextMatch argument in queries

Author: jrolfs

lib/fixture/helpers.ts

@@ -1,5 +1,6 @@
 const replacer = (_: string, value: unknown) => {
   if (value instanceof RegExp) return `__REGEXP ${value.toString()}`
+  if (typeof value === 'function') return `__FUNCTION ${value.toString()}`
 
   return value
 }
@@ -11,6 +12,11 @@ const reviver = (_: string, value: string) => {
     return new RegExp(match![1], match![2] || '')
   }
 
+  if (value.toString().includes('__FUNCTION ')) {
+    // eslint-disable-next-line @typescript-eslint/no-implied-eval
+    return new Function(`return (${value.split('__FUNCTION ')[1]}).apply(this, arguments)`)
+  }
+
   return value
 }
 

test/fixture/locators.test.ts

@@ -40,6 +40,28 @@ test.describe('lib/fixture.ts (locators)', () => {
       expect(await locator.textContent()).toEqual('Hello h1')
     })
 
+    test('supports function style `TextMatch`', async ({screen}) => {
+      const locator = screen.getByText(
+        // eslint-disable-next-line prefer-arrow-callback, func-names
+        function (content, element) {
+          return content.startsWith('Hello') && element?.tagName.toLowerCase() === 'h3'
+        },
+      )
+
+      expect(locator).toBeTruthy()
+      expect(await locator.textContent()).toEqual('Hello h3')
+    })
+
+    test('supports arrow function style `TextMatch`', async ({screen}) => {
+      const locator = screen.getByText(
+        (content, element) =>
+          content.startsWith('Hello') && element?.tagName.toLowerCase() === 'h3',
+      )
+
+      expect(locator).toBeTruthy()
+      expect(await locator.textContent()).toEqual('Hello h3')
+    })
+
     test('should handle the get* methods', async ({queries: {getByTestId}}) => {
       const locator = getByTestId('testid-text-input')