测试DOM,Phantom,Sinon,Mocha - 如何检查元素是否被点击

时间:2016-09-02 11:45:27

标签: javascript testing phantomjs sinon mocha-phantomjs

如果点击后按钮上的文字发生变化,我需要测试。但我找不到任何地方 - 怎么做。

请帮助:(,

我运行测试

mocha-phantomjs TestRunner.html

我的代码是:

TestRunner.html

 <!doctype html>
 <html>
    <head>
    <title>Tests</title>
    <link rel="stylesheet" href="mocha.css" />
</head>
<body>
    <div id="mocha"></div>
    <button data-text="SomeText"> Button </button>

    <script src="myscript.js"></script>

    <script src="mocha.js"></script>
    <script src="chai.js"></script>
    <script src="sinon-1.10.2.js"></script>
    <script>
        mocha.ui('bdd');
        mocha.reporter('html');
        var expect = chai.expect;
    </script>
    <script src="tests.js"></script>
    <script>
        mocha.run();
    </script>
</body>

myscript.js

var button = document.querySelector('button');

 button.addEventListener('click' , function(){
     this.innerText = this.dataset.text;
 });

test.js

describe("Change text on button", function () {

    var clickElement = function (el){
       var ev = document.createEvent("MouseEvent");
       ev.initMouseEvent(
         "click",
         true /* bubble */, true /* cancelable */,
         window, null,
         0, 0, 0, 0, /* coordinates */
         false, false, false, false, /* modifier keys */
         0 /*left*/, null
       );
       el.dispatchEvent(ev);
   };

    var button = document.querySelector('button');

    before(function(){
       clickElement(button);
    })

   it("Click on button - change text: 'SomeText'",        
         function () {
             expect(button.innerText).to.equal("SomeText");
   });

});

0 个答案:

没有答案