Improved `<kbd>` UX

diff --git a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabCode.js b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabCode.js
index 1c8753eb74e0966fcbf0d961a30915868ef2dadb..fae437095ad1f958163b6feec7d037a73ec8d727 100644 (file)
--- a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabCode.js
+++ b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabCode.js
@@ -12,6 +12,17 @@ $.Redactor.prototype.WoltLabCode = function() {
                                mpStart.call(this, html);
                                
                                WCF.System.Event.fireEvent('com.woltlab.wcf.redactor2', 'codeStart_' + this.$element[0].id);
+                               
+                               // force insert zero-width white space after each <kbd>
+                               elBySelAll('kbd', this.$editor[0], function (kbd) {
+                                       var nextSibling = kbd.nextSibling;
+                                       if (nextSibling && nextSibling.nodeType === Node.TEXT_NODE && nextSibling.textContent.substr(0, 1) === "\u200B") {
+                                               return;
+                                       }
+                                       
+                                       var textNode = document.createTextNode("\u200B");
+                                       kbd.parentNode.insertBefore(textNode, nextSibling);
+                               });
                        }).bind(this);
                        
                        var mpSet = this.code.set;