MDL-68548 editor-atto: change <i> tags to <em>

This commit is contained in:
Neosi
2020-05-05 09:50:26 +01:00
parent f570a79071
commit 27e44c18fe
7 changed files with 79 additions and 16 deletions
@@ -15,7 +15,7 @@ Feature: Atto italic button
And I set the field "Text editor" to "Plain text area"
And I press "Save changes"
And I click on "Edit profile" "link" in the "region-main" "region"
Then I should see "<i>Tower of Pisa</i>"
Then I should see "<em>Tower of Pisa</em>"
@javascript
Scenario: Toggle italics in some text
@@ -31,5 +31,5 @@ Feature: Atto italic button
And I set the field "Text editor" to "Plain text area"
And I press "Save changes"
And I click on "Edit profile" "link" in the "region-main" "region"
Then I should not see "<i>GHD - for hair</i>"
Then I should not see "<em>GHD - for hair</em>"
And I should see "GHD - for hair"
@@ -35,15 +35,36 @@ YUI.add('moodle-atto_italic-button', function (Y, NAME) {
Y.namespace('M.atto_italic').Button = Y.Base.create('button', Y.M.editor_atto.EditorPlugin, [], {
initializer: function() {
this.addBasicButton({
exec: 'italic',
var italic;
this.addButton({
callback: this._toggleItalic,
icon: 'e/italic',
buttonName: italic,
inlineFormat: true,
// Key code for the keyboard shortcut which triggers this button:
keys: '73',
// Watch the following tags and add/remove highlighting as appropriate:
tags: 'i'
tags: 'em, i'
});
},
/**
* Toggle the italic setting.
*
* @method _toggleItalic
* @param {EventFacade} e
*/
_toggleItalic: function() {
var host = this.get('host');
// Use the "italic" command for simplicity. This will toggle <em> tags off as well.
document.execCommand('italic', false, null);
// Then change all <i> tags to <em> tags. This will change any existing <i> tags as well.
host.changeToCSS('i', 'bf-editor-italic-emphasis');
host.changeToTags('bf-editor-italic-emphasis', 'em');
}
});
@@ -1 +1 @@
YUI.add("moodle-atto_italic-button",function(e,t){e.namespace("M.atto_italic").Button=e.Base.create("button",e.M.editor_atto.EditorPlugin,[],{initializer:function(){this.addBasicButton({exec:"italic",keys:"73",tags:"i"})}})},"@VERSION@",{requires:["moodle-editor_atto-plugin"]});
YUI.add("moodle-atto_italic-button",function(e,t){e.namespace("M.atto_italic").Button=e.Base.create("button",e.M.editor_atto.EditorPlugin,[],{initializer:function(){var e;this.addButton({callback:this._toggleItalic,icon:"e/italic",buttonName:e,inlineFormat:!0,keys:"73",tags:"em, i"})},_toggleItalic:function(){var e=this.get("host");document.execCommand("italic",!1,null),e.changeToCSS("i","bf-editor-italic-emphasis"),e.changeToTags("bf-editor-italic-emphasis","em")}})},"@VERSION@",{requires:["moodle-editor_atto-plugin"]});
@@ -35,15 +35,36 @@ YUI.add('moodle-atto_italic-button', function (Y, NAME) {
Y.namespace('M.atto_italic').Button = Y.Base.create('button', Y.M.editor_atto.EditorPlugin, [], {
initializer: function() {
this.addBasicButton({
exec: 'italic',
var italic;
this.addButton({
callback: this._toggleItalic,
icon: 'e/italic',
buttonName: italic,
inlineFormat: true,
// Key code for the keyboard shortcut which triggers this button:
keys: '73',
// Watch the following tags and add/remove highlighting as appropriate:
tags: 'i'
tags: 'em, i'
});
},
/**
* Toggle the italic setting.
*
* @method _toggleItalic
* @param {EventFacade} e
*/
_toggleItalic: function() {
var host = this.get('host');
// Use the "italic" command for simplicity. This will toggle <em> tags off as well.
document.execCommand('italic', false, null);
// Then change all <i> tags to <em> tags. This will change any existing <i> tags as well.
host.changeToCSS('i', 'bf-editor-italic-emphasis');
host.changeToTags('bf-editor-italic-emphasis', 'em');
}
});
+24 -3
View File
@@ -33,14 +33,35 @@
Y.namespace('M.atto_italic').Button = Y.Base.create('button', Y.M.editor_atto.EditorPlugin, [], {
initializer: function() {
this.addBasicButton({
exec: 'italic',
var italic;
this.addButton({
callback: this._toggleItalic,
icon: 'e/italic',
buttonName: italic,
inlineFormat: true,
// Key code for the keyboard shortcut which triggers this button:
keys: '73',
// Watch the following tags and add/remove highlighting as appropriate:
tags: 'i'
tags: 'em, i'
});
},
/**
* Toggle the italic setting.
*
* @method _toggleItalic
* @param {EventFacade} e
*/
_toggleItalic: function() {
var host = this.get('host');
// Use the "italic" command for simplicity. This will toggle <em> tags off as well.
document.execCommand('italic', false, null);
// Then change all <i> tags to <em> tags. This will change any existing <i> tags as well.
host.changeToCSS('i', 'bf-editor-italic-emphasis');
host.changeToTags('bf-editor-italic-emphasis', 'em');
}
});
@@ -21,6 +21,6 @@ Feature: Atto editor with customised toolbar
Then ".atto_link_button" "css_element" should exist in the ".normaldiv" "css_element"
And ".atto_link_button" "css_element" should not exist in the ".specialdiv" "css_element"
And ".atto_bold_button_bold" "css_element" should exist in the ".normaldiv" "css_element"
And ".atto_italic_button_italic" "css_element" should exist in the ".normaldiv" "css_element"
And ".atto_italic_button" "css_element" should exist in the ".normaldiv" "css_element"
And ".atto_bold_button_bold" "css_element" should exist in the ".specialdiv" "css_element"
And ".atto_italic_button_italic" "css_element" should exist in the ".specialdiv" "css_element"
And ".atto_italic_button" "css_element" should exist in the ".specialdiv" "css_element"
@@ -22,7 +22,7 @@ Feature: Atto with enable/disable function.
Then the "disabled" attribute of "button.atto_collapse_button" "css_element" should contain "disabled"
And the "disabled" attribute of "button.atto_title_button" "css_element" should contain "disabled"
And the "disabled" attribute of "button.atto_bold_button_bold" "css_element" should contain "disabled"
And the "disabled" attribute of "button.atto_italic_button_italic" "css_element" should contain "disabled"
And the "disabled" attribute of "button.atto_italic_button" "css_element" should contain "disabled"
And the "disabled" attribute of "button.atto_unorderedlist_button_insertUnorderedList" "css_element" should contain "disabled"
And the "disabled" attribute of "button.atto_orderedlist_button_insertOrderedList" "css_element" should contain "disabled"
And the "disabled" attribute of "button.atto_link_button" "css_element" should contain "disabled"
@@ -36,7 +36,7 @@ Feature: Atto with enable/disable function.
Then "button.atto_collapse_button[disabled]" "css_element" should not exist
And "button.atto_title_button[disabled]" "css_element" should not exist
And "button.atto_bold_button_bold[disabled]" "css_element" should not exist
And "button.atto_italic_button_italic[disabled]" "css_element" should not exist
And "button.atto_italic_button[disabled]" "css_element" should not exist
And "button.atto_unorderedlist_button_insertUnorderedList[disabled]" "css_element" should not exist
And "button.atto_orderedlist_button_insertOrderedList[disabled]" "css_element" should not exist
And "button.atto_link_button[disabled]" "css_element" should not exist