From 541e90c32c266cd7b771e9c950eaae8927c3409b Mon Sep 17 00:00:00 2001 From: Matt Clarkson Date: Fri, 23 Oct 2020 16:06:36 +1300 Subject: [PATCH] MDL-68722 atto_equation: fix for form elements with special characters Element id's containing characters such as ':' would break the tab selector in bootstrap. This specifically affects the essay question type. --- .../moodle-atto_equation-button-debug.js | 18 ++++++++++++++++++ .../moodle-atto_equation-button-min.js | 4 ++-- .../moodle-atto_equation-button.js | 18 ++++++++++++++++++ .../equation/yui/src/button/js/button.js | 18 ++++++++++++++++++ 4 files changed, 56 insertions(+), 2 deletions(-) diff --git a/lib/editor/atto/plugins/equation/yui/build/moodle-atto_equation-button/moodle-atto_equation-button-debug.js b/lib/editor/atto/plugins/equation/yui/build/moodle-atto_equation-button/moodle-atto_equation-button-debug.js index 1b4fdf490da..9b920826db3 100644 --- a/lib/editor/atto/plugins/equation/yui/build/moodle-atto_equation-button/moodle-atto_equation-button-debug.js +++ b/lib/editor/atto/plugins/equation/yui/build/moodle-atto_equation-button/moodle-atto_equation-button-debug.js @@ -76,6 +76,7 @@ var COMPONENTNAME = 'atto_equation', '{{#each library}}' + '
  • ' + '' + '{{get_string groupname ../component}}' + '' + @@ -688,6 +689,7 @@ Y.namespace('M.atto_equation').Button = Y.Base.create('button', Y.M.editor_atto. }); content = template({ elementid: this.get('host').get('elementid'), + elementidescaped: this._escapeQuerySelector(this.get('host').get('elementid')), component: COMPONENTNAME, library: library, CSS: CSS, @@ -712,7 +714,23 @@ Y.namespace('M.atto_equation').Button = Y.Base.create('button', Y.M.editor_atto. content = preview.responseText; } return content; + }, + + /** + * Escape special characters in string used as a JS query selector + * + * @method _excapeQuerySelector + * @param {string} selector + * @returns {string} + */ + _escapeQuerySelector: function(selector) { + + // Bootstrap requires that query selectors have special chars excaped. + // See: https://getbootstrap.com/docs/4.2/getting-started/javascript/#selectors + + return selector.replace(/(:|\.|\[|\]|,|=|@)/g, '\\$1'); } + }, { ATTRS: { /** diff --git a/lib/editor/atto/plugins/equation/yui/build/moodle-atto_equation-button/moodle-atto_equation-button-min.js b/lib/editor/atto/plugins/equation/yui/build/moodle-atto_equation-button/moodle-atto_equation-button-min.js index 8e720ff6a4e..4fb26ebdf5a 100644 --- a/lib/editor/atto/plugins/equation/yui/build/moodle-atto_equation-button/moodle-atto_equation-button-min.js +++ b/lib/editor/atto/plugins/equation/yui/build/moodle-atto_equation-button/moodle-atto_equation-button-min.js @@ -1,2 +1,2 @@ -YUI.add("moodle-atto_equation-button",function(r,t){var a="atto_equation",l={EQUATION_TEXT:"atto_equation_equation",EQUATION_PREVIEW:"atto_equation_preview",SUBMIT:"atto_equation_submit",LIBRARY:"atto_equation_library",LIBRARY_GROUPS:"atto_equation_groups",LIBRARY_GROUP_PREFIX:"atto_equation_group"},u={LIBRARY:"."+l.LIBRARY,LIBRARY_GROUP:"."+l.LIBRARY_GROUPS+" > div > div",EQUATION_TEXT:"."+l.EQUATION_TEXT,EQUATION_PREVIEW:"."+l.EQUATION_PREVIEW,SUBMIT:"."+l.SUBMIT,LIBRARY_BUTTON:"."+l.LIBRARY+" button"},c={START:"\\(",END:"\\)"},i='
    {{{library}}}
    {{get_string "cursorinfo" component}}

    ',h='
    {{#each library}}
    {{#split "\n" elements}}{{/split}}
    {{/each}}
    ';r.namespace("M.atto_equation").Button=r.Base.create("button",r.M.editor_atto.EditorPlugin,[],{_currentSelection:null,_lastCursorPos:0,_content:null,_sourceEquation:null,_groupFocus:null,_equationPatterns:[/\$\$([\S\s]+?)\$\$/,/\\\(([\S\s]+?)\\\)/,/\\\[([\S\s]+?)\\\]/,/\[tex\]([\S\s]+?)\[\/tex\]/],initializer:function(){this._groupFocus={},this.get("texfilteractive")&&(this.addButton({icon:"e/math",callback:this._displayDialogue}),this.get("host").on("atto:selectionchanged",function(){this._resolveEquation()?this.highlightButtons():this.unHighlightButtons()},this),this.editor.all("tex").each(function(t){var e=r.Node.create(""+c.START+" "+t.get("text")+" "+c.END+"");t.replace(e)}))},_displayDialogue:function(){var t,e,n;this._currentSelection=this.get("host").getSelection(),!1!==this._currentSelection&&(t=this._resolveEquation(),e=this.getDialogue({headerContent:M.util.get_string("pluginname",a),focusAfterHide:!0,width:600,focusOnShowSelector:u.EQUATION_TEXT}),n=this._getDialogueContent(),e.set("bodyContent",n),n.one(".nav-item:first-child .nav-link").getDOMNode().click(),e.show(),require(["core/event"],function(t){t.notifyFilterContentUpdated(e.get("boundingBox").getDOMNode())}),t&&n.one(u.EQUATION_TEXT).set("text",t),this._updatePreview(!1))},_resolveEquation:function(){var c,t=this.get("host").getSelectionParentNode(),h=this.get("host").getSelection(),d=!1;return!!this.get("host").isActive()&&(!!t&&(!(!h||0===h.length)&&(this.sourceEquation=null,h=h[0],c=r.one(t).get("text"),r.Array.find(this._equationPatterns,function(u){var t=c.match(new RegExp(u.source,"g"));if(t&&t.length)return r.Array.find(t,function(t){for(var e,n,i,o,s,a,r,l=0;-1!==c.indexOf(t,l);){if(n=(e=c.indexOf(t,l))+t.length,i=h.startOffset>=e&&h.startOffsete,i&&o&&(s=t.match(u))&&s.length)return r=(a=c.indexOf(s[1],e))+s[1].length,d=s[1],this.sourceEquation={startOuterPosition:e,endOuterPosition:n,outerMatch:t,startInnerPosition:a,endInnerPosition:r,innerMatch:s},!0;l=n}},this)},this),!1!==d&&(d=d.trim()),d)))},_setEquation:function(t){var e,n,i,o,s;o=this.get("host"),t.preventDefault(),this.getDialogue({focusAfterHide:null}).hide(),""!==(i=t.currentTarget.ancestor(".atto_form").one("textarea").get("value"))&&(o.setSelection(this._currentSelection),this.sourceEquation?(i=" "+i+" ",s=(n=(e=r.one(o.getSelectionParentNode())).get("text")).slice(0,this.sourceEquation.startInnerPosition)+i+n.slice(this.sourceEquation.endInnerPosition),e.set("text",s)):(i=c.START+" "+i+" "+c.END,o.insertContentAtFocusPoint(i)),this.markUpdated())},_throttle:function(n,i){var o=null;return function(){var t=this,e=arguments;clearTimeout(o),o=setTimeout(function(){n.apply(t,e)},i)}},_updatePreview:function(t){var e,n,i,o=this._content.one(u.EQUATION_TEXT),s=o.get("value"),a=o.get("selectionStart");for(t&&t.preventDefault(),a=a||0;"\\"===s.charAt(a)&&0<=a;)--a;if(n=/[a-zA-Z\{]/,0!==a&&"{"!=s.charAt(a-1))for(;n.test(s.charAt(a))&&a=o.size()&&(a=0),e=o.item(a),this._setGroupTabFocus(i,e),e.focus()},_setGroupTabFocus:function(t,e){var n=t.generateID();"undefined"!=typeof this._groupFocus[n]&&this._groupFocus[n].setAttribute("tabindex","-1"),(this._groupFocus[n]=e).setAttribute("tabindex",0),t.setAttribute("aria-activedescendant",e.generateID())},_selectLibraryItem:function(t){var e,n,i,o,s,a=t.currentTarget.getAttribute("data-tex"),r=0;t.preventDefault(),this._setGroupTabFocus(t.currentTarget.get("parentNode"),t.currentTarget)," "!==(n=(e=(i=t.currentTarget.ancestor(".atto_form").one("textarea")).get("value")).substring(0,this._lastCursorPos)).charAt(n.length-1)&&(n+=" "),r=(n+=a).length," "!==e.charAt(this._lastCursorPos)&&(n+=" "),n+=e.substring(this._lastCursorPos,e.length),i.set("value",n),i.focus(),"number"==typeof(o=i.getDOMNode()).selectionStart?o.selectionStart=o.selectionEnd=r:"undefined"!=typeof o.createTextRange&&((s=o.createTextRange()).moveToPoint(r),s.select()),this._updatePreview(!1)},_getLibraryContent:function(){var t,e,n,i=r.Handlebars.compile(h),o=this.get("library"),s="";return r.Handlebars.registerHelper("split",function(t,e,n){var i,o,s;if(void 0===t||void 0===e)return"";for(s="",i=e.trim().split(t);0 div > div",EQUATION_TEXT:"."+l.EQUATION_TEXT,EQUATION_PREVIEW:"."+l.EQUATION_PREVIEW,SUBMIT:"."+l.SUBMIT,LIBRARY_BUTTON:"."+l.LIBRARY+" button"},c={START:"\\(",END:"\\)"},i='
    {{{library}}}
    {{get_string "cursorinfo" component}}

    ',h='
    {{#each library}}
    {{#split "\n" elements}}{{/split}}
    {{/each}}
    ';r.namespace("M.atto_equation").Button=r.Base.create("button",r.M.editor_atto.EditorPlugin,[],{_currentSelection:null,_lastCursorPos:0,_content:null,_sourceEquation:null,_groupFocus:null,_equationPatterns:[/\$\$([\S\s]+?)\$\$/,/\\\(([\S\s]+?)\\\)/,/\\\[([\S\s]+?)\\\]/,/\[tex\]([\S\s]+?)\[\/tex\]/],initializer:function(){this._groupFocus={},this.get("texfilteractive")&&(this.addButton({icon:"e/math",callback:this._displayDialogue}),this.get("host").on("atto:selectionchanged",function(){this._resolveEquation()?this.highlightButtons():this.unHighlightButtons()},this),this.editor.all("tex").each(function(t){var e=r.Node.create(""+c.START+" "+t.get("text")+" "+c.END+"");t.replace(e)}))},_displayDialogue:function(){var t,e,n;this._currentSelection=this.get("host").getSelection(),!1!==this._currentSelection&&(t=this._resolveEquation(),e=this.getDialogue({headerContent:M.util.get_string("pluginname",a),focusAfterHide:!0,width:600,focusOnShowSelector:u.EQUATION_TEXT}),n=this._getDialogueContent(),e.set("bodyContent",n),n.one(".nav-item:first-child .nav-link").getDOMNode().click(),e.show(),require(["core/event"],function(t){t.notifyFilterContentUpdated(e.get("boundingBox").getDOMNode())}),t&&n.one(u.EQUATION_TEXT).set("text",t),this._updatePreview(!1))},_resolveEquation:function(){var c,t=this.get("host").getSelectionParentNode(),h=this.get("host").getSelection(),d=!1;return!!this.get("host").isActive()&&(!!t&&(!(!h||0===h.length)&&(this.sourceEquation=null,h=h[0],c=r.one(t).get("text"),r.Array.find(this._equationPatterns,function(u){var t=c.match(new RegExp(u.source,"g"));if(t&&t.length)return r.Array.find(t,function(t){for(var e,n,i,o,s,a,r,l=0;-1!==c.indexOf(t,l);){if(n=(e=c.indexOf(t,l))+t.length,i=h.startOffset>=e&&h.startOffsete,i&&o&&(s=t.match(u))&&s.length)return r=(a=c.indexOf(s[1],e))+s[1].length,d=s[1],this.sourceEquation={startOuterPosition:e,endOuterPosition:n,outerMatch:t,startInnerPosition:a,endInnerPosition:r,innerMatch:s},!0;l=n}},this)},this),!1!==d&&(d=d.trim()),d)))},_setEquation:function(t){var e,n,i,o,s;o=this.get("host"),t.preventDefault(),this.getDialogue({focusAfterHide:null}).hide(),""!==(i=t.currentTarget.ancestor(".atto_form").one("textarea").get("value"))&&(o.setSelection(this._currentSelection),this.sourceEquation?(i=" "+i+" ",s=(n=(e=r.one(o.getSelectionParentNode())).get("text")).slice(0,this.sourceEquation.startInnerPosition)+i+n.slice(this.sourceEquation.endInnerPosition),e.set("text",s)):(i=c.START+" "+i+" "+c.END,o.insertContentAtFocusPoint(i)),this.markUpdated())},_throttle:function(n,i){var o=null;return function(){var t=this,e=arguments;clearTimeout(o),o=setTimeout(function(){n.apply(t,e)},i)}},_updatePreview:function(t){var e,n,i,o=this._content.one(u.EQUATION_TEXT),s=o.get("value"),a=o.get("selectionStart");for(t&&t.preventDefault(),a=a||0;"\\"===s.charAt(a)&&0<=a;)--a;if(n=/[a-zA-Z\{]/,0!==a&&"{"!=s.charAt(a-1))for(;n.test(s.charAt(a))&&a=o.size()&&(a=0),e=o.item(a),this._setGroupTabFocus(i,e),e.focus()},_setGroupTabFocus:function(t,e){var n=t.generateID();"undefined"!=typeof this._groupFocus[n]&&this._groupFocus[n].setAttribute("tabindex","-1"),(this._groupFocus[n]=e).setAttribute("tabindex",0),t.setAttribute("aria-activedescendant",e.generateID())},_selectLibraryItem:function(t){var e,n,i,o,s,a=t.currentTarget.getAttribute("data-tex"),r=0;t.preventDefault(),this._setGroupTabFocus(t.currentTarget.get("parentNode"),t.currentTarget)," "!==(n=(e=(i=t.currentTarget.ancestor(".atto_form").one("textarea")).get("value")).substring(0,this._lastCursorPos)).charAt(n.length-1)&&(n+=" "),r=(n+=a).length," "!==e.charAt(this._lastCursorPos)&&(n+=" "),n+=e.substring(this._lastCursorPos,e.length),i.set("value",n),i.focus(),"number"==typeof(o=i.getDOMNode()).selectionStart?o.selectionStart=o.selectionEnd=r:"undefined"!=typeof o.createTextRange&&((s=o.createTextRange()).moveToPoint(r),s.select()),this._updatePreview(!1)},_getLibraryContent:function(){var t,e,n,i=r.Handlebars.compile(h),o=this.get("library"),s="";return r.Handlebars.registerHelper("split",function(t,e,n){var i,o,s;if(void 0===t||void 0===e)return"";for(s="",i=e.trim().split(t);0' + '' + '{{get_string groupname ../component}}' + '' + @@ -686,6 +687,7 @@ Y.namespace('M.atto_equation').Button = Y.Base.create('button', Y.M.editor_atto. }); content = template({ elementid: this.get('host').get('elementid'), + elementidescaped: this._escapeQuerySelector(this.get('host').get('elementid')), component: COMPONENTNAME, library: library, CSS: CSS, @@ -710,7 +712,23 @@ Y.namespace('M.atto_equation').Button = Y.Base.create('button', Y.M.editor_atto. content = preview.responseText; } return content; + }, + + /** + * Escape special characters in string used as a JS query selector + * + * @method _excapeQuerySelector + * @param {string} selector + * @returns {string} + */ + _escapeQuerySelector: function(selector) { + + // Bootstrap requires that query selectors have special chars excaped. + // See: https://getbootstrap.com/docs/4.2/getting-started/javascript/#selectors + + return selector.replace(/(:|\.|\[|\]|,|=|@)/g, '\\$1'); } + }, { ATTRS: { /** diff --git a/lib/editor/atto/plugins/equation/yui/src/button/js/button.js b/lib/editor/atto/plugins/equation/yui/src/button/js/button.js index 4c1cb084a74..00779ca097f 100644 --- a/lib/editor/atto/plugins/equation/yui/src/button/js/button.js +++ b/lib/editor/atto/plugins/equation/yui/src/button/js/button.js @@ -74,6 +74,7 @@ var COMPONENTNAME = 'atto_equation', '{{#each library}}' + '
  • ' + '' + '{{get_string groupname ../component}}' + '' + @@ -686,6 +687,7 @@ Y.namespace('M.atto_equation').Button = Y.Base.create('button', Y.M.editor_atto. }); content = template({ elementid: this.get('host').get('elementid'), + elementidescaped: this._escapeQuerySelector(this.get('host').get('elementid')), component: COMPONENTNAME, library: library, CSS: CSS, @@ -710,7 +712,23 @@ Y.namespace('M.atto_equation').Button = Y.Base.create('button', Y.M.editor_atto. content = preview.responseText; } return content; + }, + + /** + * Escape special characters in string used as a JS query selector + * + * @method _excapeQuerySelector + * @param {string} selector + * @returns {string} + */ + _escapeQuerySelector: function(selector) { + + // Bootstrap requires that query selectors have special chars excaped. + // See: https://getbootstrap.com/docs/4.2/getting-started/javascript/#selectors + + return selector.replace(/(:|\.|\[|\]|,|=|@)/g, '\\$1'); } + }, { ATTRS: { /**