XWIKI-11478: Documents with special characters in their name are not displayed in the tree

* Fix the problem in the tree widget untill it's fixed upstream.
* Escape the macro parameter values in DocumentTree macro and Navigation panel.

xwiki-platform-core/xwiki-platform-index/xwiki-platform-index-ui/src/main/resources/XWiki/DocumentTree.xml

@@ -188,6 +188,7 @@
     </class>
     <property>
       <code>{{velocity}}
+#macro (escapeMacroParam $value)$!value.replaceAll('([~"])', '~$1')#end
 #set ($docTreeConfig = {
   'showWikis': false,
   'showWikiPrettyName': true,
@@ -208,13 +209,14 @@
     #set ($discard = $resourceParams.put($entry.key, $value))
   #end
 #end
+#set ($reference = "path:$xwiki.getURL($xcontext.macro.doc.documentReference, 'get', $escapetool.url($resourceParams))")
 #set ($editable = $xcontext.macro.params.readOnly != 'true')
 #set ($isFullWidthAvailable = $xcontext.macro.params.compact != 'true')
 #set ($links = $xcontext.macro.params.links == 'true')
 #set ($checkboxes = $xcontext.macro.params.checkboxes == 'true')
-{{tree reference="path:$xwiki.getURL($xcontext.macro.doc.documentReference, 'get', $escapetool.url($resourceParams))"
-  root="$!xcontext.macro.params.root" dragAndDrop="$editable" contextMenu="$editable" icons="$isFullWidthAvailable"
-  edges="$isFullWidthAvailable" links="$links" checkboxes="$checkboxes" openTo="$!xcontext.macro.params.openTo" /}}
+{{tree reference="#escapeMacroParam($reference)" root="#escapeMacroParam($xcontext.macro.params.root)"
+  dragAndDrop="$editable" contextMenu="$editable" icons="$isFullWidthAvailable" edges="$isFullWidthAvailable"
+  links="$links" checkboxes="$checkboxes" openTo="#escapeMacroParam($xcontext.macro.params.openTo)" /}}
 {{/velocity}}</code>
     </property>
     <property>

xwiki-platform-core/xwiki-platform-panels/xwiki-platform-panels-ui/src/main/resources/Panels/Navigation.xml

@@ -124,8 +124,10 @@
     <property>
       <content>{{velocity}}
 #panelheader($services.localization.render('xe.panels.navigation'))
+## Escape special characters in macro parameter values.
+#set ($openToDoc = $doc.documentReference.toString().replaceAll('([~"])', '~$1'))
 {{documentTree showSpaces="true" showTranslations="false" showAttachments="false"
-  showChildDocuments="false" compact="true" openTo="document:$doc.documentReference" /}}
+  showChildDocuments="false" compact="true" openTo="document:$openToDoc" /}}
 #panelfooter()
 {{/velocity}}</content>
     </property>

xwiki-platform-core/xwiki-platform-tree/xwiki-platform-tree-webjar/src/main/resources/tree.js

 define(['jquery', 'JobRunner', 'jsTree'], function($, JobRunner) {
+  // Fix the regular expression used by jsTree to escape special characters in CSS selectors. It is mainly used to be
+  // able to find a tree node by its id using Element#querySelector. We overwrite the default value used by jsTree in
+  // order to add the following special characters: ?`.
+  // TODO: Drop this after https://github.com/vakata/jstree/pull/914/ is merged.
+  $.jstree.idregex = /[\\:&!^|()\[\]<>@*'+~#";.,=\- \/${}%?`]/g;
+
   var formToken = $('meta[name=form_token]').attr('content');
 
   var getNodeTypes = function(nodes) {