diff --git a/cms/djangoapps/contentstore/features/html-editor.feature b/cms/djangoapps/contentstore/features/html-editor.feature index a8bb417ad6..6472f367b7 100644 --- a/cms/djangoapps/contentstore/features/html-editor.feature +++ b/cms/djangoapps/contentstore/features/html-editor.feature @@ -19,3 +19,9 @@ Feature: CMS.HTML Editor Given I have created an E-text Written in LaTeX When I edit and select Settings Then Edit High Level Source is visible + + Scenario: TinyMCE image plugin sets urls correctly + Given I have created a Blank HTML Page + When I edit the page and select the Visual Editor + And I add an image with a static link via the Image Plugin Icon + Then the image static link is rewritten to translate the path \ No newline at end of file diff --git a/cms/djangoapps/contentstore/features/html-editor.py b/cms/djangoapps/contentstore/features/html-editor.py index 4a6d3bdefe..d5b1502e4c 100644 --- a/cms/djangoapps/contentstore/features/html-editor.py +++ b/cms/djangoapps/contentstore/features/html-editor.py @@ -2,6 +2,7 @@ #pylint: disable=C0111 from lettuce import world, step +from nose.tools import assert_in # pylint: disable=no-name-in-module @step('I have created a Blank HTML Page$') @@ -28,3 +29,43 @@ def i_created_etext_in_latex(step): category='html', component_type='E-text Written in LaTeX' ) + + +@step('I edit the page and select the Visual Editor') +def i_click_on_edit_icon(step): + world.edit_component() + world.wait_for(lambda _driver: world.css_visible('a.visual-tab')) + world.css_click('a.visual-tab') + + +@step('I add an image with a static link via the Image Plugin Icon') +def i_click_on_image_plugin_icon(step): + # Click on image plugin button + world.wait_for(lambda _driver: world.css_visible('a.mce_image')) + world.css_click('a.mce_image') + + # Change to the non-modal TinyMCE Image window + # keeping parent window so we can go back to it. + parent_window = world.browser.current_window + for window in world.browser.windows: + + world.browser.switch_to_window(window) # Switch to a different window + if world.browser.title == 'Insert/Edit Image': + + # This is the Image window so find the url text box, + # enter text in it then hit Insert button. + url_elem = world.browser.find_by_id("src") + url_elem.fill('/static/image.jpg') + world.browser.find_by_id('insert').click() + + world.browser.switch_to_window(parent_window) # Switch back to the main window + + +@step('the image static link is rewritten to translate the path') +def image_static_link_is_rewritten(step): + # Find the TinyMCE iframe within the main window + with world.browser.get_iframe('mce_0_ifr') as tinymce: + image = tinymce.find_by_tag('img').first + + # Test onExecCommandHandler set the url to absolute. + assert_in('c4x/MITx/999/asset/image.jpg', image['src']) diff --git a/common/lib/xmodule/xmodule/js/src/html/edit.coffee b/common/lib/xmodule/xmodule/js/src/html/edit.coffee index cc9c690e38..f2b6298a90 100644 --- a/common/lib/xmodule/xmodule/js/src/html/edit.coffee +++ b/common/lib/xmodule/xmodule/js/src/html/edit.coffee @@ -42,7 +42,8 @@ class @HTMLEditingDescriptor # Disable visual aid on borderless table. visual:false, # We may want to add "styleselect" when we collect all styles used throughout the LMS - theme_advanced_buttons1 : "formatselect,fontselect,bold,italic,underline,forecolor,|,bullist,numlist,outdent,indent,|,blockquote,wrapAsCode,|,link,unlink,|,image,", + theme_advanced_buttons1 : "formatselect,fontselect,bold,italic,underline,forecolor,", + theme_advanced_buttons2 : "bullist,numlist,outdent,indent,|,blockquote,wrapAsCode,|,link,unlink,|,image,", theme_advanced_toolbar_location : "top", theme_advanced_toolbar_align : "left", theme_advanced_statusbar_location : "none", @@ -80,6 +81,15 @@ class @HTMLEditingDescriptor ) @visualEditor = ed + + ed.onExecCommand.add(@onExecCommandHandler) + + # Intended to run after the "image" plugin is used so that static urls are set + # correctly in the Visual editor immediately after command use. + onExecCommandHandler: (ed, cmd, ui, val) => + if cmd == 'mceInsertContent' and val.match(/^ e.preventDefault();