fix(jsx-to-stylesheet): 修复 css module Object.assign 等callExpression 问题 (

#11705)
NervJS · Apr 23, 2022 · 0ca8117 · 0ca8117
1 parent 99eaf10
commit 0ca8117
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 1 deletion.
diff --git a/packages/babel-plugin-transform-react-jsx-to-rn-stylesheet/__tests__/index.spec.js b/packages/babel-plugin-transform-react-jsx-to-rn-stylesheet/__tests__/index.spec.js
@@ -598,6 +598,30 @@ class App extends Component {
 }`)
   })
 
+  it('Processing module style through call expression When css module enable', () => {
+    expect(getTransfromCode(`
+import { createElement, Component } from 'rax';
+import styleSheet from './app.module.scss';
+
+class App extends Component {
+  render() {
+    const a = Object.assign({}, styleSheet.red);
+    const b = Object.assign({}, a);
+    return <div className={a}><span className={b} /></div>;
+  }
+}`, false, { enableCSSModule: true })).toBe(`import { createElement, Component } from 'rax';
+import styleSheet from './app.module.scss';
+var _styleSheet = {};
+
+class App extends Component {
+  render() {
+    const a = Object.assign({}, styleSheet.red);
+    const b = Object.assign({}, a);
+    return <div style={a}><span style={b} /></div>;
+  }\n
+}`)
+  })
+
   it('merge stylesheet when css module disable', () => {
     expect(getTransfromCode(`
 import { createElement, Component } from 'rax';

diff --git a/packages/babel-plugin-transform-react-jsx-to-rn-stylesheet/src/index.ts b/packages/babel-plugin-transform-react-jsx-to-rn-stylesheet/src/index.ts
@@ -145,7 +145,15 @@ export default function (babel: {
         const binding = astPath.scope.getBinding(expression.name)
         if (binding) {
           const { node } = binding.path
-          if (isCSSMemberOrBindings(node.init, cssModuleStylesheets, astPath)) {
+          // some call expression args references like Object.assign or @babel/runtime/helpers/extends
+          if (t.isCallExpression(node.init)) {
+            const { arguments: args } = node.init
+            for (const arg of args) {
+              if (isCSSMemberOrBindings(arg, cssModuleStylesheets, astPath)) {
+                return true
+              }
+            }
+          } else if (isCSSMemberOrBindings(node.init, cssModuleStylesheets, astPath)) {
             return true
           }
         }