Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add JSX support. #1

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
555 changes: 355 additions & 200 deletions package-lock.json

Large diffs are not rendered by default.

5 changes: 3 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "babel-plugin-explicit-exports-references",
"version": "1.0.2",
"version": "1.0.3",
"description": "Transforms all internal references to a module's exports such that each reference starts with `module.exports` instead of directly referencing an internal name. This enables easy mocking of specific (exported) functions in Jest with Babel/TypeScript, even when the mocked functions call each other in the same module.",
"keywords": [
"babel",
Expand Down Expand Up @@ -42,7 +42,7 @@
"/README.md"
],
"scripts": {
"build": "npm run clean && tsc --project tsconfig.types.json && NODE_ENV=production webpack --config-name main",
"build": "npm run clean && tsc --project tsconfig.build.json",
"check-types": "rm -f npm.pipe; touch npm.pipe; command -v unbuffer >/dev/null; X=$?; [ $X -eq 0 ] && unbuffer tsc --project tsconfig.check-types.json >> npm.pipe; Y=$?; [ $Y -eq 0 ] && echo >> npm.pipe; unbuffer eslint --parser-options=project:tsconfig.check-types.json src >> npm.pipe; Z=$?; [ $X -ne 0 ] && tsc --project tsconfig.check-types.json >> npm.pipe && eslint --parser-options=project:tsconfig.check-types.json src >> npm.pipe; W=$?; cat npm.pipe | less -R -FX; rm npm.pipe; [ $W -eq 0 ] && [ $X -eq 1 ] || [ $X -eq 0 ] && [ $Y -eq 0 ] && [ $Z -eq 0 ]",
"clean": "rm -rf dist npm.pipe coverage external-scripts/bin",
"fixup": "npm run check-types && npm run test && npx npm-force-resolutions && npx Xunnamius/sort-package-json && npm audit",
Expand All @@ -65,6 +65,7 @@
"@babel/plugin-proposal-function-bind": "^7.18.9",
"@babel/plugin-syntax-module-string-names": "^7.12.13",
"@babel/preset-env": "^7.20.2",
"@babel/preset-react": "^7.24.7",
"@babel/preset-typescript": "^7.18.6",
"@types/babel__core": "^7.1.20",
"@types/babel-types": "^7.0.11",
Expand Down
15 changes: 13 additions & 2 deletions src/index.ts
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import { name as pkgName } from '../package.json';
import { NodePath, PluginObj, PluginPass } from '@babel/core';
import debugFactory from 'debug';
import * as util from '@babel/types';
import template from '@babel/template';

const pkgName = 'babel-plugin-explicit-exports-references';
const debug = debugFactory(`${pkgName}:index`);
let globalScope: NodePath['scope'];

Expand Down Expand Up @@ -65,7 +65,18 @@ function updateExportReferences(
return;
}

if (referencePath.isIdentifier()) {
if (
referencePath.isJSXIdentifier() ||
referencePath.parentPath?.isJSXOpeningElement()
) {
dbg(`[${prefix}] transforming type "JSX identifier"`);
const jsxElement = template.expression.ast(
`<module.exports.${mode == 'default' ? mode : exportedName} />`,
{ plugins: ['jsx'] }
) as util.JSXElement;
Comment on lines +73 to +76

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Being able to write AST snippets like this is so nice!

const jsxMemberExpression = jsxElement.openingElement.name;
referencePath.replaceWith(jsxMemberExpression);
} else if (referencePath.isIdentifier()) {
dbg(`[${prefix}] transforming type "identifier"`);
referencePath.replaceWith(
template.expression.ast`module.exports.${mode == 'default' ? mode : exportedName}`
Expand Down
2 changes: 2 additions & 0 deletions test/fixtures/transforms-jsx/code.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
export const Component = () => 'Hello World!';
export const OtherComponent = () => <Component />;
3 changes: 3 additions & 0 deletions test/fixtures/transforms-jsx/output.mjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
export const Component = () => 'Hello World!';
export const OtherComponent = () =>
/*#__PURE__*/ React.createElement(module.exports.Component, null);
1 change: 1 addition & 0 deletions test/unit-index.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ pluginTester({
targets: 'maintained node versions'
}
],
'@babel/preset-react',
['@babel/preset-typescript', { allowDeclareFields: true }]
]
}
Expand Down
7 changes: 4 additions & 3 deletions tsconfig.types.json → tsconfig.build.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,14 @@
"extends": "./tsconfig.json",
"include": ["types/**/*.ts*", "lib/**/*.ts*", "src/**/*.ts*"],
"compilerOptions": {
"outDir": "dist/types",
"outDir": "dist",
"declaration": true,
"isolatedModules": false,
"module": "commonjs",
"noEmit": false,
"checkJs": false,
"allowJs": false,
"emitDeclarationOnly": true,
"rootDir": "./"
"emitDeclarationOnly": false,
"rootDir": "./src"
}
}
3 changes: 1 addition & 2 deletions tsconfig.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,7 @@
"module": "esnext",
"allowJs": true,
"checkJs": false,
// ? Only for Next.js
// "jsx": "preserve",
"jsx": "preserve",
"declaration": true,
"isolatedModules": true,
"strict": true,
Expand Down