🐛 Support function text matchers in queries

.github/workflows/build.yml

@@ -17,7 +17,7 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node: ['12', '14', '16']
+        node: ['14', '16', '18']
         # TODO: technically we still support down to 1.12 but `locator.waitFor`
         # was introduced in 1.16 so anything earlier blows up type-checking.
         # This minimum will be bumped in the next breaking release that will be
@@ -68,7 +68,7 @@ jobs:
           npm why @playwright/test
           npm run test:legacy
 
-      # Only release on Node 14
+      # Only release on Node 16
 
       - name: Upload Coverage / Release / Playwright
         run: npm run ci-after-success
@@ -99,13 +99,13 @@ jobs:
         run: echo ::set-output name=branch::${GITHUB_REF#refs/*/}
 
       - name: Release / Playwright Test (latest)
-        if: ${{ matrix.node == '14' && matrix.playwright == 'latest' && steps.did-release.outputs.released == 'true' && steps.branch.outputs.branch == 'main' }}
+        if: ${{ matrix.node == '16' && matrix.playwright == 'latest' && steps.did-release.outputs.released == 'true' && steps.branch.outputs.branch == 'main' }}
         run: |
           npm run prepare:playwright-test
           npm publish --access=public
 
       - name: Release / Playwright Test (pre-release)
-        if: ${{ matrix.node == '14' && matrix.playwright == 'latest' && steps.did-release.outputs.released == 'true' && steps.branch.outputs.branch != 'main' }}
+        if: ${{ matrix.node == '16' && matrix.playwright == 'latest' && steps.did-release.outputs.released == 'true' && steps.branch.outputs.branch != 'main' }}
         run: |
           npm run prepare:playwright-test
           npm publish --access=public --tag=${{ steps.branch.outputs.branch }}

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')