diff --git a/src/injected/cssSelectorEngine.ts b/src/injected/cssSelectorEngine.ts index 2888b0e505..21421fbee5 100644 --- a/src/injected/cssSelectorEngine.ts +++ b/src/injected/cssSelectorEngine.ts @@ -201,6 +201,9 @@ function split(selector: string): string[] { } else if (c === quote) { quote = undefined; index++; + } else if (c === '\'' || c === '"') { + quote = c; + index++; } else { index++; } diff --git a/test/queryselector.spec.js b/test/queryselector.spec.js index 8218fbc4a0..82977cea9a 100644 --- a/test/queryselector.spec.js +++ b/test/queryselector.spec.js @@ -147,6 +147,32 @@ describe('Page.$eval', function() { expect(await page.$eval(`div >> [placeholder="Select date"]`, e => e.outerHTML)).toBe(''); expect(await page.$eval(`div >> [placeholder='Select date']`, e => e.outerHTML)).toBe(''); }); + it('should work with quotes in css attributes', async({page, server}) => { + await page.setContent('
'); + expect(await page.$(`[placeholder="Select\\"date"]`)).toBeTruthy(); + expect(await page.$(`[placeholder='Select"date']`)).toBeTruthy(); + await page.setContent('
'); + expect(await page.$(`[placeholder="Select \\" date"]`)).toBeTruthy(); + expect(await page.$(`[placeholder='Select " date']`)).toBeTruthy(); + await page.setContent('
'); + expect(await page.$(`[placeholder="Select'date"]`)).toBeTruthy(); + expect(await page.$(`[placeholder='Select\\'date']`)).toBeTruthy(); + await page.setContent('
'); + expect(await page.$(`[placeholder="Select ' date"]`)).toBeTruthy(); + expect(await page.$(`[placeholder='Select \\' date']`)).toBeTruthy(); + }); + it('should work with spaces in css attributes when missing', async({page, server}) => { + const inputPromise = page.waitForSelector(`[placeholder="Select date"]`); + expect(await page.$(`[placeholder="Select date"]`)).toBe(null); + await page.setContent('
'); + await inputPromise; + }); + it('should work with quotes in css attributes when missing', async({page, server}) => { + const inputPromise = page.waitForSelector(`[placeholder="Select\\"date"]`); + expect(await page.$(`[placeholder="Select\\"date"]`)).toBe(null); + await page.setContent('
'); + await inputPromise; + }); }); describe('Page.$$eval', function() {