{"id":12869,"library":"babel-plugin-remove-test-ids","title":"Babel Plugin to Remove Test IDs","description":"This Babel plugin automatically strips specified `data-*` attributes (by default, `data-test-id`) from JSX elements during the build process. Its primary motivation is to clean up the production DOM by removing attributes primarily used for end-to-end testing, potentially reducing bundle size and preventing these attributes from appearing in user-facing code. Developed around a pattern suggested at React Alicante in 2017, the package is currently at version 1.1.0 and was last updated over 8 years ago. Given its lack of recent activity and minimal version changes, it is considered stable but largely unmaintained. Key differentiators include its simplicity and direct integration into the Babel pipeline, providing a compile-time solution for attribute removal without runtime overhead.","status":"abandoned","version":"1.1.0","language":"javascript","source_language":"en","source_url":"https://github.com/kutyel/babel-plugin-remove-test-ids","tags":["javascript"],"install":[{"cmd":"npm install babel-plugin-remove-test-ids","lang":"bash","label":"npm"},{"cmd":"yarn add babel-plugin-remove-test-ids","lang":"bash","label":"yarn"},{"cmd":"pnpm add babel-plugin-remove-test-ids","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"Babel plugins are configured via string names in Babel configuration files, not directly imported as JavaScript modules in application code.","wrong":"import removeTestIds from 'babel-plugin-remove-test-ids'","symbol":"Configuring in .babelrc","correct":"{\n  \"plugins\": [\n    \"remove-test-ids\"\n  ]\n}"},{"note":"Custom attributes to be removed can be specified by passing an options object as the second element of the plugin array in your Babel configuration.","symbol":"Configuring with options","correct":"{\n  \"plugins\": [\n    [\"remove-test-ids\", { \"attributes\": [\"data-test\", \"data-custom-test-attr\"] }]\n  ]\n}"},{"note":"For `babel.config.js` or `babel.config.cjs`, using `require.resolve` ensures the plugin path is correctly determined, especially in monorepos or complex project structures.","wrong":"plugins: ['remove-test-ids']","symbol":"Configuring in babel.config.js","correct":"module.exports = {\n  plugins: [\n    require.resolve('babel-plugin-remove-test-ids')\n  ]\n};"}],"quickstart":{"code":"// .babelrc or babel.config.json\n{\n  \"presets\": [\n    \"@babel/preset-react\" // Ensure React/JSX is processed\n  ],\n  \"plugins\": [\n    // This plugin removes 'data-test-id' and 'data-testid' by default\n    \"remove-test-ids\", \n    // Example of configuring custom attributes to remove\n    // [\"remove-test-ids\", { \"attributes\": [\"data-qa-id\", \"data-automation-id\"] }]\n  ]\n}\n\n// Example JSX code that would be transformed:\n// function MyComponent() {\n//   return (\n//     <div data-test-id=\"my-component\" data-qa-id=\"qa-element\">\n//       Hello World\n//     </div>\n//   );\n// }\n//\n// After Babel processing with this plugin, the attributes would be removed:\n// function MyComponent() {\n//   return (\n//     <div>\n//       Hello World\n//     </div>\n//   );\n// }","lang":"json","description":"This configuration shows how to integrate `babel-plugin-remove-test-ids` into your Babel setup to automatically strip test-related attributes from JSX during compilation."},"warnings":[{"fix":"Consider migrating to actively maintained alternatives like `babel-plugin-jsx-remove-data-test-id` or `@svgr/babel-plugin-remove-jsx-attribute` for better Babel 7+ compatibility and ongoing support.","message":"This plugin has not been updated in over 8 years and may not be fully compatible with modern Babel 7+ configurations, particularly with `@babel/core` and newer `preset-env` settings. It might require specific Babel bridge packages or older Babel versions to function correctly, leading to potential dependency conflicts.","severity":"breaking","affected_versions":"<=1.1.0"},{"fix":"Ensure `\"remove-test-ids\"` is placed before any other plugins that could transform or remove JSX attributes or elements in your Babel configuration. For environment-specific removal, configure the plugin only for production builds using Babel's `env` option.","message":"The plugin's effectiveness relies on proper ordering within your Babel configuration. It must run early in the plugin pipeline, after syntax parsing but before other plugins that might modify or remove the JSX elements themselves, to ensure the target attributes are still present when the plugin executes.","severity":"gotcha","affected_versions":"*"},{"fix":"Verify that the plugin is running at a stage where the JSX attributes are still in their original form. If using complex transformations, you might need to test the output or consider a custom Babel plugin tailored to your specific AST structure.","message":"This plugin only targets attributes present directly in JSX. If your build pipeline involves transformations that alter JSX structure significantly before this plugin runs (e.g., custom JSX factories, advanced preprocessors, or non-standard React runtimes), the attributes might not be found and removed as expected.","severity":"gotcha","affected_versions":"*"}],"env_vars":null,"last_verified":"2026-04-19T00:00:00.000Z","next_check":"2026-07-18T00:00:00.000Z","problems":[{"fix":"First, ensure the plugin is installed: `npm install babel-plugin-remove-test-ids --save-dev`. If using `babel.config.js`, specify the full path using `require.resolve('babel-plugin-remove-test-ids')`.","cause":"Babel cannot locate the installed plugin, often due to incorrect installation, an issue with Babel's resolution path, or a complex project structure like a monorepo.","error":"Error: Cannot find plugin \"remove-test-ids\" relative to file ..."},{"fix":"Ensure the plugin options are passed as a JSON object within an array, following the pattern `[\"plugin-name\", { \"optionKey\": \"value\" }]`. Double-check the plugin's documentation for its expected options structure.","cause":"This error can occur if plugin options are passed in an incorrect format or if there's a compatibility issue with how an older plugin expects options in a newer Babel environment.","error":"TypeError: options is not iterable"},{"fix":"Verify that your Babel configuration correctly applies the `remove-test-ids` plugin specifically to your production build (e.g., using Babel's `env.production` configuration). Ensure there are no conflicting plugins or transforms. Confirm that the attributes you want to remove are correctly listed in the plugin's `attributes` option if you are using custom names.","cause":"The plugin might not be correctly configured to run in the production environment, or another transformation is interfering, or the plugin itself isn't active.","error":"`data-test-id` attributes are still present in my production build."}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":null}