Sinon: метод компонента Test React вызывает функцию pass как опору (Mocha + Chai + Sinon используется для модульного теста) - PullRequest
Новая
       26

Sinon: метод компонента Test React вызывает функцию pass как опору (Mocha + Chai + Sinon используется для модульного теста)

0 голосов
/ 15 ноября 2018

У меня есть реактивный компонент, у которого есть метод 

export class Hit extends React.Component {
    constructor(props) {
        super(props);
        this.triggerClick= this.triggerClick.bind(this);
    }

triggerClick(event) {
    this.props.triggerClick(event.target.click);
}

render() {
    return (
....................................
                        <input ........ onChange={this.triggerClick} />
.............................................
           );
    }
}

Я хочу проверить, вызывается ли метод triggerClick (событие) или нет. Следовательно, я вставляю код, связанный с этим. Хотя, если вы видите в логах hitComponent что-то вроде ниже,

onChange: [Функция: привязанный триггерClick]

журнал шпионов говорит, что он не вызывается. Не уверен, где я иду не так. 

let mockFunction = sinon.fake();

let hitComponent = renderShallow(<Hit ........ triggerClick= {mockFunction}/>)

let spy = sinon.spy(Hit.prototype, 'triggerClick');

console.log(hitComponent)
console.log(spy)

о / р: hitComponent: 

[ { '$$typeof': Symbol(react.element),
    type: 'input',
    key: null,
    ref: null,
    props:
     { type: '.....',
       checked: true,
       onChange: [Function: bound triggerClick] },
.....}]

о / р: шпион: 

{ [Function: proxy]
  isSinonProxy: true,
  called: false,
  notCalled: true,
  calledOnce: false,
  calledTwice: false,
  calledThrice: false,
  callCount: 0,
  firstCall: null,
  secondCall: null,
  thirdCall: null,
  lastCall: null,
  args: [],
  returnValues: [],
  thisValues: [],
  exceptions: [],
  callIds: [],
  errorsWithCallStack: [],
  displayName: 'triggerClick',
  toString: [Function: toString],
  instantiateFake: [Function: create],
  id: 'spy#1',
  stackTraceError:
   Error: Stack Trace for original
       at wrapMethod ..........

 restore: { [Function] sinon: true },
  wrappedMethod: [Function: triggerClick]
}

Существует вспомогательный класс для использования реагировать-тест-рендерер 

import ShallowRenderer from 'react-test-renderer/shallow';


function renderShallow(component) {
    const shallowRenderer = new ShallowRenderer();
    shallowRenderer.render(component);
    return  shallowRenderer.getRenderOutput();;
}

export {renderShallow}

1 Ответ

0 голосов
/ 15 ноября 2018

triggerClick привязывается, когда создается экземпляр класса. После этого нельзя шпионить или издеваться над Hit.prototype.

Должно быть либо: 

let spy = sinon.spy(Hit.prototype, 'triggerClick');
let hitComponent = renderShallow(<Hit triggerClick= {mockFunction}/>)

Или: 

let hitComponent = renderShallow(<Hit triggerClick= {mockFunction}/>)
sinon.spy(hitComponent.instance(), 'triggerClick');
...