Merge pull request #1610 from ether/frontend-tests-refactor

change test naming schema and add keystroke tests for relevant buttonpresses

tests/frontend/specs/bold.js

@@ -5,7 +5,7 @@ describe("bold button", function(){
     this.timeout(60000);
   });
 
-  it("makes text bold", function(done) {
+  it("makes text bold on click", function(done) {
     var inner$ = helper.padInner$; 
     var chrome$ = helper.padChrome$; 
 
@@ -33,4 +33,34 @@ describe("bold button", function(){
 
     done();
   });
-});
+
+  it("makes text bold on keypress", function(done) {
+    var inner$ = helper.padInner$;
+    var chrome$ = helper.padChrome$;
+
+    //get the first text element out of the inner iframe
+    var $firstTextElement = inner$("div").first();
+
+    //select this text element
+    $firstTextElement.sendkeys('{selectall}');
+
+    var e = inner$.Event("keydown");
+    e.ctrlKey = true; // Control key
+    e.which = 66; // b
+    inner$("#innerdocbody").trigger(e);
+
+    //ace creates a new dom element when you press a button, so just get the first text element again
+    var $newFirstTextElement = inner$("div").first();
+
+    // is there a <b> element now?
+    var isBold = $newFirstTextElement.find("b").length === 1;
+
+    //expect it to be bold
+    expect(isBold).to.be(true);
+
+    //make sure the text hasn't changed
+    expect($newFirstTextElement.text()).to.eql($firstTextElement.text());
+
+    done();
+  });
+});

tests/frontend/specs/button_italic.js

@@ -1,36 +0,0 @@
-describe("italic button", function(){
-  //create a new pad before each test run
-  beforeEach(function(cb){
-    helper.newPad(cb);
-    this.timeout(60000);
-  });
-
-  it("makes text italic", function(done) {
-    var inner$ = helper.padInner$; 
-    var chrome$ = helper.padChrome$; 
-
-    //get the first text element out of the inner iframe
-    var $firstTextElement = inner$("div").first();
-    
-    //select this text element
-    $firstTextElement.sendkeys('{selectall}');
-
-    //get the bold button and click it
-    var $boldButton = chrome$(".buttonicon-italic");
-    $boldButton.click();
-    
-    //ace creates a new dom element when you press a button, so just get the first text element again
-    var $newFirstTextElement = inner$("div").first();
-    
-    // is there a <i> element now?
-    var isItalic = $newFirstTextElement.find("i").length === 1;
-
-    //expect it to be bold
-    expect(isItalic).to.be(true);
-
-    //make sure the text hasn't changed
-    expect($newFirstTextElement.text()).to.eql($firstTextElement.text());
-
-    done();
-  });
-});

tests/frontend/specs/chat.js

@@ -1,4 +1,4 @@
-describe("send chat message", function(){
+describe("Chat messages and UI", function(){
   //create a new pad before each test run
   beforeEach(function(cb){
     helper.newPad(cb);
@@ -64,5 +64,36 @@ describe("send chat message", function(){
     });
   });
 
-});
+  it("makes chat stick to right side of the screen", function(done) {
+    var inner$ = helper.padInner$; 
+    var chrome$ = helper.padChrome$; 
 
+    //click on the settings button to make settings visible
+    var $settingsButton = chrome$(".buttonicon-settings");
+    $settingsButton.click();
+
+    //get the chat selector
+    var $stickychatCheckbox = chrome$("#options-stickychat");
+
+    //select chat always on screen and fire change event
+    $stickychatCheckbox.attr('selected','selected');
+    $stickychatCheckbox.change();
+    $stickychatCheckbox.click();
+
+    //check if chat changed to get the stickychat Class
+    var $chatbox = chrome$("#chatbox");
+    var hasStickyChatClass = $chatbox.hasClass("stickyChat");
+    expect(hasStickyChatClass).to.be(true);
+
+    //select chat always on screen and fire change event
+    $stickychatCheckbox.attr('selected','selected');
+    $stickychatCheckbox.change();
+    $stickychatCheckbox.click();
+
+    //check if chat changed to remove the stickychat Class
+    var hasStickyChatClass = $chatbox.hasClass("stickyChat");
+    expect(hasStickyChatClass).to.be(false);
+
+    done();
+  });
+});

tests/frontend/specs/chat_always_on_screen.js

