我有一个React组件.无论好坏,我都使用js-routes公开的Routes全局对象-Rails的瑰宝.我使用Jest进行了快照测试,该快照测试了我的简单组件,该组件恰好使用了Routes全局.
在我的测试中,我想模拟Routes.因此,当我的组件调用Routes.some_path()时,我可以返回任意字符串.
我主要遇到的错误是找不到名称“ Routes”.
这是我的设置:
package.json
"jest": {
"globals": {
"ts-jest": {
"enableTsDiagnostics": true
}
},
"testEnvironment": "jsdom",
"setupFiles": [
"<rootDir>/app/javascript/__tests__/setupRoutes.ts"
]
...
setupRoutes.ts(这似乎是最受欢迎的解决方案)
const globalAny:any = global;
globalAny.Routes = {
some_path: () => {},
};
myTest.snapshot.tsx
import * as React from 'react';
import {shallow} from 'enzyme';
import toJson from 'enzyme-to-json';
import MyComponent from 'MyComponent';
describe('My Component', () => {
let component;
beforeEach(() => {
component = shallow(<MyComponent />);
});
it('should render correctly', () => {
expect(toJson(component)).toMatchSnapshot();
});
});
MyComponent.tsx
import * as React from 'react';
import * as DOM from 'react-dom';
class MyComponent extends React.Component<{}, {}> {
render() {
return <div>{Routes.some_path()}</div>;
}
}
export default MyComponent;
如果我在测试中使用console.log(window),则路由确实存在.所以我不确定为什么它不喜欢在组件中使用Routes.实际上,一定是Typescript认为它不存在,但在运行时确实如此.
我想我的问题是,如何让Typescript放松一下Routes?
解决方法:
在setupRoutes.ts中
(global as any).Routes = {
some_path: () => {}
};