more selector improvements

Author: christian-bromann

src/stringifyExtension.ts

@@ -278,6 +278,31 @@ export class StringifyExtension extends PuppeteerStringifyExtension {
             return formatAsJSLiteral(`=${selectors[0][0].slice(ARIA_PREFIX.length)}`)
         }
 
+        /**
+         * check if selector is an element with text, e.g.
+         * ```
+         * "selectors": [
+         *   [
+         *     "aria/Flat White $18.00"
+         *   ],
+         *   [
+         *     "#app > div:nth-child(4) > ul > li:nth-child(5) > h4"
+         *   ]
+         * ],
+         * ```
+         * then use element with text selector: h4=Flat White $18.00
+         */
+        if (
+            Array.isArray(selectors[0]) && Array.isArray(selectors[1]) &&
+            selectors[0][0].startsWith(ARIA_PREFIX) &&
+            selectors[1][0].includes(' > ')
+        ) {
+            const tagName = selectors[1][0].split('>').pop()!.trim()
+                // replace "button:nth-child(1)" with "button"
+                .split(':')[0]
+            return formatAsJSLiteral(`${tagName}=${selectors[0][0].slice(ARIA_PREFIX.length)}`)
+        }
+
         // Remove Aria selectors
         const nonAriaSelectors = this.filterArrayByString(selectors, ARIA_PREFIX)
 

test/stringifyExtension.test.ts

@@ -89,6 +89,42 @@ describe('StringifyExtension', () => {
         expect(writer.toString()).toBe('await browser.$("=Guides").setValue("webdriverio")\n')
     })
 
+    it('should fetch by text', async () => {
+        const ext = new StringifyExtension()
+        const step = {
+            type: 'change' as const,
+            value: 'webdriverio',
+            selectors: [[
+                'aria/Flat White $18.00'
+            ], [
+                '#app > div:nth-child(4) > ul > li:nth-child(5) > h4'
+            ]],
+            target: 'main',
+        }
+        const flow = { title: 'change step', steps: [step] }
+        const writer = new InMemoryLineWriter('  ')
+        await ext.stringifyStep(writer, step, flow)
+        expect(writer.toString()).toBe('await browser.$("h4=Flat White $18.00").setValue("webdriverio")\n')
+    })
+
+    it('should fetch by text with pseudo selector', async () => {
+        const ext = new StringifyExtension()
+        const step = {
+            type: 'change' as const,
+            value: 'webdriverio',
+            selectors: [[
+                'aria/Yes'
+            ], [
+                '[data-cy=add-to-cart-modal] > form > button:nth-child(1)'
+            ]],
+            target: 'main',
+        }
+        const flow = { title: 'change step', steps: [step] }
+        const writer = new InMemoryLineWriter('  ')
+        await ext.stringifyStep(writer, step, flow)
+        expect(writer.toString()).toBe('await browser.$("button=Yes").setValue("webdriverio")\n')
+    })
+
     it('should correctly exports keyDown step', async () => {
         const ext = new StringifyExtension()
         const step = {