@@ -1,40 +0,0 @@
-describe("chat always ons creen select", function(){
-  //create a new pad before each test run
-  beforeEach(function(cb){
-    helper.newPad(cb);
-    this.timeout(60000);
-  });
-
-  it("makes chat stick to right side of the screen", function(done) {
-    var inner$ = helper.padInner$; 
-    var chrome$ = helper.padChrome$; 
-
-    //click on the settings button to make settings visible
-    var $settingsButton = chrome$(".buttonicon-settings");
-    $settingsButton.click();
-
-    //get the chat selector
-    var $stickychatCheckbox = chrome$("#options-stickychat");
-
-    //select chat always on screen and fire change event
-    $stickychatCheckbox.attr('selected','selected');
-    $stickychatCheckbox.change();
-    $stickychatCheckbox.click();
-
-    //check if chat changed to get the stickychat Class
-    var $chatbox = chrome$("#chatbox");
-    var hasStickyChatClass = $chatbox.hasClass("stickyChat");
-    expect(hasStickyChatClass).to.be(true);
-
-    //select chat always on screen and fire change event
-    $stickychatCheckbox.attr('selected','selected');
-    $stickychatCheckbox.change();
-    $stickychatCheckbox.click();
-
-    //check if chat changed to remove the stickychat Class
-    var hasStickyChatClass = $chatbox.hasClass("stickyChat");
-    expect(hasStickyChatClass).to.be(false);
-
-    done();
-  });
-});

tests/frontend/specs/enter.js

@@ -5,7 +5,7 @@ describe("enter keystroke", function(){
     this.timeout(60000);
   });
 
