Uploaded image for project: 'XWiki Platform'
  1. XWiki Platform
  2. XWIKI-20036

Cannot insert an image in WYSIWYG mode with the new image dialog after upgrading XWiki

    XMLWordPrintable

    Details

    • Type: Bug
    • Status: Closed
    • Priority: Critical
    • Resolution: Solved By
    • Affects Version/s: 13.10.6
    • Fix Version/s: None
    • Component/s: WYSIWYG Editor
    • Labels:
      None
    • Environment:
      Windows 11 Pro 64 bit, Chrome 103, using a local instance of XWiki 14.6 on Jetty/HSQL, Java 17.0.4+11-LTS-179 (Oracle)
    • Difficulty:
      Unknown
    • Similar issues:

      Description

      Steps to reproduce:

      • Take a clean XWiki 13.10.5 (or any older version that ships with CKEditor Integration 1.61 or below, which doesn't have the new image dialog)
      • Open Wiki Administration > Editing > WYSIWYG Editor and check the list of "Disabled Plugins": the 'xwiki-image' plugin is not disabled (you can search for it when opening the drop down); moreover, there's no 'xwiki-image-old' plugin
      • Save the configuration (no need to change anything, but the result is the same if you change)
      • Open the Extension Manager administration section, search for the CKEditor Integration extension and upgrade it to version 1.62 (or any newer version); 1.62 is the version when the new image dialog was introduced, see CKEDITOR-436
        • Alternatively, you can get the same result by upgrading XWiki to 14.3-rc-1+ / 13.10.6+, i.e. any version that has CKEditor Integration 1.62+ (see XWIKI-19643)
      • Clear the browser cache
      • Go back to Wiki Administration > Editing > WYSIWYG Editor and check again the list of "Disabled Plugins"; the 'xwiki-image' plugin is still not disabled, but if you search for 'xwiki-image' in the drop down you'll now see both 'xwiki-image' and 'xwiki-image-old'; this means the new image dialog is enabled
      • Edit a wiki page with the WYSIWYG editor to see that the new image dialog is enabled (even though it's experimental)
        • From CKEditor's toolbar, click Image
        • Select an image from the Document Tree or Upload an image
        • Click Select > Insert => the image is not inserted and there is a JavaScript error in the console
      • If you go back to Wiki Administration > Editing > WYSIWYG Editor and disable the 'xwiki-image' plugin (and save) then you get the old (working) image dialog

      In browser's JS console, there are the following errors:
       

      Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'selectize')
          at n (imageWizard.bundle.min.js:12:427)
          at imageWizard.bundle.min.js:8:281
      
      Uncaught TypeError: Cannot read properties of null (reading 'insertBefore')
          at window.CKEDITOR.window.CKEDITOR.dom.CKEDITOR.dom.element.insertBefore (ckeditor.js:71:324)
          at window.CKEDITOR.window.CKEDITOR.dom.CKEDITOR.dom.element.replace (ckeditor.js:79:123)
          at Object.d [as inflate] (ckeditor.js:1167:299)
          at h.shiftState (ckeditor.js:1192:179)
          at h.data (ckeditor.js:1169:412)
          at b.data (ckeditor.js:1484:367)
          at b.data (ckeditor.js:1484:367)
          at e.data (ckeditor.js:1492:283)
          at h.l (ckeditor.js:10:246)
          at h.fire (ckeditor.js:12:91)
      

      This issue was reproduced also in XWiki 13.10.8, but not reproduced in XWiki 14.6 or 14.4.2.

        Attachments

          Issue Links

            Activity

              People

              Assignee:
              mflorea Marius Dumitru Florea
              Reporter:
              iandriuta Ilie Andriuta
              Votes:
              0 Vote for this issue
              Watchers:
              3 Start watching this issue

                Dates

                Created:
                Updated:
                Resolved:
                Date of First Response: