diff --git a/desktop/babel-transformer/src/__tests__/flipper-requires.node.ts b/desktop/babel-transformer/src/__tests__/flipper-requires.node.ts index 78aaf54c1..2d99c50a2 100644 --- a/desktop/babel-transformer/src/__tests__/flipper-requires.node.ts +++ b/desktop/babel-transformer/src/__tests__/flipper-requires.node.ts @@ -50,6 +50,14 @@ test('transform React identifier to global.React', () => { expect(code).toBe('global.React;'); }); +test('do NOT transform local React namespace import to global.React', () => { + const src = `import * as React from 'react';`; + const ast = parse(src, {sourceType: 'module'}); + const transformed = transformFromAstSync(ast, src, babelOptions)!.ast; + const {code} = generate(transformed!); + expect(code).toMatchInlineSnapshot(`"import * as React from 'react';"`); +}); + test('throw error when requiring outside the plugin', () => { const src = 'require("../test.js")'; const ast = parse(src); diff --git a/desktop/babel-transformer/src/flipper-requires.ts b/desktop/babel-transformer/src/flipper-requires.ts index 4802ceccf..d0b33b76e 100644 --- a/desktop/babel-transformer/src/flipper-requires.ts +++ b/desktop/babel-transformer/src/flipper-requires.ts @@ -31,6 +31,12 @@ function isExcludedPath(path: string) { } return false; } +function isReactImportIdentifier(path: NodePath) { + return ( + path.parentPath.node.type === 'ImportNamespaceSpecifier' && + path.parentPath.node.local.name === 'React' + ); +} module.exports = () => ({ visitor: { CallExpression(path: NodePath, state: any) { @@ -80,6 +86,7 @@ module.exports = () => ({ if ( path.node.name === 'React' && (path.parentPath.node as any).id !== path.node && + !isReactImportIdentifier(path) && !isExcludedPath(state.file.opts.filename) ) { path.replaceWith(identifier('global.React')); diff --git a/desktop/babel-transformer/src/transform-plugin.ts b/desktop/babel-transformer/src/transform-plugin.ts index ccebdfed7..12a16da53 100644 --- a/desktop/babel-transformer/src/transform-plugin.ts +++ b/desktop/babel-transformer/src/transform-plugin.ts @@ -20,8 +20,8 @@ export default function transform({ filename: string; options: any; src: string; - presets: any[]; - plugins: any[]; + presets?: any[]; + plugins?: any[]; }) { presets = presets ?? [require('@babel/preset-react')]; plugins = plugins ?? [];