michael/astro
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Fix JSX tagging for anonymous higher-order components default export (#5426)

Browse source 
* Tag JSX for call expression default export

* Refactor type checks

* Add changeset
This commit is contained in:
Bjorn Lu 2022-11-17 23:46:24 +08:00 committed by GitHub
parent 539ee179f7
commit ff35b4759b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 34 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
.changeset/sixty-apricots-drum.md Normal file
View file

@ -0,0 +1,5 @@
---
'astro': patch
---
Fix JSX tagging for anonymous higher-order components default export

21
packages/astro/src/vite-plugin-jsx/tag.ts
View file

@ -65,20 +65,23 @@ export default async function tagExportsWithRenderer({
*/
enter(path) {
const node = path.node;
if (node.type !== 'ExportDefaultDeclaration') return;
if (!t.isExportDefaultDeclaration(node)) return;
if (node.declaration?.type === 'ArrowFunctionExpression') {
const uidIdentifier = path.scope.generateUidIdentifier('_arrow_function');
if (
t.isArrowFunctionExpression(node.declaration) ||
t.isCallExpression(node.declaration)
) {
const varName = t.isArrowFunctionExpression(node.declaration)
? '_arrow_function'
: '_hoc_function';
const uidIdentifier = path.scope.generateUidIdentifier(varName);
path.insertBefore(
t.variableDeclaration('const', [
t.variableDeclarator(uidIdentifier, node.declaration),
])
);
node.declaration = uidIdentifier;
} else if (
node.declaration?.type === 'FunctionDeclaration' &&
!node.declaration.id?.name
) {
} else if (t.isFunctionDeclaration(node.declaration) && !node.declaration.id?.name) {
const uidIdentifier = path.scope.generateUidIdentifier('_function');
node.declaration.id = uidIdentifier;
}
@ -86,12 +89,12 @@ export default async function tagExportsWithRenderer({
exit(path, state) {
const node = path.node;
if (node.exportKind === 'type') return;
if (node.type === 'ExportAllDeclaration') return;
if (t.isExportAllDeclaration(node)) return;
const addTag = (id: string) => {
const tags = state.get('astro:tags') ?? [];
state.set('astro:tags', [...tags, id]);
};
if (node.type === 'ExportNamedDeclaration' || node.type === 'ExportDefaultDeclaration') {
if (t.isExportNamedDeclaration(node) || t.isExportDefaultDeclaration(node)) {
if (t.isIdentifier(node.declaration)) {
addTag(node.declaration.name);
} else if (t.isFunctionDeclaration(node.declaration) && node.declaration.id?.name) {

14
packages/astro/test/fixtures/react-jsx-export/src/components/defaultExport/HocDefaultExport.jsx vendored Normal file
View file

@ -0,0 +1,14 @@
import { useState } from "react"
function withSomething(Component) {
return (props) => {
const [example] = useState('Example')
return <Component {...props} example={example} />;
};
}
function Child({ example }) {
return <h2 id="hoc_default_export">{example}</h2>
}
export default withSomething(Child)

2
packages/astro/test/fixtures/react-jsx-export/src/pages/index.astro vendored
View file

@ -3,6 +3,7 @@ import ListAsDefaultExport, {ListExport, RenamedListExport, ListExportTestCompon
import {ConstDeclarationExport, LetDeclarationExport, FunctionDeclarationExport} from '../components/DeclarationExportTest'
import AnonymousArrowDefaultExport from '../components/defaultExport/AnonymousArrowDefaultExport'
import AnonymousFunctionDefaultExport from '../components/defaultExport/AnonymousFunctionDefaultExport'
import HocDefaultExport from '../components/defaultExport/HocDefaultExport'
import NamedArrowDefaultExport from '../components/defaultExport/NamedArrowDefaultExport'
import NamedFunctionDefaultExport from '../components/defaultExport/NamedFunctionDefaultExport'
---
@ -20,5 +21,6 @@ import NamedFunctionDefaultExport from '../components/defaultExport/NamedFunctio
<AnonymousArrowDefaultExport />
<AnonymousFunctionDefaultExport />
<HocDefaultExport />
<NamedArrowDefaultExport />
<NamedFunctionDefaultExport />

1
packages/astro/test/react-jsx-export.test.js
View file

@ -18,6 +18,7 @@ describe('react-jsx-export', () => {
'renamed_list_export',
'list_as_default_export',
'list_export_test_component',
'hoc_default_export',
];
const reactInvalidHookWarning =