-  it("creates a enw line & puts cursor onto a new line", function(done) {
+  it("creates a new line & puts cursor onto a new line", function(done) {
     var inner$ = helper.padInner$; 
     var chrome$ = helper.padChrome$; 
     

tests/frontend/specs/indentation.js

@@ -5,7 +5,26 @@ describe("indentation button", function(){
     this.timeout(60000);
   });
 
-  it("indent text", function(done){
+ it("indent text with keypress", function(done){
+    var inner$ = helper.padInner$;
+    var chrome$ = helper.padChrome$;
+
+    //get the first text element out of the inner iframe
+    var $firstTextElement = inner$("div").first();
+
+    //select this text element
+    $firstTextElement.sendkeys('{selectall}');
+
+    var e = inner$.Event("keydown");
+    e.keyCode = 9; // tab :|
+    inner$("#innerdocbody").trigger(e);
+
+    helper.waitFor(function(){
+      return inner$("div").first().find("ul li").length === 1;
+    }).done(done);
+  });
+
+  it("indent text with button", function(done){
     var inner$ = helper.padInner$; 
     var chrome$ = helper.padChrome$;
 
@@ -176,4 +195,5 @@ describe("indentation button", function(){
       expect(isLI).to.be(true);
     },1000);
   });*/
+
 });

tests/frontend/specs/italic.js

@@ -0,0 +1,67 @@
+describe("italic some text", function(){
+  //create a new pad before each test run
+  beforeEach(function(cb){
+    helper.newPad(cb);
+    this.timeout(60000);
+  });
+
+  it("makes text italic using button", function(done) {
+    var inner$ = helper.padInner$; 
+    var chrome$ = helper.padChrome$; 
+
+    //get the first text element out of the inner iframe
+    var $firstTextElement = inner$("div").first();
+    
+    //select this text element
+    $firstTextElement.sendkeys('{selectall}');
+
+    //get the bold button and click it
+    var $boldButton = chrome$(".buttonicon-italic");
+    $boldButton.click();
+    
+    //ace creates a new dom element when you press a button, so just get the first text element again
+    var $newFirstTextElement = inner$("div").first();
+    
+    // is there a <i> element now?
+    var isItalic = $newFirstTextElement.find("i").length === 1;
+
+    //expect it to be bold
+    expect(isItalic).to.be(true);
+
+    //make sure the text hasn't changed
+    expect($newFirstTextElement.text()).to.eql($firstTextElement.text());
+
+    done();
+  });
+
+  it("makes text italic using keypress", function(done) {
+    var inner$ = helper.padInner$;
+    var chrome$ = helper.padChrome$;
+
+    //get the first text element out of the inner iframe
+    var $firstTextElement = inner$("div").first();
+
+    //select this text element
+    $firstTextElement.sendkeys('{selectall}');
+
+    var e = inner$.Event("keydown");
+    e.ctrlKey = true; // Control key
+    e.which = 105; // i
+    inner$("#innerdocbody").trigger(e);
+
+    //ace creates a new dom element when you press a button, so just get the first text element again
+    var $newFirstTextElement = inner$("div").first();
+
+    // is there a <i> element now?
+    var isItalic = $newFirstTextElement.find("i").length === 1;
+
+    //expect it to be bold
+    expect(isItalic).to.be(true);
+
+    //make sure the text hasn't changed
+    expect($newFirstTextElement.text()).to.eql($firstTextElement.text());
+
+    done();
+  });
+
+});

tests/frontend/specs/language.js

@@ -13,7 +13,6 @@ describe("Language select and change", function(){
   });
  
   // Destroy language cookies
-
   it("makes text german", function(done) {
     var inner$ = helper.padInner$;
     var chrome$ = helper.padChrome$;
@@ -92,7 +91,7 @@ describe("Language select and change", function(){
     var $languageoption = $language.find("[value=ar]");
  
     //select arabic
-    $languageoption.attr('selected','selected');
+    // $languageoption.attr('selected','selected'); // Breaks the test..
     $language.val("ar");
     $languageoption.change();
 

tests/frontend/specs/redo.js

@@ -4,7 +4,7 @@ describe("undo button then redo button", function(){
     this.timeout(60000);
   });
 
-  it("undo some typing", function(done){
+  it("redo some typing with button", function(done){
     var inner$ = helper.padInner$;
     var chrome$ = helper.padChrome$;
     
@@ -33,5 +33,38 @@ describe("undo button then redo button", function(){
       done();
     });
   });
+
+  it("redo some typing with keypress", function(done){
+    var inner$ = helper.padInner$;
+    var chrome$ = helper.padChrome$;
+
+    // get the first text element inside the editable space
+    var $firstTextElement = inner$("div span").first();
+    var originalValue = $firstTextElement.text(); // get the original value
+    var newString = "Foo";
+
+    $firstTextElement.sendkeys(newString); // send line 1 to the pad
+    var modifiedValue = $firstTextElement.text(); // get the modified value
+    expect(modifiedValue).not.to.be(originalValue); // expect the value to change
+
+    var e = inner$.Event("keydown");
+    e.ctrlKey = true; // Control key
+    e.which = 90; // z
+    inner$("#innerdocbody").trigger(e);
+
+    var e = inner$.Event("keydown");
+    e.ctrlKey = true; // Control key
+    e.which = 121; // y
+    inner$("#innerdocbody").trigger(e);
+
+    helper.waitFor(function(){
+      console.log(inner$("div span").first().text());
+      return inner$("div span").first().text() === newString;
+    }).done(function(){
+      var finalValue = inner$("div").first().text();
+      expect(finalValue).to.be(modifiedValue); // expect the value to change
+      done();
+    });
+  });
 });
 

tests/frontend/specs/undo.js

@@ -4,7 +4,8 @@ describe("undo button", function(){
     this.timeout(60000);
   });
 
-  it("undo some typing", function(done){
+/*
+  it("undo some typing by clicking undo button", function(done){
     var inner$ = helper.padInner$;
     var chrome$ = helper.padChrome$;
     
@@ -29,5 +30,34 @@ describe("undo button", function(){
       done();
     });
   });
+*/
+
+  it("undo some typing using a keypress", function(done){
+    var inner$ = helper.padInner$;
+    var chrome$ = helper.padChrome$;
+
+    // get the first text element inside the editable space
+    var $firstTextElement = inner$("div span").first();
+    var originalValue = $firstTextElement.text(); // get the original value
+
+    $firstTextElement.sendkeys("foo"); // send line 1 to the pad
+    var modifiedValue = $firstTextElement.text(); // get the modified value
+    expect(modifiedValue).not.to.be(originalValue); // expect the value to change
+
+    var e = inner$.Event("keydown");
+    e.ctrlKey = true; // Control key
+    e.which = 90; // z
+    inner$("#innerdocbody").trigger(e);
+
+    helper.waitFor(function(){
+      return inner$("div span").first().text() === originalValue;
+    }).done(function(){
+      var finalValue = inner$("div span").first().text();
+      expect(finalValue).to.be(originalValue); // expect the value to change
+      done();
+    });
+  });
+
+
 });