stylelint / jest-preset-stylelint

Common configuration options for Jest in Stylelint environments.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Adopting preset

hudochenkov opened this issue · comments

I'm modifying this preset to work with plugins and stylelint core. https://github.com/stylelint/jest-preset-stylelint/compare/adapting

I've extracted testRule into another function for dependency injection. Here's how injecting npm published stylelint into it:

// jest.setup.js
const getTestRule = require('./getTestRule');
const stylelint = require('stylelint');

global.testRule = getTestRule(stylelint);

This change keeps experience the same for plugin author as currently in master.

I started to trying this preset with stylelint-order and discovered an unpleasant surprise :( With this preset every time plugin author calls testRule they need to add plugins parameter.

In stylelint-order I have 46 calls for this function. In stylelint-scss there maybe even more calls. It's not user-friendly to add plugins in every call, because it doesn't change from call to call. What make it a little bit even more confusing, that plugins path should be from the root of the project. In my case I have test in ./rules/order/tests/index.js, but I need to put plugins: ['./'].

Possible solution is to accept plugins in getTestRule function from a branch mentioned above. This is how it will look like for the plugin author:

// jest.setup.js
const getTestRule = require('jest-preset-stylelint/getTestRule');
const stylelint = require('stylelint');
const plugins = ['./'];

global.testRule = getTestRule(stylelint, plugins);

In this case it's not confusing that path is relative to project root, because jest configuration is there. (Maybe path not from root, but relative to Jest configuration location)

With all this, I'm not sure jest-preset-stylelint could be used in a form that we currently describe in readme. I think we need rename repository (or create new). Then we just expose getTestRule and plugin author (or in stylelint core) need to use snippet just like above to add testRule in their Jest setup.

I've extracted testRule into another function for dependency injection. Here's how injecting npm published stylelint into it ... This change keeps experience the same for plugin author as currently in master.

Looking good!

With all this, I'm not sure jest-preset-stylelint could be used in a form that we currently describe in readme.

Can we do both, and allow the plugins to be defined in either the schema or getRuleTester?

The majority of the existing plugins are not plugin packs. I think having the preset ready to go in as few steps as possible would benefit the authors creating simple plugins. It reduces the barriers to getting started. We can more clearly document that the path is relative to the project root.

If an author is invested in making a plugin pack, or a more complex plugin, then I think they'll be fine taking the extra step of overriding setupFiles with their own jest-setup.js which uses getTestRule.

We could pull the plugins parameter into an optional options object to clean up the testRule signature :

global.testRule = testRule(stylelint, { plugins: ['./'] });

Therefore, in stylelint we do:

// jest-setup.js
const getTestRule = require('./getTestRule');
const stylelint = require('stylelint');

global.testRule = getTestRule(stylelint);
testRule({
  ruleName,
  config: [],
  accept: []
})

Most plugin authors do:

testRule({
  plugins: ["./"],
  ruleName,
  config: [],
  accept: []
})

Some plugin authors do:

// jest-setup.js
const getTestRule = require('jest-preset-stylelint/getTestRule');
const stylelint = require('stylelint');

global.testRule = testRule(stylelint, { plugins: ['./'] });
testRule({
  ruleName,
  config: [],
  accept: []
})