我目前正在尝试为使用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/*"]
}