学习Jasmine - toHaveBeenTriggered在触发器上工作（＆＃34;模态＆＃34;）但不在模态（）上工作

Question

这两个测试都通过了（即，action =＆＃34; click＆＃34;）

// pass
var spyEvent = spyOnEvent( $("#checkout"), 'click' );
$("#checkout").click()
expect('click').toHaveBeenTriggeredOn("#checkout") 

// pass
var spyEvent = spyOnEvent( $("#checkout"), 'click' );
$("#checkout").trigger("click")
expect('click').toHaveBeenTriggeredOn("#checkout") 

非常期待！但是，在下面的二重奏中，动作现在是modal的完全相同的概念，只有触发器通过。为什么呢？

// FAIL
var spyEvent = spyOnEvent( $("#checkout"), 'modal' );
$("#checkout").modal()
expect('modal').toHaveBeenTriggeredOn("#checkout") 

// pass
var spyEvent = spyOnEvent( $("#checkout"), 'modal' );
$("#checkout").trigger("modal")
expect('modal').toHaveBeenTriggeredOn("#checkout")  

.modal()来自Twitter-bootstrap，已正确加载。没有控制台错误。

Answer 1

TL; DR：您需要使用show.bs.modal

这是因为jQuery的.trigger()将创建您作为参数传递的类型的事件。这意味着这个

$('#foo').on('modal', someHandler);
$('#foo').trigger('modal');

将按预期调用someHandler。但是，这与Bootstrap的模态功能无关，因为这里的modal事件是由你在旅途中定义的 - 所以上面的测试本来是成功的

$('#foo').on('bar', someHandler);
$('#foo').trigger('bar');

也是。请参阅custom events in the jQuery docs。

据我所知，您希望将上述处理程序绑定到Bootstrap的模态功能。您正在寻找的内容隐藏在very bottom of the Bootstrap docs。 注意：这些文档适用于BS4，但事件是相同的，并且比BS3 docs for Modal

更具可读性

在内部，Bootstrap在元素上调用show.bs.modal时会触发.modal()事件，所以你需要听一下这些测试才有意义。有多个状态可以触发每个模态上的事件，上面的BS4文档有一个表格详细说明这些状态以及它们何时被调用。

希望这有帮助！