Handle embedded text editors

Embedded text editors like CKEditor, makes testing challanging. Mostly because it is difficult to record actions in such complex pages, especially that they use random classes for their dinamic elements. Fortuntaly, all such editors provides a JavaScript API for interacting with them. This means you can add a custom JavaScript function step in order to interact with them.

Please check the following example to change the value for a CKEditor:

function trudonJSStep(element, callbacks, builtinVars, customVars)
{
  // variables definition
  var editorInstanceName = customVars.editorInstanceName;
  var setEditorValue = customVars.setEditorValue;
  
  if (!window.CKEDITOR || !window.CKEDITOR.instances[editorInstanceName]) {
    callbacks.fail("CKEDITOR not found");
    return callbacks.done();
  }

  window.CKEDITOR.instances[editorInstanceName].setData(setEditorValue);

  callbacks.pass("Changed value to: " + setEditorValue);
  callbacks.done();
}

And the following example to retrieve and save the editor value in a new variable:

function trudonJSStep(element, callbacks, builtinVars, customVars)
{
  // variables definition
  var editorInstanceName = customVars.editorInstanceName;
  var editorValue = undefined;
  
  if (!window.CKEDITOR || !window.CKEDITOR.instances[editorInstanceName]) {
    callbacks.fail("CKEDITOR not found");
    return callbacks.done();
  }

  editorValue = window.CKEDITOR.instances[editorInstanceName].getData();

  customVars.editorValue = editorValue;
  callbacks.pass("Retrivied value from CKEDITOR: ", editorValue);
  callbacks.done();
}