反应组件的联合测试因无法识别内置功能而失败

Question

我正在尝试为我的 React 组件编写单元测试。这是我的组件：

import React from "react";

 require("../../../../css/ads/ads.css");
 export class Ads extends React.Component {


render() {
    return (
        <div className="ads-container txt-flex-alignment">
            <a id={"dummyAdsLink" + this.props.channel.removeAllSpaces().toLowerCase() + this.props.adsId}
               href="#"
               target="_top"><img
                id={"dummyAdsImg" + this.props.channel.removeAllSpaces().toLowerCase() + this.props.adsId}
                className="img-responsive" src={this.url}
            /></a>


        </div>


    );
}

}

在上面的代码中，removeAllSpace 是我通过 javascript 原型的扩展创建的函数，如下所示：

String.prototype.removeAllSpaces = function() {
return this.replace(/\s+/g, '');
 }

这是我的测试：

import React from 'react';
 import expect from 'expect.js';
 import {shallow} from 'enzyme';
 import {Ads}  from "../../src/app/components/story/ads/Ads";
 import renderer from 'react-test-renderer';

 describe('<Ads />', () => {

    it('should render 1 <a /> components', () => {
    const wrapper = shallow(<Ads channel="whatevername"/>);
    expect(wrapper.find('a')).to.have.length(1);
 });
 });

现在，当我运行测试时，出现以下错误：

TypeError: this.props.channel.removeAllSpaces is not a function

显然它不喜欢我的 removeAllSpaces 函数..有什么想法吗？

更新：当我删除 removeAllSpaces 函数时一切正常

Answer 1

尝试将 removeAllSpaces 方法添加到测试文件中的 String 原型，我认为这应该可行。

反应组件的联合测试因无法识别内置功能而失败

unite testing of react component fails for not recognizing a built in function

mocha.js

reactjs

enzyme