Load contextual balloon as dependency

Created on 12 December 2024, 4 months ago

Problem/Motivation

Without requiring the contextual balloon plugin (or it being provided by another plugin) CKeditor will not load.

Steps to reproduce

  1. Create a text format with only ckeditor and this plugin enabled.
  2. Edit a piece using the text-format
  3. Ckeditor toolbar will not load
  4. Console error will read:
    plugincollection-plugin-not-loaded {"plugin":"ContextualBalloon"}

If you enable another plugin which uses ContextualBalloon, such as editor_advance_image, the toolbar will load and it will be a success.

Proposed resolution

Here's how it's done in the editor_advance_image module

/**
 * The Editor Advanced Image UI plugin.
 *
 * The plugin uses the contextual balloon.
 *
 * @see module:ui/panel/balloon/contextualballoon~ContextualBalloon
 *
 * @extends module:core/plugin~Plugin
 *
 * @internal
 */
export default class EditorAdvancedImageUI extends Plugin {
  /**
   * @inheritdoc
   */
  static get requires() {
    return [ContextualBalloon];
  }

Remaining tasks

Adapt the solution above for ckeditor_insert_blocks
Test that the solution works
Review
Merge

User interface changes

The module will work on its own without requiring other modules to be enabled manually.

API changes

Addition of a requirement for ContextualBalloon in the module code

Data model changes

N/A

🐛 Bug report
Status

Active

Version

1.0

Component

Code

Created by

🇬🇧United Kingdom jacobupal Leeds

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @jacobupal
  • 🇬🇧United Kingdom jacobupal Leeds
  • 🇬🇧United Kingdom jacobupal Leeds
    • 2dc4a057 committed on 1.0.x
      Issue #3493579: Load contextual balloon as dependency
      
  • 🇫🇷France lazzyvn paris

    test on drupal 10 11 but I can't reproduce the error message.
    I add this method in dev version anyway

  • 🇬🇧United Kingdom jacobupal Leeds

    I just tried this again. This time with a clean install of Drupal 10.0.4 using drupalpod, with ckeditor_insert_blocks 1.0.0.

    To reproduce the error, (and demonstrate the fix) this is exactly what I did:

    1. Install Drupal 10.0.4 using drupalpod, with ckeditor_insert_blocks 1.0.0.

    Make sure the fix for this issue hasn't accidentally been included already (I had to manually remove it, because drupalpod installs version1.x-dev by default, and in that branch the recommended code has already been added)

    To ensure the right version is being tested, this should not appear in the code when testing:

      static get requires() {
        return [ContextualBalloon];
      }
    

    1. Make a new text-format - The preconfigured text-formats (html, full_html, etc) will not trigger the error because they have some other plugins enabled by default - You will need to create a new text format where you will see that only "bold" "italic" and "Headings" are enabled, but no other buttons, or filters.

    2. Add the ckeditor_insert_blocks button and filter.

    3. Edit a piece of content with this new text format.

    4. The toolbar will not load.

    5. Add the following to the code:

      static get requires() {
        return [ContextualBalloon];
      }
    

    6. Refresh and you will see it works again.

    I've attached a video showing the change which occurs with or without the additional code.

    So I think we can call this "Fixed".

  • 🇬🇧United Kingdom jacobupal Leeds
  • 🇫🇷France lazzyvn paris

    Did you try the dev version to see if it works?
    and have you tried the block content type, does it work when you update?

  • 🇬🇧United Kingdom jacobupal Leeds

    I did try the dev version, it works correctly, as shown.

    I will try in the content blocks now... yep it works exactly the same way as it does for content types!

  • 🇬🇧United Kingdom jacobupal Leeds
  • Automatically closed - issue fixed for 2 weeks with no activity.

Production build 0.71.5 2024