The block editor menu havent the "editor"

Created on 2 May 2023, over 1 year ago
Updated 12 May 2023, over 1 year ago

The editor, don't see, by blocks

As I want to change the editor, from block's The Editor window is white.

I cant see the editor icons and the menu-bar.

The site where it is /block/add/basic?destination=/admin/structure/block/block-content

💬 Support request
Status

Fixed

Version

10.0

Component
CKEditor 5 

Last updated about 6 hours ago

Created by

🇩🇪Germany fvd

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

Comments & Activities

  • Issue created by @fvd
  • Status changed to Postponed: needs info over 1 year ago
  • Does the Einfaches HTML text format have the CKEditor enabled?

  • 🇩🇪Germany fvd

    Yes the ckeditor 5 is enabled:

  • Issue was unassigned.
  • Are there any browser console errors?

  • 🇩🇪Germany fvd

    I look at the chrome console.

    I hope, that is what you think about.

    But look

  • 🇧🇪Belgium wim leers Ghent 🇧🇪🇪🇺

    Which themes are you using? Can you please export your editor.editor.basic_html and editor.editor.full_html config entities and attach them here?

    Right now, the steps to reproduce this problem are missing. It's impossible for us to help you.

  • 🇩🇪Germany fvd

    Now I have the Claro theme, the same.

    Before the bootstrap5 3.0.7 theme.

    The files what I have found for the search "editor.editor." are:
    editor.editor.format_1.yml
    editor.editor.format_2.yml
    editor.editor.format_3.yml
    editor.editor.gutenberg.yml
    editor.editor.eu_test_text_format.yml
    editor.editor.basic_html.yml

    here the file: editor.editor.basic_html.yml

    langcode: en
    status: true
    dependencies:
      config:
        - filter.format.basic_html
      module:
        - ckeditor
    format: basic_html
    editor: ckeditor
    settings:
      toolbar:
        rows:
          -
            -
              name: Formatting
              items:
                - Bold
                - Italic
            -
              name: Linking
              items:
                - DrupalLink
                - DrupalUnlink
            -
              name: Lists
              items:
                - BulletedList
                - NumberedList
            -
              name: Media
              items:
                - Blockquote
                - DrupalImage
            -
              name: 'Block Formatting'
              items:
                - Format
            -
              name: Tools
              items:
                - Source
      plugins:
        stylescombo:
          styles: ''
    image_upload:
      status: true
      scheme: public
      directory: inline-images
      max_size: ''
      max_dimensions:
        width: 0
        height: 0
    

    The file "editor.editor.full_html.yml":

    langcode: en
    status: true
    dependencies:
      config:
        - filter.format.full_html
      module:
        - ckeditor
    format: full_html
    editor: ckeditor
    settings:
      toolbar:
        rows:
          -
            -
              name: Formatting
              items:
                - Bold
                - Italic
                - Strike
                - Superscript
                - Subscript
                - '-'
                - RemoveFormat
            -
              name: Linking
              items:
                - DrupalLink
                - DrupalUnlink
            -
              name: Lists
              items:
                - BulletedList
                - NumberedList
            -
              name: Media
              items:
                - Blockquote
                - DrupalImage
                - Table
                - HorizontalRule
            -
              name: 'Block Formatting'
              items:
                - Format
            -
              name: Tools
              items:
                - ShowBlocks
                - Source
      plugins: {}
    image_upload:
      status: true
      scheme: public
      directory: inline-images
      max_size: ''
      max_dimensions:
        width: 0
        height: 0

    Do you need the other files also?

  • 🇩🇪Germany fvd

    The expand console messages...

  • The console errors would be more readable if you disable JavaScript aggregation, rebuild the cache and check again.

  • 🇩🇪Germany fvd

    Without javascrip and cleared cache, there isn't something in the console errors

  • Without JavaScript aggregation, correct? Does the editor appear in that case?

  • 🇩🇪Germany fvd

    uuups, forgot to reload the page...

    now the message:

    GET https://excample.com/core/themes/claro/images/menu-expanded.png 404

    s_QjckxYY7d65OkDZ_kKnspyGUlRI9mSC-aM4xmMhrTbg.css:1

  • 🇩🇪Germany fvd

    Now I change the theme to the bootstrap5 3.0.7, there isn't the 404 error. The console are white

  • I suggested disabling JavaScript aggregation, not disabling JavaScript.

  • 🇩🇪Germany fvd

    ok, now the lines

    _EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:790 Uncaught TypeError: t.widget is not a function
        at js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:790:176
        at js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:790:98
        at js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:790:108
    (anonym) @ js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:790
    (anonym) @ js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:790
    (anonym) @ js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:790
    js_imBAFE-9x1N7dSyeaqYsQw41pYK0UK26HIoEAgEX5MU.js:274 Uncaught TypeError: Cannot destructure property 'isTabbable' of 'undefined' as it is undefined.
        at js_imBAFE-9x1N7dSyeaqYsQw41pYK0UK26HIoEAgEX5MU.js:274:16
        at js_imBAFE-9x1N7dSyeaqYsQw41pYK0UK26HIoEAgEX5MU.js:296:3
    (anonym) @ js_imBAFE-9x1N7dSyeaqYsQw41pYK0UK26HIoEAgEX5MU.js:274
    (anonym) @ js_imBAFE-9x1N7dSyeaqYsQw41pYK0UK26HIoEAgEX5MU.js:296
    js_1jUdZvL6XKZt8VOIVQRpKpOgLzWrAiYa_-0aej3h6zE.js:746 Uncaught TypeError: Cannot set properties of undefined (setting 'ckeditor5')
        at js_1jUdZvL6XKZt8VOIVQRpKpOgLzWrAiYa_-0aej3h6zE.js:746:28
        at js_1jUdZvL6XKZt8VOIVQRpKpOgLzWrAiYa_-0aej3h6zE.js:1035:3
    (anonym) @ js_1jUdZvL6XKZt8VOIVQRpKpOgLzWrAiYa_-0aej3h6zE.js:746
    (anonym) @ js_1jUdZvL6XKZt8VOIVQRpKpOgLzWrAiYa_-0aej3h6zE.js:1035
    js_Bl1rHbdRjJuL1BH7MqZBeGvITKPztEWCAzub9XWVb_c.js:1369 Uncaught TypeError: Cannot read properties of undefined (reading 'prototype')
        at js_Bl1rHbdRjJuL1BH7MqZBeGvITKPztEWCAzub9XWVb_c.js:1369:23
        at js_Bl1rHbdRjJuL1BH7MqZBeGvITKPztEWCAzub9XWVb_c.js:1376:3
    (anonym) @ js_Bl1rHbdRjJuL1BH7MqZBeGvITKPztEWCAzub9XWVb_c.js:1369
    (anonym) @ js_Bl1rHbdRjJuL1BH7MqZBeGvITKPztEWCAzub9XWVb_c.js:1376
    js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:105 Uncaught TypeError: Drupal.toolbar.ToolbarModel is not a constructor
        at js_Bl1rHbdRjJuL1BH7MqZBeGvITKPztEWCAzub9XWVb_c.js:1108:23
        at Array.forEach (<anonymous>)
        at Object.attach (js_Bl1rHbdRjJuL1BH7MqZBeGvITKPztEWCAzub9XWVb_c.js:1106:59)
        at js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:207:24
        at Array.forEach (<anonymous>)
        at Drupal.attachBehaviors (js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:203:34)
        at js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:729:12
        at HTMLDocument.listener (js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:717:7)
    (anonym) @ js_Bl1rHbdRjJuL1BH7MqZBeGvITKPztEWCAzub9XWVb_c.js:1108
    attach @ js_Bl1rHbdRjJuL1BH7MqZBeGvITKPztEWCAzub9XWVb_c.js:1106
    (anonym) @ js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:207
    Drupal.attachBehaviors @ js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:203
    (anonym) @ js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:729
    listener @ js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:717
    setTimeout (async)
    Drupal.throwError @ js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:104
    (anonym) @ js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:209
    Drupal.attachBehaviors @ js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:203
    (anonym) @ js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:729
    listener @ js_EaD9J8rIajgInRrG-rcH1SQqUeB_jfUt80Txmh6Fvi8.js:717
  • 🇧🇪Belgium wim leers Ghent 🇧🇪🇪🇺

    It sounds like this issue is a duplicate of 🐛 Aggregation breaks CKEditor 5 Closed: duplicate .

    Can you confirm? In other words: does the problem ONLY occur when JS and CSS aggregation are enabled? (And not when they're both disabled?)

  • Aggregation is still enabled in comment #16.

  • 🇩🇪Germany fvd

    yes Wim Leers , that is the Issue 🐛 Aggregation breaks CKEditor 5 Closed: duplicate

    thanks

    Now I disable css and javascript aggregation at /admin/config/development/performance 🐛 Library order asset weights do not work properly when a large number of javascript files is loaded between two jQuery UI libraries Fixed that is from https://www.drupal.org/project/drupal/issues/3222107 🐛 Library order asset weights do not work properly when a large number of javascript files is loaded between two jQuery UI libraries Fixed

    And the menu from the ckeditor 5 is there, at all editor types!

    But now, look what the console say

    ntrolgroup.js:39 Uncaught TypeError: t.widget is not a function
        at controlgroup.js:39:10
        at controlgroup.js:32:3
        at controlgroup.js:19:1
    (anonym) @ controlgroup.js:39
    (anonym) @ controlgroup.js:32
    (anonym) @ controlgroup.js:19
    form-reset-mixin.js:34 Uncaught TypeError: Cannot set properties of undefined (setting 'formResetMixin')
        at form-reset-mixin.js:34:13
        at form-reset-mixin.js:29:3
        at form-reset-mixin.js:15:1
    (anonym) @ form-reset-mixin.js:34
    (anonym) @ form-reset-mixin.js:29
    (anonym) @ form-reset-mixin.js:15
    mouse.js:40 Uncaught TypeError: e.widget is not a function
        at mouse.js:40:10
        at mouse.js:30:3
        at mouse.js:15:1
    (anonym) @ mouse.js:40
    (anonym) @ mouse.js:30
    (anonym) @ mouse.js:15
    checkboxradio.js:40 Uncaught TypeError: Cannot read properties of undefined (reading 'formResetMixin')
        at checkboxradio.js:40:38
        at checkboxradio.js:35:3
        at checkboxradio.js:20:1
    (anonym) @ checkboxradio.js:40
    (anonym) @ checkboxradio.js:35
    (anonym) @ checkboxradio.js:20
    draggable.js:42 Uncaught TypeError: Cannot read properties of undefined (reading 'mouse')
        at draggable.js:42:32
        at draggable.js:37:3
        at draggable.js:17:1
    (anonym) @ draggable.js:42
    (anonym) @ draggable.js:37
    (anonym) @ draggable.js:17
    resizable.js:41 Uncaught TypeError: Cannot read properties of undefined (reading 'mouse')
        at resizable.js:41:32
        at resizable.js:36:3
        at resizable.js:19:1
    (anonym) @ resizable.js:41
    (anonym) @ resizable.js:36
    (anonym) @ resizable.js:19
    button.js:44 Uncaught TypeError: t.widget is not a function
        at button.js:44:3
        at button.js:39:3
        at button.js:19:1
    (anonym) @ button.js:44
    (anonym) @ button.js:39
    (anonym) @ button.js:19
    dialog.js:49 Uncaught TypeError: i.widget is not a function
        at dialog.js:49:3
        at dialog.js:44:3
        at dialog.js:19:1
    (anonym) @ dialog.js:49
    (anonym) @ dialog.js:44
    (anonym) @ dialog.js:19
    widget.js:104 Uncaught TypeError: i is not a constructor
        at t.widget (widget.js:104:18)
        at dialog.jquery-ui.js?v=10.0.8:7:5
        at dialog.jquery-ui.js?v=10.0.8:75:3
    t.widget @ widget.js:104
    (anonym) @ dialog.jquery-ui.js?v=10.0.8:7
    (anonym) @ dialog.jquery-ui.js?v=10.0.8:75
    widget.js:81 Uncaught RangeError: Maximum call stack size exceeded
        at new t.<computed>.<computed> (widget.js:81:11)
        at new t.<computed>.<computed> (widget.js:81:11)
        at new t.<computed>.<computed> (widget.js:81:11)
        at new t.<computed>.<computed> (widget.js:81:11)
        at new t.<computed>.<computed> (widget.js:81:11)
        at new t.<computed>.<computed> (widget.js:81:11)
        at new t.<computed>.<computed> (widget.js:81:11)
        at new t.<computed>.<computed> (widget.js:81:11)
        at new t.<computed>.<computed> (widget.js:81:11)
        at new t.<computed>.<computed> (widget.js:81:11)
    t
  • 🇧🇪Belgium wim leers Ghent 🇧🇪🇪🇺

    Interesting observation, @FvD! 😄 👏

    You said in #3 you're on 10.0.8.

    But 🐛 Library order asset weights do not work properly when a large number of javascript files is loaded between two jQuery UI libraries Fixed did not ship in a release until 10.0.9! See https://www.drupal.org/project/drupal/releases/10.0.9 .

    Can you please try updating to 10.0.9, clear all Drupal caches, clear all browser caches and then report back? 🙏

  • 🇩🇪Germany fvd

    Wim, it works fine!😀

    1. I update drupal to 10.0.9
    2. switch java and css on: /admin/config/development/performance
    3. flush all caches

    4. Look at the blook editor page, and it works!

    Great! 🤠🙏

  • Status changed to Fixed over 1 year ago
  • 🇧🇪Belgium wim leers Ghent 🇧🇪🇪🇺

    Excellent!

    So this was an unrelated core bug causing this, fixed since Drupal 10.0.9. Yay! 😊

    Thanks for all your help and patience, @FvD!

  • 🇧🇪Belgium wim leers Ghent 🇧🇪🇪🇺

    Congrats on your first Drupal core issue credit! 😊

  • 🇩🇪Germany fvd

    Thank's @Wim Leers 🤠🙏

  • Automatically closed - issue fixed for 2 weeks with no activity.

Production build 0.71.5 2024