convert xpath to css selector
npm install --save-dev css-to-selector
import xPath2Selector from "xpath-to-selector"; const xPath = '//div[@id="foo"]/span[@class="bar"]//a[contains(@class, "baz")]//img'; const css = xPath2Selector(xPath); console.log(css); // => 'div#foo:nth-child(2) > span.bar a[class*=baz] img:nth-child(1)'
The community already have xpath-to-css. But I think it would be nice to let others see my implementation if they don't like the Python and regexp based parser for xpath.
By using a recursive parser, it allows you to parser something that is very difficult to match in Regex, for example:
import xPath2Selector from "xpath-to-selector"; const xPath = '/html/body/form/input[@id="id_username" and position()=2]'; const css = xPath2Selector(xPath); console.log(css); // => 'html > body > form > input#id_username:nth-child(2)'