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

Plugin-transform-react-jsx converts some JSXElements to CallExpression at unexpected times #8819

Open
liangpure opened this Issue Oct 6, 2018 · 1 comment

Comments

Projects
None yet
2 participants
@liangpure

liangpure commented Oct 6, 2018

Bug Report

Current Behavior
"@babel/plugin-transform-react-jsx" transformed some JSXElement in JSXExpressionContainer to CallExpression in my plugin.if remove "@babel/plugin-transform-react-jsx",it will work fine.

Input Code
astexplorer In AST explorer work rightly.

import { transformSync } from '@babel/core';
import babelPluginJsxSyntax from '@babel/plugin-syntax-jsx';

const plugin = function (babel) {
  const { types: t } = babel;
  return {
    inherits: babelPluginJsxSyntax,
    visitor: {
      JSXElement(path) {
        if (path.node.openingElement.name.name === 'TestAAA') {
          path.findParent((path) => { // eslint-disable-line
            // console.log(path);
            if (path.isJSXElement()) {
              if (path.node.openingElement.name.name === 'FormItem') {
                const labelAttr = path.node.openingElement.attributes.find(attribute => {
                  if (t.isJSXAttribute(attribute)) {
                    return attribute.name.name === 'label'
                  }
                })
                console.log('labelAttr labelAttr', t.isJSXElement(labelAttr.value.expression), labelAttr.value.expression)
                return true;
              }
            }
            return false
          })
        }
      }
    }
  };
}

const actual = transformSync(`
const test = (
  <FormItem
   colon={false}
   label={<FormattedMessage {...messages.custPartNo} />}
  >
   <TestAAA />
  </FormItem>
)
`, {
  plugins: [plugin, '@babel/plugin-transform-react-jsx']
//  if not use '@babel/plugin-transform-react-jsx', t.isJSXElement(labelAttr.value.expression) is true.
})

Expected behavior/code
expect t.isJSXElement(labelAttr.value.expression) is true, but find it is a CallExpression.If remove '@babel/plugin-transform-react-jsx', it will work fine.

Babel Configuration (.babelrc, package.json, cli command)

{
  "presets": [
    [
      "@babel/env",
      {
        "targets": {
          "node": "8.0"
        }
      }
    ]
  ]
}

Environment

  • Babel version(s): [^7.0.0]
  • Node/npm version: [Node 8/npm 5]
  • OS: [Windows 10]
  • Monorepo [e.g. yes/no/Lerna]
  • How you are using Babel: [register]

Possible Solution

Additional context/Screenshots
bugjietu

@babel-bot

This comment has been minimized.

Show comment
Hide comment
@babel-bot

babel-bot Oct 6, 2018

Collaborator

Hey @liangpure! We really appreciate you taking the time to report an issue. The collaborators
on this project attempt to help as many people as possible, but we're a limited number of volunteers,
so it's possible this won't be addressed swiftly.

If you need any help, or just have general Babel or JavaScript questions, we have a vibrant Slack
community that typically always has someone willing to help. You can sign-up here
for an invite.

Collaborator

babel-bot commented Oct 6, 2018

Hey @liangpure! We really appreciate you taking the time to report an issue. The collaborators
on this project attempt to help as many people as possible, but we're a limited number of volunteers,
so it's possible this won't be addressed swiftly.

If you need any help, or just have general Babel or JavaScript questions, we have a vibrant Slack
community that typically always has someone willing to help. You can sign-up here
for an invite.

liangpure added a commit to liangpure/babel-plugin-antd-test-class that referenced this issue Oct 8, 2018

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment