JSPM – convert-cssxpath@1.0.3

Package Exports

convert-cssxpath
convert-cssxpath/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (convert-cssxpath) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

#convert-cssxpath

Yet another CSS to XPath converter

Simple and correct XPath output, that's all

Interactive-console-demo

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)