4

我目前正在尝试为使用 RCTooltip 的组件编写简单的测试：https ://github.com/react-component/tooltip

import * as Tooltip from "rc-tooltip";
console.log("qqqqqqqqqqqq: ", Tooltip);
...

<Tooltip>Hello</Tooltip>

当我在浏览器中打开应用程序时，它会打印出以下内容：

qqqqqqqqqqqq:  Module {default: ƒ, __esModule: true, Symbol(Symbol.toStringTag): "Module"}

但是，当我尝试运行此测试时：

const shallowRender = (props = {}) =>
    shallow(<Complex {...{ ...GENERIC_PROPS, ...props }} />);

describe("renders", () => {
    it("renders back and next buttons", () => {
        const wrapper = shallowRender();
        expect(1).toEqual(1);
    });
});

它打印出来：

  console.log src/shared/components/Form/Complex/index.tsx:5
    qqqqqqqqqqqq:  function Tooltip() {
        var _temp, _this, _ret;

        (0, _classCallCheck3['default'])(this, Tooltip);

        for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
          args[_key] = arguments[_key];
        }

        return _ret = (_temp = (_this = (0, _possibleConstructorReturn3['default'])(this, _Component.call.apply(_Component, [this].concat(args))), _this), _this.getPopupElement = function () {
          var _this$props = _this.props,
              arrowContent = _this$props.arrowContent,
              overlay = _this$props.overlay,
              prefixCls = _this$props.prefixCls,
              id = _this$props.id;

          return [_react2['default'].createElement(
            'div',
            { className: prefixCls + '-arrow', key: 'arrow' },
            arrowContent
          ), _react2['default'].createElement(_Content2['default'], {
            key: 'content',
            trigger: _this.trigger,
            prefixCls: prefixCls,
            id: id,
            overlay: overlay
          })];
        }, _this.saveTrigger = function (node) {
          _this.trigger = node;
        }, _temp), (0, _possibleConstructorReturn3['default'])(_this, _ret);
      }

  console.error node_modules/react/cjs/react.development.js:188
    Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

为什么进口不一样？？

这是我的package.json：

"jest": {
    "moduleNameMapper": {
        "\\.(css|less|scss|sass)$": "identity-obj-proxy",
        "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "jest-transform-file",
        "^@mahana/config$": "<rootDir>/config.dev.js"
    },
    "setupTestFrameworkScriptFile": "<rootDir>/test-setup.ts",
    "testURL": "http://localhost",
    "transform": {
        "^.+\\.tsx?$": "ts-jest"
    },
    "testPathIgnorePatterns": [
        "/.git/"
    ],
    "testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$",
    "moduleFileExtensions": [
        "ts",
        "tsx",
        "js",
        "jsx",
        "json",
        "node"
    ],
    "globals": {
        "ts-jest": {
            "enableTsDiagnostics": true
        }
    }
}

和tsconfig.json：

{
    "compilerOptions": {
        "lib": [
            "es5",
            "es6",
            "dom",
            "es2015.core",
            "es2015.collection",
            "es2015.generator",
            "es2015.iterable",
            "es2015.promise",
            "es2015.proxy",
            "es2015.reflect",
            "es2015.symbol",
            "es2015.symbol.wellknown",
            "esnext.asynciterable",
            "es2017"
        ],
        "outDir": "./dist/",
        "noImplicitAny": true,
        "module": "es6",
        "target": "es5",
        "jsx": "react",
        "moduleResolution": "node",
        "allowJs": true,
        "downlevelIteration": true
    },
    "baseUrl": ".",
    "paths": {
        "*": ["node_modules/*", "src/types/*", "migration/*"]
    },
    "exclude": ["scratch/*"]
}
4

0 回答 0