Skip to content

Commit 2998192

Browse files
sapphi-redsapphi-red
authored
feat(jsx-remove-attributes): add jsx-remove-attributes plugin (#22)
* feat(jsx-remove-attributes): add jsx-remove-attributes plugin * feat(swc-output-gen): add react-remove-properties plugin * test(jsx-remove-attributes): add e2e example * chore(jsx-remove-attributes): add benchmark
1 parent 30ffac4 commit 2998192

36 files changed

Lines changed: 997 additions & 1 deletion

‎.github/ISSUE_TEMPLATE/bug_report.yml‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,8 @@ body:
1717
[plugin-babel](https://github.com/rolldown/plugins/tree/main/packages/babel)
1818
- label: |
1919
[plugin-emotion](https://github.com/rolldown/plugins/tree/main/packages/emotion)
20+
- label: |
21+
[plugin-jsx-remove-attributes](https://github.com/rolldown/plugins/tree/main/packages/jsx-remove-attributes)
2022
- type: textarea
2123
id: bug-description
2224
attributes:

‎.github/ISSUE_TEMPLATE/feature_request.yml‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,8 @@ body:
1717
[plugin-babel](https://github.com/rolldown/plugins/tree/main/packages/babel)
1818
- label: |
1919
[plugin-emotion](https://github.com/rolldown/plugins/tree/main/packages/emotion)
20+
- label: |
21+
[plugin-jsx-remove-attributes](https://github.com/rolldown/plugins/tree/main/packages/jsx-remove-attributes)
2022
- type: textarea
2123
id: feature-description
2224
attributes:

‎.github/labeler.yml‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,5 @@
22
- '/- \[x\] \[plugin-babel\]/i'
33
'plugin: emotion':
44
- '/- \[x\] \[plugin-emotion\]/i'
5+
'plugin: jsx-remove-attributes':
6+
- '/- \[x\] \[plugin-jsx-remove-attributes\]/i'

‎README.md‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,12 +21,15 @@ Official Rolldown plugins
2121

2222
- [`@rolldown/plugin-babel`](https://github.com/rolldown/plugins/tree/main/packages/babel) ([![NPM version][badge-npm-version-babel]][url-npm-babel]): transform code with Babel
2323
- [`@rolldown/plugin-emotion`](https://github.com/rolldown/plugins/tree/main/packages/emotion) ([![NPM version][badge-npm-version-emotion]][url-npm-emotion]): minification and optimization of Emotion styles
24+
- [`@rolldown/plugin-jsx-remove-attributes`](https://github.com/rolldown/plugins/tree/main/packages/jsx-remove-attributes) ([![NPM version][badge-npm-version-jsx-remove-attributes]][url-npm-jsx-remove-attributes]): remove JSX attributes (e.g. data-testid)
2425

2526
## License
2627

2728
[MIT](https://github.com/rolldown/plugins/blob/main/LICENSE)
2829

2930
[badge-npm-version-babel]: https://img.shields.io/npm/v/@rolldown/plugin-babel/latest?color=brightgreen
3031
[badge-npm-version-emotion]: https://img.shields.io/npm/v/@rolldown/plugin-emotion/latest?color=brightgreen
32+
[badge-npm-version-jsx-remove-attributes]: https://img.shields.io/npm/v/@rolldown/plugin-jsx-remove-attributes/latest?color=brightgreen
3133
[url-npm-babel]: https://npmx.dev/package/@rolldown/plugin-babel/v/latest
3234
[url-npm-emotion]: https://npmx.dev/package/@rolldown/plugin-emotion/v/latest
35+
[url-npm-jsx-remove-attributes]: https://npmx.dev/package/@rolldown/plugin-jsx-remove-attributes/v/latest

‎examples/jsx-remove-attributes/index.html‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>Jsx Remove Attributes Example</title>
7+
</head>
8+
<body>
9+
<div id="root"></div>
10+
<script type="module" src="/src/main.tsx"></script>
11+
</body>
12+
</html>

‎examples/jsx-remove-attributes/jsx-remove-attributes.test.ts‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
import { expect, test } from 'vitest'
2+
import { editFile, isBuild, isServe, page } from '~utils'
3+
4+
test('should render content correctly', async () => {
5+
expect(await page.textContent('.title')).toBe('Jsx Remove Attributes Works!')
6+
})
7+
8+
test('should render description', async () => {
9+
expect(await page.textContent('.description')).toBe(
10+
'Testing attributes are removed in production.',
11+
)
12+
})
13+
14+
test.runIf(isBuild)('data-testid attributes are removed in production', async () => {
15+
const titleTestId = await page.getAttribute('.title', 'data-testid')
16+
expect(titleTestId).toBeNull()
17+
})
18+
19+
test.runIf(isBuild)('non-matching attributes are preserved', async () => {
20+
const customAttr = await page.getAttribute('.description', 'data-custom')
21+
expect(customAttr).toBe('keep-me')
22+
})
23+
24+
test.runIf(isServe)('hmr works', async () => {
25+
editFile('src/App.tsx', (code) => code.replace('Jsx Remove Attributes Works!', 'HMR Updated!'))
26+
await expect
27+
.poll(async () => {
28+
return page.textContent('.title')
29+
})
30+
.toBe('HMR Updated!')
31+
})

‎examples/jsx-remove-attributes/package.json‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
{
2+
"name": "@rolldown/example-jsx-remove-attributes",
3+
"private": true,
4+
"type": "module",
5+
"scripts": {
6+
"dev": "vite",
7+
"build": "vite build",
8+
"preview": "vite preview"
9+
},
10+
"dependencies": {
11+
"react": "^19.2.4",
12+
"react-dom": "^19.2.4"
13+
},
14+
"devDependencies": {
15+
"@rolldown/plugin-jsx-remove-attributes": "workspace:*",
16+
"@types/react": "^19.2.14",
17+
"@types/react-dom": "^19.2.3",
18+
"@vitejs/plugin-react": "^6.0.1",
19+
"vite": "^8.0.0"
20+
}
21+
}

‎examples/jsx-remove-attributes/src/App.tsx‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
export default function App() {
2+
return (
3+
<div className="app" data-testid="app-root">
4+
<h1 className="title" data-testid="title">
5+
Jsx Remove Attributes Works!
6+
</h1>
7+
<p className="description" data-test-id="desc" data-custom="keep-me">
8+
Testing attributes are removed in production.
9+
</p>
10+
<button data-testid="action-btn" data-custom="also-keep">
11+
Click me
12+
</button>
13+
</div>
14+
)
15+
}

‎examples/jsx-remove-attributes/src/main.tsx‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import { StrictMode } from 'react'
2+
import { createRoot } from 'react-dom/client'
3+
import App from './App'
4+
5+
createRoot(document.getElementById('root')!).render(
6+
<StrictMode>
7+
<App />
8+
</StrictMode>,
9+
)

‎examples/jsx-remove-attributes/vite.config.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import { defineConfig } from 'vite'
2+
import react from '@vitejs/plugin-react'
3+
import jsxRemoveAttributes from '@rolldown/plugin-jsx-remove-attributes'
4+
5+
export default defineConfig({
6+
plugins: [jsxRemoveAttributes(), react()],
7+
})

0 commit comments

Comments
 (0)