Javascript firefox从插件端获取快照

我是插件开发的新手，我想要的是拍摄浏览器[firefox]特定区域的快照。所以我正在为它开发firefox扩展。我尝试了很多！现在我得到一个错误

“ctx.drawWindow不是一个函数”

。在我的插件中有一个名为“拍摄快照”的上下文菜单项。选中它后，我想拍摄快照

错误

这是我的附加代码

main.js

var selection = require("sdk/selection");

var { Ci } = require('chrome');
var utils = require('sdk/window/utils');
var window1 = utils.getMostRecentBrowserWindow();

var contextMenu = require("sdk/context-menu");
 var menuItem = contextMenu.Item({
  label: "take a snapshot",
  context: contextMenu.SelectionContext(),
  contentScript: 'self.on("click", function () {' +
                 '  var cnvs = document.getElementById("myCanvas"); ' +
                 '  var ctx = cnvs.getContext("2d"); '+
                 '  self.postMessage(ctx,cnvs);' +
                 '});',
  onMessage: function (ctx,cnvs) {
    shoot(ctx,cnvs);
  }
});


function shoot(ctx,cnvs){
    console.log("runing");

    var x = 100;
    var y = 100;
    var width = 200;
    var height = 200;
    ctx.drawWindow(window1, x, y, width, height, "rgb(255,255,255)");
    console.log(cnvs.toDataURL());
}

这是我测试插件的HTML页面

<canvas id="myCanvas" width="300" height="300"
   style="border:1px solid #000000;">
</canvas> 

---

这是一个非常类似的问题：

<canvas id="myCanvas" width="300" height="300"
   style="border:1px solid #000000;">
</canvas>