jquery - Jasmine 中的鼠标事件

Question

我是 Jasmine 和 jQuery 的新手，在监视 mousedown 事件时遇到困难。这是我的规范中失败的部分(Jasmine 说 spy mousedown 尚未被调用。)我怀疑这可能是因为我触发事件的方式。

it("draws a path on mousedown", function() {
  spyOn(drawing,'mousedown');
  $('#canvas').trigger('mousedown');
  expect(drawing.mousedown).toHaveBeenCalled();
  expect(drawing.isDrawing).toEqual(true);
});

相应的Javascript代码在这里:

function Drawing(canvas, eraseAllButton, eraseButton) {
  this.isDrawing = false;
  this.erasing = false;
  this.canvas = canvas;
  this.context = canvas.getContext("2d");
  this.eraseAllButton = eraseAllButton;
  this.eraseButton = eraseButton;

// Sets up event listeners for drawing.
  var self = this;
  this.canvas.addEventListener("mousedown", function () { self.mousedown() }, false);
};

// Begins to draw a path on mousedown.
Drawing.prototype.mousedown = function(e) { 
  if (!e) var e = window.event;
  e.preventDefault();       

  this.isDrawing = true;
  this.x = e.pageX - this.canvas.offsetLeft;
  this.y = e.pageY - this.canvas.offsetTop;
  this.context.beginPath();
  this.context.moveTo(this.x, this.y);
};

Answer 1

试试这个:

var mouse = document.createEvent('MouseEvents');
mouse.initMouseEvent('mousedown', true, true, window);
$('#canvas').get(0).dispatchEvent(mouse);