babel-plugin-react-data-name

Babel plugin for adding React Component name as data attribute

Usage no npm install needed!

<script type="module">
  import babelPluginReactDataName from 'https://cdn.skypack.dev/babel-plugin-react-data-name';
</script>

README

babel-plugin-react-data-name

Overview

Babel plugin for adding meaningful identifiers to React Components. This allows our components to have a designated attribute for end-to-end integration tests (without having to add them manually).

Installation

This package is available on npm as babel-plugin-react-data-name, and you can find it here.

To install the latest stable version with Yarn:

$ yarn add --dev babel-plugin-react-data-name

Usage

BABEL CONFIG

{
  "env": {
    "development": {
      "plugins": ["react-data-name"]
    }
  }
}

CUSTOM ATTRIBUTE NAME

You can pass custom attribute name with your .bablerc.

{
  "env": {
    "development": {
      "plugins": [["react-data-name", { "property": "data-test" }]]
    }
  }
}

License

[MIT][license]