npm.io
6.1.1 • Published 2 years ago

@stylable/jest

Licence
MIT
Version
6.1.1
Deps
5
Size
12 kB
Vulns
0
Weekly
0
Stars
1.3K

@stylable/jest

npm version

@stylable/jest is a simple integration that allows testing your Stylable React components using Jest.

Installation

Install @stylable/jest as a dev dependency in your local project.

Install using npm:

npm install @stylable/jest --save-dev

Install using yarn:

yarn add @stylable/jest --dev

Usage

Add the transformer to your jest.config.js file:

module.exports = {
  transform: {
    '\\.st\\.css?
Configuring Stylable options

See the interface for StylableConfig here.

module.exports = {
  transform: {
    '\\.st\\.css?
Ignore Stylable files from exsiting css integrations

To prevent existing CSS integrations from affecting Stylable files, ignore '.st.css' in the integration configuration.

Change:

"moduleNameMapper": {
  "\\.(css|scss)$": "SOME_MOCK_PATH"
},

To:

"moduleNameMapper": {
  "(?<!\\.st)\\.(css|scss)$": "SOME_MOCK_PATH"
},
Ignoring node_modules stylesheets

To disable transformation for stylehseets originating from your node_modules add the following configuration:

module.exports = {
  // existing configuration...
  
  transformIgnorePatterns: [
    '/node_modules/(?!(.*?\\.st\\.css$))', // libraries publish .st.css files in their dist
  ],
};

License

Copyright (c) 2017 Wix.com Ltd. All Rights Reserved. Use of this source code is governed by a MIT license.

: '@stylable/jest', } };
Configuring Stylable options

See the interface for __INLINE_CODE_3__ here.

__CODE_BLOCK_3__
Ignore Stylable files from exsiting css integrations

To prevent existing CSS integrations from affecting Stylable files, ignore '.st.css' in the integration configuration.

Change:

__CODE_BLOCK_4__

To:

__CODE_BLOCK_5__
Ignoring __INLINE_CODE_4__ stylesheets

To disable transformation for stylehseets originating from your __INLINE_CODE_5__ add the following configuration:

__CODE_BLOCK_6__

License

Copyright (c) 2017 Wix.com Ltd. All Rights Reserved. Use of this source code is governed by a MIT license.

: ['@stylable/jest', { stylable: { /* Stylable options */ } }], } };
Ignore Stylable files from exsiting css integrations

To prevent existing CSS integrations from affecting Stylable files, ignore '.st.css' in the integration configuration.

Change:

__CODE_BLOCK_4__

To:

__CODE_BLOCK_5__
Ignoring __INLINE_CODE_4__ stylesheets

To disable transformation for stylehseets originating from your __INLINE_CODE_5__ add the following configuration:

__CODE_BLOCK_6__

License

Copyright (c) 2017 Wix.com Ltd. All Rights Reserved. Use of this source code is governed by a MIT license.

: '@stylable/jest', } };
Configuring Stylable options

See the interface for __INLINE_CODE_3__ here.

__CODE_BLOCK_3__
Ignore Stylable files from exsiting css integrations

To prevent existing CSS integrations from affecting Stylable files, ignore '.st.css' in the integration configuration.

Change:

__CODE_BLOCK_4__

To:

__CODE_BLOCK_5__
Ignoring __INLINE_CODE_4__ stylesheets

To disable transformation for stylehseets originating from your __INLINE_CODE_5__ add the following configuration:

__CODE_BLOCK_6__

License

Copyright (c) 2017 Wix.com Ltd. All Rights Reserved. Use of this source code is governed by a MIT license.