diff --git a/tests/hooks-support-IIFE.js b/tests/hooks-support-IIFE.js new file mode 100644 index 0000000..52a8df3 --- /dev/null +++ b/tests/hooks-support-IIFE.js @@ -0,0 +1,6 @@ +// ? works with IIFE +while (item) { + ;((item) => { + useFoo() + })(item) +} diff --git a/typescript/README.md b/typescript/README.md index f05e8e0..9421c15 100644 --- a/typescript/README.md +++ b/typescript/README.md @@ -1,5 +1,7 @@ # react-refresh-typescript +This package currently matches the upstream (babel version) at https://github.com/facebook/react/commit/516b76b9ae177ecc38cc64ba33ddfc7cfe5f5a99 which means it can be used with `react-refresh@0.10.*`. + This package implements the plugin to integrate Fast Refresh into bundlers. Fast Refresh is a feature that lets you edit React components in a running application without losing their state. This package is primarily aimed at developers of bundler plugins. If you’re working on one, here is [a rough guide](https://github.com/facebook/react/issues/16604#issuecomment-528663101) for Fast Refresh integration using this package. diff --git a/typescript/__snapshots__/hooks-support-IIFE.js b/typescript/__snapshots__/hooks-support-IIFE.js new file mode 100644 index 0000000..7d1277c --- /dev/null +++ b/typescript/__snapshots__/hooks-support-IIFE.js @@ -0,0 +1,10 @@ +var _a; +_a = $RefreshSig$(); +// ? works with IIFE +while (item) { + ; + (_a((item) => { + _a(); + useFoo(); + }, "useFoo{}", true))(item); +} diff --git a/typescript/package.json b/typescript/package.json index dde409b..79837ba 100644 --- a/typescript/package.json +++ b/typescript/package.json @@ -1,6 +1,6 @@ { "name": "react-refresh-typescript", - "version": "1.1.1", + "version": "2.0.0", "description": "React Refresh transformer for TypeScript", "scripts": { "test": "jest", @@ -24,7 +24,8 @@ }, "homepage": "https://github.com/Jack-Works/react-refresh-transformer#readme", "peerDependencies": { - "typescript": "^4" + "typescript": "^4", + "react-refresh": "0.10.x" }, "devDependencies": {}, "@pika/pack": { diff --git a/typescript/src/core.ts b/typescript/src/core.ts index c0c16b9..64d6e5c 100644 --- a/typescript/src/core.ts +++ b/typescript/src/core.ts @@ -305,6 +305,7 @@ export default function (opts: Options = {}): TransformerFactory { node = newFunction // if it is an inner decl, we can update it safely if (findAncestor(oldNode.parent, ts.isFunctionLike)) node = wrapped + else if (isIIFEFunction(oldNode)) return wrapped } } return updateStatements(node, addSignatureReport) @@ -646,6 +647,12 @@ export default function (opts: Options = {}): TransformerFactory { if (['createElement', 'jsx', 'jsxs', 'jsxDEV'].includes(f)) return true return false } + function isIIFEFunction(f: HandledFunction): boolean { + let node: Node = f + while (ts.isParenthesizedExpression(node.parent)) node = node.parent + if (ts.isCallExpression(node.parent) && node.parent.expression === node) return true + return false + } } function startsWithLowerCase(str: string) {