Selenium wiki formatter (textile e altri)

Di recente avevo necessità di copiare dei test case creati con Selenium IDE su Redmine, si potrebbe allegarli ma l’intenzione è quella di mostrali come una tabella.

Ho cosi’ consultato velocemente la pagina su come creare un custom format.

Da li’, a meno di eccezioni (quali l’escape della pipe | ) ho creato questo semplice script da aggiungere nel menu opzioni di Selenium IDE nel tab formats (inserite Wiki nel campo wiki format name e sovrascrivete con il seguente contenuto):

var wiki = {
confluence:{
  start_table: "",
  end_table: "",
  header: "||Command||Target||Value||\n",
  header_row:"||#",
  start_row: "| ",
  end_row: " |\n",
  separator: " | ",
},
dokuwiki:{
  start_table: "",
  end_table: "",
  header: "^ Command ^ Target ^ Value ^\n",
  header_row:"^ # ",
  start_row: "| ",
  end_row: " |\n",
  separator: " | ",
},
mediawiki:{
  start_table: "{|border=\"1\" \n",
  end_table: "|}",
  header: "!Command\n!Target\n!Value\n",
  header_row:"!#\n",
  start_row: "|-\n|",
  end_row: "\n",
  separator: "\n|",
},
moinmoin:{
  start_table: "",
  end_table: "",
  header: "||\'\'\'Command\'\'\'||\'\'\'Target\'\'\'||\'\'\'Value\'\'\'||\n",
  header_row:"||\'\'\'#\'\'\'",
  start_row: "||",
  end_row: "||\n",
  separator: "||",
},
textile:{
  start_table: "",
  end_table: "",
  header: "|_. Command|_. Target|_. Value|\n",
  header_row:"|_. #",
  start_row: "|",
  end_row: "|\n",
  separator: "|",
},
trac:{
  start_table: "",
  end_table: "",
  header: "||= Command =||=  Target =||=  Value =||\n",
  header_row:"||= # =",
  start_row: "||",
  end_row: "||\n",
  separator: "||",
},
twiki:{
  start_table: "",
  end_table: "",
  header: "|  *Command*  |  *Target*  |  *Value*  |\n",
  header_row:"| *#*",
  start_row: "|  ",
  end_row: "  |\n",
  separator: "  |  ",
},
xwiki:{
  start_table: "",
  end_table: "",
  header: "|=Command|=Target|=Value\n",
  header_row:"|=#",
  start_row: "|",
  end_row: "\n",
  separator: "|",
}
};

function formatCommands(commands) {
  var result = '';
  var start_table =  wiki[options['wiki']]["start_table"];
  var end_table =  wiki[options['wiki']]["end_table"];
  var header = wiki[options['wiki']]["header"];
  var header_row = wiki[options['wiki']]["header_row"];
  var start_row = wiki[options['wiki']]["start_row"];
  var end_row = wiki[options['wiki']]["end_row"];
  var sep = wiki[options['wiki']]["separator"];
  var row_num = '';
  for (var i = 0; i < commands.length; i++) {
    var command = commands[i];
    if('true' == options.row)
            row_num= i+sep;
    if (command.type == 'command') {
      result += start_row + row_num+ command.command + sep + command.target + sep + command.value + end_row;
    }
  }
    if('true' == options.row)
         header = header_row+header;
    result = start_table + header + result + end_table;
  return result;
}

function parse(testCase, source) {
  var doc = source;
  var commands = [];
  var start_row = wiki[options['wiki']]["start_row"];
  var sep = wiki[options['wiki']]["separator"];
  while (doc.length > 0) {
    var line = /(.*)(\r\n|[\r\n])?/.exec(doc);
    var line2 = line[1].slice(start_row.length);
    var array = line2.split(sep);
    if (array.length >= 3) {
      var command = new Command();
      command.command = array[0];
      command.target = array[1];
      command.value = array[2];
      commands.push(command);
    }
    doc = doc.substr(line[0].length);
  }
  testCase.setCommands(commands);
}

function format(testCase, name) {
  return formatCommands(testCase.commands);
}

options = {wiki: 'confluence', row:"false"};

configForm = '<description>Choose a wiki syntax:</description>' + '<menulist id="options_wiki">'
+ 	'<menuitem label="Confluence" value="confluence"/>' +
+ 	'<menuitem label="DokuWiki" value="dokuwiki"/>' +
	'<menuitem label="MediaWiki" value="mediawiki"/>' +
	'<menuitem label="MoinMoin" value="moinmoin"/>' + '<menuitem label="Textile" value="textile"/>' + '<menuitem label="Trac" value="trac"/>' + '<menuitem label="Twiki" value="twiki"/>' + '<menuitem label="Xwiki" value="xwiki"/>' + '</menupopup>' + '</menulist>'+ '<separator class="groove"/>' + '<checkbox id="options_row" label="Row number"/>';

Dal menu delle opzioni, vedete che confluence  è impostato di default (potete abilitare anche i numeri di riga tramite la checkbox) e potete scegliere tra Confluence, DokuWiki, MediaWiki, MoinMoin, Textile (Redmine), Trac, Twiki e Xwiki.

Una volta salvato, andate in Options -> Format e scegliete Wiki, cliccate poi sul tab Source e vedete il test case nel formato wiki da voi scelto, potete poi copiare e incollare nel vostro wiki preferito.

Selenium, TinyMCE e CKEditor

Ultimamente, come avete certamente capito, sto lavorando con Selenium per testare pagine web.

E’ molto probabile che nella vostra applicazione web usate TinyMCE o CKEditor. Non mi pongo su quale sia meglio l’importante è che riesco a scrivere nelle caselle di testo con entrambi.

Avendo TinyMCE (3.0.7  e 3.2.7  (wordpresss.com))  sono riuscito a scrivere con:

type dom=document.getElementById("TEXTAREAID_ifr").contentWindow.document.body Hello world

dove TEXTAREAID è l’ID della text area su cui TinyMCE si basa.

Con CKEditor (3.2.1 del 09 Apr 2010) sono riuscito a scrivere con:

runScript CKEDITOR.instances[‘TEXTAREAID’].setData(‘Hello world’);

dove TEXTAREAID è l’ID o il nome della text area su cui CKEditor si basa.

Con FCKEditor 2.5.1 incorportato in Mediawiki (vedi sandbox con Rich Editor abilitato), sono riuscito a scrivere con:

runScript FCKeditorAPI.GetInstance(‘TEXTAREAID’).SetHTML( ‘Hello World’ );

Per farla più semplice ho scritto una funzione nel file user-extension.js per TinyMCE:

Selenium.prototype.doTypeInTinymce= function(textareaid, testo) {
var oggettoid= textareaid+"_ifr";
var locator = 'dom=document.getElementById(\"'+oggettoid+'\").contentWindow.document.body';
selenium.doType(locator,testo);
};

quindi potete scrivere direttamente:

typeInTinymce content Hello world

dove content è l’id della text area nel mio caso (blog di WordPress).

Potete anche aggiungere html, del tipo:

typeInTinymce content <b>Hello world</b>

Per l’FCKEditor potete scrivere il seguente comando:

Selenium.prototype.doTypeInFckeditor= function(textareaid, testo) {
var script = "FCKeditorAPI.GetInstance(\'"+textareaid+"\').SetHTML(\'"+testo+"\')";
selenium.doRunScript(script);
};

quindi potete scrivere direttamente:

typeInFckeditor wpTextbox1 Hello world

dove wpTextbox1 è l’id della text area nel caso di Mediawiki con FCKEditor.

A presto !