convert-cssxpath
v1.0.3
Published
Convert CSS into XPath
Downloads
8,299
Maintainers
Readme
#convert-cssxpath
Yet another CSS to XPath converter
Simple and correct XPath output, that's all
Install
$ npm i convert-cssxpath
Usage
Require:
var cssxpath = require('convert-cssxpath');
Convert and get string:
cssxpath.convert('a b > c');
Or call interactive console:
cssxpath.ask();
Convert and get object (dev mode):
cssxpath.convert('a:nth', true);
// returns object:
{ xpath: '//a[(position() - 1) mod 2 = 0]',
warning: 'XPath condition [position() >= 1] was omitted',
error: undefined }
Convert
When using convert(css) function - logs are printed directly in console. For example:
console.log(cssxpath.convert('[]invalid-css'));
Empty string is returned. Console logs:
// ERROR! Invalid CSS selector.
Developer mode makes it easy to overwrite logs behavior. For example:
var css = 'a b > c';
var xpath = cssxpath.convert(css, true);
console.log( xpath.error ? `Seems your CSS '${css}' was wrong!` : css );
To turn on Developer mode and receive object instead of string, simply put 'true' as the second parameter after css. Logs are not printed in console in Developer mode.
Pseudo-classes
Use :not(selector). Multiply not() arguments are fully supported:
cssxpath.convert(':not(a b > c[attr])');
Output:
//*[not(ancestor::a and parent::b and self::c[@attr])]
*Deep nesting is experimental in CSS, so it's better to avoid it.
Use :nth-of-type(nth):
cssxpath.convert('a:nth-of-type(odd)');
Output:
//a[(position() - 1) mod 2 = 0]
Use :nth-child(nth). N-based syntax (e.g. -3n+2 etc) if fully supported for all nth- pseudos:
cssxpath.convert('a+b:nth-child(n+3)');
Output:
//a/following-sibling::b[1][count(preceding-sibling::*) >= 2]
What is next
Coming soon: support of remaining pseudo-classes:
- :nth-last-child(n)
- :nth-last-of-type(n)
Test
$ npm test
- run over 250 tests
Changelog
v.1.0.1 - full support of :nth pseudos; documentation; dev mode; error fixes
v.0.0.4 - full support of :not(selector)