babel7 object destructing fails in test cases

🐛 Bug Report

I have a react project which I recently migrated to bable7. everything works fine but when I tried to run my test cases it started failing. all of the other issue I was able to resolve except this one.
it seems like object destructuring seems to be failing when running jest

here is my component that fails.

import React from 'react';
import PropTypes from 'prop-types';
import { Input } from 'antd';

const { Search } = Input;  // jest fails here....

class TextBoxWithButton extends React.Component {
  static propTypes = {
    placeholder: PropTypes.string.isRequired,
    onAction: PropTypes.func.isRequired,
    buttonText: PropTypes.string,
  }

  static defaultProps = {
    buttonText: '',
  }

  constructor(props) {
    super(props);
    this.state = {
      value: '',
    };
  }

  onSubmit = (value) => {
    const { onAction } = this.props;
    this.setState({
      value: '',
    });
    onAction(value);
  }

  handleChange = (ev) => {
    this.setState({
      value: ev.target.value,
    });
  }

  render() {
    const { placeholder, buttonText } = this.props;
    const { value } = this.state;
    return (
      <React.Fragment>
        <Search
          placeholder={placeholder}
          onSearch={this.onSubmit}
          enterButton={buttonText}
          value={value}
          onChange={this.handleChange}
        />
      </React.Fragment>

    );
  }
}

export default TextBoxWithButton;

here is my .babelrc

{
  "presets": [
    ["@babel/preset-env", {  "modules": false, "useBuiltIns":"usage"  }],
    "@babel/preset-react"
  ],
  "plugins": [
    "react-hot-loader/babel",
    "@babel/plugin-proposal-object-rest-spread",
    "@babel/plugin-proposal-class-properties",
    "@babel/plugin-syntax-dynamic-import",
    ["import", {  "libraryName": "antd", "libraryDirectory": "es", "style": false }],
    [
      "module-resolver",
      {
        "root": [
          "./src"
        ],
        "alias": {
          "App": "./src/App",
          "Common": "./src/App/Common",
          "Elements": "./src/App/Elements",
          "Router": "./src/App/Router",
          "Constants": "./src/Constants",
          "Services": "./src/Services",
          "Store": "./src/Store",
          "Styles": "./src/Styles",
          "Assets": "./src/Assets"
        }
      }
    ]
  ],
  "env": {
    "test": {
      "presets": [
        ["@babel/preset-env"],
        "@babel/preset-react"
      ],
      "plugins": [
        "@babel/plugin-transform-modules-commonjs",
        "@babel/plugin-proposal-object-rest-spread",
        "@babel/plugin-proposal-class-properties",
        "@babel/plugin-syntax-dynamic-import",
        ["import", {  "libraryName": "antd", "style": "css" }]
      ]
    }
  }
}

here is my jest.config.js

const jestConfig = {
  verbose: true,
  moduleNameMapper: {
    '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': '<rootDir>/__mocks__/fileMock.js',
    '\\.(css|scss)$': '<rootDir>/__mocks__/styleMock.js',
  },
  transform: {
    '^.+\\.jsx?$': '<rootDir>/node_modules/babel-jest',
    '^.+\\.js?$': '<rootDir>/node_modules/babel-jest',
    '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': '<rootDir>/__mocks__/fileMock.js',
  },
  moduleFileExtensions: [
    'js',
    'jsx',
  ],
  unmockedModulePathPatterns: [
    '<rootDir>/node_modules/react/',
    '<rootDir>/node_modules/react-dom/',
  ],
  moduleDirectories: [
    'node_modules',
  ],
  transformIgnorePatterns: [
    '/node_modules/',
  ],
  coveragePathIgnorePatterns: [
    '/node_modules/',
  ],
  modulePathIgnorePatterns: [
    '/node_modules/',
  ],
  collectCoverage: true,
  coverageReporters: [
    'json',
    'lcov',
    'text',
  ],
};

module.exports = jestConfig // eslint-disable-line

here is my package.json

