Contrib.social

Mercury Editor content creation page blank and can't add anything

Open on Drupal.org →
Created on 21 February 2025, about 1 month ago

Problem/Motivation

Mercury Editor content creation page blank and can't add anything.

Trying to use Mercury Editor 2.2 with Drupal 11.1.2 and cannot get it work, all I end up with is a blank page (see mercury-editor-edit.png attached).

Followed instructions from Mercury Editor project page and Layout Paragraphs project page and watched several videos describing the process but I must be missing something. The Add Content page is clearly using Mercury Editor but I can't get any controls to show up on the page and the edit tray on the right side of the page doesn't show up.

Steps to reproduce

Here are my module installations -

ddev composer require 'drupal/bootstrap5:^4.0'
ddev composer require 'drupal/twbstools:^2.1'
ddev composer require 'drupal/layout_paragraphs:^2.1'
ddev composer require 'drupal/layout_paragraphs_library:^2.1'
ddev composer require 'drupal/entity_usage:^2.0@beta'
ddev composer require 'drupal/mercury_editor:^2.2'
ddev composer require 'drupal/style_options:^1.1'
ddev composer require 'drupal/mercury_layouts:^1.3'

ddev drush pm:enable layout_paragraphs --yes
ddev drush pm:enable layout_paragraphs_library --yes
ddev drush pm:enable mercury_editor --yes
ddev drush pm:enable mercury_editor_templates --yes
ddev drush pm:enable style_options --yes
ddev drush pm:enable mercury_layouts --yes
ddev drush pm:enable twbstools --yes

Steps followed:

  1. Created new content type.
  2. Added "section" field to it and chose "Layout Paragraphs" as the field widget (Manage form display).
  3. Chose "Layout Paragraphs" as the field formatter (Manage Display).
  4. Created new "layout" Paragraph Type, initially with no fields; added a field later as a test.
  5. Enabled "Layout Paragraphs" as behavior for "layout" Paragraph Type.
  6. In Mercury Editor Settings I selected that content type to be managed.
  7. Using Content Add, tried creating the new content type.
  8. Brings up Mercury Editor but just with that blank page.

There are no error messages or log files to review (that I'm aware of) so I'm kind of stuck and would appreciate any guidance.

Tried posting this to Drupal Answers but it was closed immediately with the explanation that this is a bug and needed to be submitted as an issue to the issue queue. I'm thinking that the "bug" might be located between my ears! :)

🐛 Bug report
Status

Active

Version

2.2

Component

Code

Created by

🇺🇸United States etxaleku

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

Comments & Activities

  • Issue created by @etxaleku
  • Comment about 1 month ago →
    🇺🇸United States etxaleku

    Chris Kelly suggested F12 browser debug which shows these errors -

    The resource from “https://pmr.ddev.site/libraries/dragula/dist/dragula.min.css?ss20sb” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).

The resource from “https://pmr.ddev.site/libraries/dragula/dist/dragula.min.js?v=3.7.3” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).

    So it looks like they need to be "text/css" and "application/javascript" respectively.

    I have no idea how to do that and it sounds like dragula is probably very critical to the drag/drop Mercury Editor behavior so I probably need to wait for this issue to be resolved before I'll be able to proceed.

  • Comment about 1 month ago →
    🇺🇸United States etxaleku

    Clive over at Drupal Answers provided some direction. Turns out that a significant part of the issue is that the dragula css/js library is not installed as part of Mercury Editor installation and there is no instructions that call out the requirement to install it. Clive suggested

    1. Installing dragula (npm install dragula)
    2. Disabling CSS/JS aggregation

    Once npm was installed the MIME type issues above were resolved and after disabling aggregation the Mercury Editor tray started working.

    However, I'm still unable to get any drag and drop functionality to work as no UI controls are generated.

contrib.social Blog FAQ Discussions
Production build 0.71.5 2024