fix(api): remove $x form the api, $$ works equally good (#544)

docs/api.md

@@ -43,7 +43,6 @@
   * [elementHandle.$$(selector)](#elementhandleselector-1)
   * [elementHandle.$$eval(selector, pageFunction[, ...args])](#elementhandleevalselector-pagefunction-args)
   * [elementHandle.$eval(selector, pageFunction[, ...args])](#elementhandleevalselector-pagefunction-args-1)
-  * [elementHandle.$x(expression)](#elementhandlexexpression)
   * [elementHandle.boundingBox()](#elementhandleboundingbox)
   * [elementHandle.click([options])](#elementhandleclickoptions)
   * [elementHandle.contentFrame()](#elementhandlecontentframe)
@@ -67,7 +66,6 @@
   * [frame.$$eval(selector, pageFunction[, ...args])](#frameevalselector-pagefunction-args)
   * [frame.$eval(selector, pageFunction[, ...args])](#frameevalselector-pagefunction-args-1)
   * [frame.$wait(selector, pageFunction[, options[, ...args]])](#framewaitselector-pagefunction-options-args)
-  * [frame.$x(expression)](#framexexpression)
   * [frame.addScriptTag(options)](#frameaddscripttagoptions)
   * [frame.addStyleTag(options)](#frameaddstyletagoptions)
   * [frame.childFrames()](#framechildframes)
@@ -138,7 +136,6 @@
   * [page.$$eval(selector, pageFunction[, ...args])](#pageevalselector-pagefunction-args)
   * [page.$eval(selector, pageFunction[, ...args])](#pageevalselector-pagefunction-args-1)
   * [page.$wait(selector, pageFunction[, options[, ...args]])](#pagewaitselector-pagefunction-options-args)
-  * [page.$x(expression)](#pagexexpression)
   * [page.accessibility](#pageaccessibility)
   * [page.addScriptTag(options)](#pageaddscripttagoptions)
   * [page.addStyleTag(options)](#pageaddstyletagoptions)
@@ -714,12 +711,6 @@ expect(await tweetHandle.$eval('.like', node => node.innerText)).toBe('100');
 expect(await tweetHandle.$eval('.retweets', node => node.innerText)).toBe('10');
 ```
 
-#### elementHandle.$x(expression)
-- `expression` <[string]> Expression to [evaluate](https://developer.mozilla.org/en-US/docs/Web/API/Document/evaluate).
-- returns: <[Promise]<[Array]<[ElementHandle]>>>
-
-The method evaluates the XPath expression relative to the elementHandle. If there are no such elements, the method will resolve to an empty array.
-
 #### elementHandle.boundingBox()
 - returns: <[Promise]<?[Object]>>
   - x <[number]> the x coordinate of the element in pixels.
@@ -1000,12 +991,6 @@ This method runs `document.querySelector` within the frame and passes it as the
 If `pageFunction` returns a [Promise], then `page.$wait` would wait for the promise to resolve and return its value. The function
 is being called on the element periodically until either timeout expires or the function returns the truthy value.
 
-#### frame.$x(expression)
-- `expression` <[string]> Expression to [evaluate](https://developer.mozilla.org/en-US/docs/Web/API/Document/evaluate).
-- returns: <[Promise]<[Array]<[ElementHandle]>>>
-
-The method evaluates the XPath expression.
-
 #### frame.addScriptTag(options)
 - `options` <[Object]>
   - `url` <[string]> URL of a script to be added.
@@ -1917,14 +1902,6 @@ is being called on the element periodically until either timeout expires or the
 
 Shortcut for [page.mainFrame().$wait(selector, pageFunction[, options[, ...args]])](#framewaitselector-pagefunction-options-args).
 
-#### page.$x(expression)
-- `expression` <[string]> Expression to [evaluate](https://developer.mozilla.org/en-US/docs/Web/API/Document/evaluate).
-- returns: <[Promise]<[Array]<[ElementHandle]>>>
-
-The method evaluates the XPath expression.
-
-Shortcut for [page.mainFrame().$x(expression)](#framexexpression)
-
 #### page.accessibility
 - returns: <[Accessibility]>
 

src/dom.ts

@@ -472,10 +472,6 @@ export class ElementHandle<T extends Node = Node> extends js.JSHandle<T> {
     return result;
   }
 
-  $x(expression: string): Promise<ElementHandle<Element>[]> {
-    return this._context._$$('xpath=' + expression, this);
-  }
-
   visibleRatio(): Promise<number> {
     return this._evaluateInUtility(async (node: Node) => {
       if (node.nodeType !== Node.ELEMENT_NODE)

src/frames.ts

@@ -421,11 +421,6 @@ export class Frame {
     return handle;
   }
 
-  async $x(expression: string): Promise<dom.ElementHandle<Element>[]> {
-    const context = await this._mainContext();
-    return context._$$('xpath=' + expression);
-  }
-
   $eval: types.$Eval = async (selector, pageFunction, ...args) => {
     const context = await this._mainContext();
     const elementHandle = await context._$(selector);

src/page.ts

@@ -221,10 +221,6 @@ export class Page extends platform.EventEmitter {
     return this.mainFrame().$$(selector);
   }
 
-  async $x(expression: string): Promise<dom.ElementHandle<Element>[]> {
-    return this.mainFrame().$x(expression);
-  }
-
   async addScriptTag(options: { url?: string; path?: string; content?: string; type?: string; }): Promise<dom.ElementHandle> {
     return this.mainFrame().addScriptTag(options);
   }

test/queryselector.spec.js

@@ -220,25 +220,24 @@ module.exports.describe = function({testRunner, expect, product, FFOX, CHROMIUM,
     });
   });
 
-  describe('Path.$x', function() {
+  describe('Page.$$ xpath', function() {
     it('should query existing element', async({page, server}) => {
       await page.setContent('<section>test</section>');
-      const elements = await page.$x('/html/body/section');
+      const elements = await page.$$('xpath=/html/body/section');
       expect(elements[0]).toBeTruthy();
       expect(elements.length).toBe(1);
     });
     it('should return empty array for non-existing element', async({page, server}) => {
-      const element = await page.$x('/html/body/non-existing-element');
+      const element = await page.$$('//html/body/non-existing-element');
       expect(element).toEqual([]);
     });
     it('should return multiple elements', async({page, sever}) => {
       await page.setContent('<div></div><div></div>');
-      const elements = await page.$x('/html/body/div');
+      const elements = await page.$$('xpath=/html/body/div');
       expect(elements.length).toBe(2);
     });
   });
 
-
   describe('ElementHandle.$', function() {
     it('should query existing element', async({page, server}) => {
       await page.goto(server.PREFIX + '/playground.html');
@@ -336,13 +335,13 @@ module.exports.describe = function({testRunner, expect, product, FFOX, CHROMIUM,
   });
 
 
-  describe('ElementHandle.$x', function() {
+  describe('ElementHandle.$$ xpath', function() {
     it('should query existing element', async({page, server}) => {
       await page.goto(server.PREFIX + '/playground.html');
       await page.setContent('<html><body><div class="second"><div class="inner">A</div></div></body></html>');
       const html = await page.$('html');
-      const second = await html.$x(`./body/div[contains(@class, 'second')]`);
-      const inner = await second[0].$x(`./div[contains(@class, 'inner')]`);
+      const second = await html.$$(`xpath=./body/div[contains(@class, 'second')]`);
+      const inner = await second[0].$$(`xpath=./div[contains(@class, 'inner')]`);
       const content = await page.evaluate(e => e.textContent, inner[0]);
       expect(content).toBe('A');
     });
@@ -350,7 +349,7 @@ module.exports.describe = function({testRunner, expect, product, FFOX, CHROMIUM,
     it('should return null for non-existing element', async({page, server}) => {
       await page.setContent('<html><body><div class="second"><div class="inner">B</div></div></body></html>');
       const html = await page.$('html');
-      const second = await html.$x(`/div[contains(@class, 'third')]`);
+      const second = await html.$$(`xpath=/div[contains(@class, 'third')]`);
       expect(second).toEqual([]);
     });
   });