Watir difficulties, problems and trouble with TinyMCE

I’ve spent far too much of the last day and a bit trying to get Watir to identify and manipulate the TinyMCE rich text edit control. Hopefully the title of this post will allow anyone experiencing similar problems to Google my solution!

TinyMCE does a lot of javascript nastiness (from Watir’s perspective), turning a text area HTML tag into a funky iframe WYSIWYG text editor. Watir seems to have trouble doing much with it, but I was finally able to get an acceptable (for now) solution:


#Substitute your TinyMCE editor instance for 'mce_editor_0'. It will probably usually be OK though.

$ie.ie.Document.parentWindow.execScript("tf=document.
getElementById(\"mce_editor_0\");tf.contentWindow.focus()")
$ie.send_keys("Hello there")

It’s not nice, but it sure beats yesterday’s solution:

20.times{$ie.send_keys("{TAB}")}
$ie.send_keys("Hello there")

9 comments on “Watir difficulties, problems and trouble with TinyMCE”

  1. Matthew Churcher says:

    Hi again,

    I’d like to add that SetContent method works for Unicode characters and formatting.

    You can use TinyMC to create the required message extract the source code from it using:
    ie.ie.Document.parentWindow.execScript(“tinyMCE.getInstanceById(‘mce_editor_0’); txt = tinyMCE.getContent(‘mce_editor_0’); document.write(txt);”)
    #copy source from ie!

    and then put it back again using:
    text = ‘


    ie.ie.Document.parentWindow.execScript(“tinyMCE.getInstanceById(‘mce_editor_0’);tinyMCE.setContent(‘#{text}’);”)

    Thanks Again
    Matt.C

  2. Matt.C says:

    Your a genius, Just tested this with Watir 1.5. TinyMC widgets are a nightmare to test. We use them heavily here and they have broken every other test tool I’ve evaluated.

    There is nothing wrong with this solution as it is robust and won’t break if the page contents change. Factoring it out into it’s own function such as set_message() will hide all the ugliness.

    Many thanks

  3. Michael Hiemstra says:

    Hey folks,

    I found that using send_keys() was problematic when using Watir to run more than one browser at a time. If the application under test happened to put focus on a control while send_keys() for a long string was happening in another, there was a high likelihood that all the text would not get entered.

    You can fix this using:

    $ie.ie.Document.parentWindow.execScript(“tinyMCE.execInstanceCommand(‘mce_editor_0’, ‘mceSetContent’, false, ‘Hello there’)”)

    … which sets the text all at once.

  4. rory cawley says:

    I have multiple tinyMCEs on the page. So I used Michaels added advice to create:

    # Instead of calling it by name we need to say which tinyMCE it is 0..x, i.e. 0 if it’s the first on screen
    def fill_in_tinyMCE_field(placeOnThePage0toX, textToFillIn)
    ie.ie.Document.parentWindow.execScript(“tinyMCE.execInstanceCommand(‘mce_editor_#{placeOnThePage0toX}’, ‘mceSetContent’, false, ‘#{textToFillIn}’)”)
    end

    Many thanks for all this information

  5. Sajid says:

    I want to try this code for frame which is on this main window so how do we do that?
    Thanks
    Sajid

  6. Wesley Chen says:

    I have ever used the method you provide, but I preferred to:
    ie.frame(id,//).document.body.focus
    ie.send_keys()

    contentWindow is not necessary, am I right?

  7. Jared says:

    Hi Wesley,

    I can see how that might work. I’m seeing you’re doing a regular expression match, so it probably wouldn’t work if there were multiple controls or frames/iframes on the page.

  8. php scripts says:

    Hey can I reference some of the content found in this entry if I provide a link back to your site?

  9. Jared says:

    Feel free, thanks!

Leave a Reply

Your email address will not be published. Required fields are marked *