{
  "name": "react-app",
  "version": "1.0.0",
  "main": "index.jsx",
  "license": "MIT",
  "scripts": {
    "start": "npm run start:dev",
    "start:dev": "npm run dev-server --   --mode development --env.NODE_ENV=development --env.PROXY_ORIGIN=http://localhost:3000",
    "start:stage": "npm run dev-server --  --mode development --env.NODE_ENV=development --env.PROXY_ORIGIN=http://localhost:3001",
    "start:dev-min": "npm run start:dev -- --env.MIN_STATS=true",
    "start:analyze-speed": "npm run start:dev -- --env.addons=speedmeasure",
    "build": "npm run test && webpack --optimize-minimize --mode production --env.NODE_ENV=production --env.PUBLIC_PATH=/",
    "build:analyze-bundle": "npm run build -- --env.addons=bundleanalyzer",
    "build:analyze-buddy": "npm run build -- --env.addons=bundlebuddy",
    "dev-server": "webpack-dev-server --inline",
    "test:watch": "npm run test -- --watchAll",
    "test": "export BABEL_ENV=test&&NODE_ENV=test&& jest",
    "profile": "webpack --env.NODE_ENV=production --progress -c --profile --json  > stats.json"
  },
  "description": "this tool will be used to book consultation for clients.",
  "dependencies": {
    "@babel/polyfill": "^7.0.0",
    "antd": "^3.9.0",
    "axios": "^0.18.0",
    "moment": "^2.22.2",
    "prop-types": "^15.6.2",
    "react": "^16.4.2",
    "react-asynchronous-component": "^1.0.2",
    "react-dom": "^16.4.2",
    "react-hot-loader": "^4.3.5",
    "react-redux": "^5.0.7",
    "react-router-dom": "^4.3.1",
    "redux": "^4.0.0",
    "regenerator-runtime": "^0.12.1",
    "redux-saga": "^0.16.0"
  },
  "devDependencies": {
    "@babel/core": "^7.0.0",
    "@babel/plugin-proposal-class-properties": "^7.0.0",
    "@babel/plugin-proposal-object-rest-spread": "^7.0.0",
    "@babel/plugin-syntax-dynamic-import": "^7.0.0",
    "@babel/plugin-transform-modules-commonjs": "^7.0.0",
    "@babel/preset-env": "^7.0.0",
    "@babel/preset-react": "^7.0.0",
    "antd-scss-theme-plugin": "^1.0.7",
    "autoprefixer": "^9.1.3",
    "babel-core": "7.0.0-bridge.0",
    "babel-eslint": "^8.2.6",
    "babel-jest": "^23.4.2",
    "babel-loader": "^8.0.0",
    "babel-plugin-import": "^1.8.0",
    "babel-plugin-module-resolver": "^3.1.1",
    "bundle-buddy-webpack-plugin": "^0.3.0",
    "clean-webpack-plugin": "^0.1.19",
    "css-loader": "^1.0.0",
    "cssnano": "^4.1.0",
    "enzyme": "^3.5.0",
    "enzyme-adapter-react-16": "^1.3.1",
    "error-overlay-webpack-plugin": "^0.1.5",
    "eslint": "^5.5.0",
    "eslint-config-airbnb": "^17.1.0",
    "eslint-import-resolver-babel-module": "^5.0.0-beta.1",
    "eslint-loader": "^2.1.0",
    "eslint-plugin-css-modules": "^2.8.1",
    "eslint-plugin-import": "^2.14.0",
    "eslint-plugin-jsx-a11y": "^6.1.1",
    "eslint-plugin-react": "^7.11.1",
    "extract-text-webpack-plugin": "*",
    "fast-sass-loader": "^1.4.6",
    "file-loader": "^1.1.11",
    "glob": "^7.1.3",
    "hard-source-webpack-plugin": "^0.12.0",
    "html-webpack-plugin": "^3.2.0",
    "jest": "^23.5.0",
    "jest-cli": "^23.5.0",
    "less-loader": "^4.1.0",
    "mini-css-extract-plugin": "^0.4.2",
    "node-sass": "^4.9.3",
    "optimize-css-assets-webpack-plugin": "^5.0.1",
    "postcss-loader": "^3.0.0",
    "purify-css": "^1.2.5",
    "purifycss-webpack": "^0.7.0",
    "sass-loader": "^7.1.0",
    "speed-measure-webpack-plugin": "^1.2.2",
    "style-loader": "^0.22.1",
    "system-bell-webpack-plugin": "*",
    "uglifyjs-webpack-plugin": "^1.3.0",
    "webpack": "^4.17.1",
    "webpack-bundle-analyzer": "^2.13.1",
    "webpack-bundle-tracker": "^0.3.0",
    "webpack-cli": "^3.1.0",
    "webpack-dev-server": "^3.1.7",
    "webpack-manifest-plugin": "^2.0.3",
    "webpack-merge": "^4.1.4"
  }
}

here is the jest test runner fail output

 FAIL  src/App/Elements/__tests__/index.spec.js
  ● Test suite failed to run

    ReferenceError: Input is not defined

      3 | import { Input } from 'antd';
      4 |
    > 5 | const { Search } = Input;
        |                    ^
      6 |
      7 | class TextBoxWithButton extends React.Component {
      8 |   static propTypes = {

      at Object.Input (src/App/Elements/TextBox/TextBoxWithButton/TextBoxWithButton.component.jsx:5:20)
      at Object.<anonymous> (src/App/Elements/index.js:2:1)
      at Object.<anonymous> (src/App/Elements/__tests__/index.spec.js:1:1)

To Reproduce

install bable7 install babel-core = 7.0.0-bridge.0 use object destructring in any component. and run jest

Expected behavior

jest should be able to use babel-jest and transform es6 and process it.

[artlaman]

It’s might be not jest related. Removing babel-plugin-import ['import', { libraryName: 'antd', style: 'css' }] from babel env test configuration resolves the issue. So it’s either babel-plugin-import issue, or babel-plugin-import conflicting with some other plugin.

[gpetrioli]

Same with jest 24.8.0