@quid/postcss-what-input/index.test.js

A PostCSS plugin used to make it easy to interact with the npm module "what-input".

const postcss = require('postcss');
const plugin = require('./');

function run(input, output, opts) {
  return postcss([plugin(opts)])
    .process(input, { from: undefined })
    .then(result => {
      expect(result.css).toEqual(output);
      expect(result.warnings().length).toBe(0);
    });
}

it('converts `:focus-mouse` to `initial` and `mouse` selector', () => {
  return run(
    'div:focus-mouse {}',
    '[data-whatinput="initial"] div:focus, [data-whatinput="mouse"] div:focus {}'
  );
});

it('converts `:focus-keyboard` to `keyboard` selector', () => {
  return run(
    'div:focus-keyboard {}',
    '[data-whatinput="keyboard"] div:focus {}'
  );
});

it(`doesn't transform standard :focus`, () => {
  return run('div:focus {}', 'div:focus {}');
});