New WYSIWYG Editor: Share feedback & issues here

This is a thread specifically to collect feedback regarding issues and limitations of the new WYSIWYG editor, introduced in BookStack v24.10.

This below list will be continuously updated from feedback to form a full listing to be worked on.
Please only report issues where not already in this list.
Generally our goal is to match the existing TinyMCE based editor as close as possible.

Known Issues

Related PRs

@ssddanbrown

@ssddanbrown I would love to test it out, but I don't see yet any v24.10 release.

@AvrumFeldman

@AvrumFeldman I'm just preparing its release now, for later this week (Created this so I could link to it from the update blogpost)

Bookstack v24.10 released a few hours age and i unfortunately found a bug. Not sure if i had to post it here so ill post the link: #5249.

I found a few differences in the way lists are handled:

Pressing TAB (or SHIFT TAB) on an empty list item does not change the list level.
Reproduce by creating a bullet or numbered list and pressing TAB.
Old behaviour was that TAB and SHIFT TAB increased or decreased the level for the item respectively.
Pressing ENTER on an empty list item if the level is higher than one will not decease the level, but create a new item on the same level.
Reproduce by creating a list, insert 1 item and increase the level with TAB, then keep pressing enter.
Old behaviour was that ENTER on an empty item would decrease the level.
Decreasing the level of an item in the middle of a list puts it after the current list.
Reproduce by creating a list with 3 items, selecting the middle item and decreasing the level.
Old and new behaviour in the images:
Pressing ENTER on an item that is not empty, but only has spaces, deletes the item (except for levels higher than one, because of issue 2.)
Reproduce by creating a list, insert 1 item, enter a couple spaces and press ENTER.
Old behaviour was that items with spaces are kept.
Increasing the list level of an item directly after an empty (or only spaces) item deletes the previous item (but keeps any space content).
Reproduce by creating a list with 3 items, empty the middle item, then increase the level of the last item.
Old behaviour allowed empty list items if they were emptied afterwards, and didn't delete them.
Also see images:
Whole text gets selected when increasing / decreasing level.
Old behaviour kept the cursor or selection placement in the list item contents.

This wasn't supposed to be only about lists, but here we are.

@ssddanbrown

Hi @ssddanbrown
First of all, thank you very much for your work.
I started watching the release video but haven't managed to finish it yet.
It is possible that it has already been mentioned there.

When entering a link in the new editor and hit return or shift return, the link stays as it is. The old editor with tinymce had automatically changed urls into clickable links.
The editor together with the dark theme is still on the light mode and kind of hard readable.

I have also a question.
I was able to customize the buttons with the old tinymce version. For this, I had added this line into the customization: <script src="/js/custom.js"></script> and added in the corresponding directory my code to add a "clear format" button on the top level menu and also to add a shortcut ctrl+shift+u for clear format. Hopefully, this feature will also be implemented to customize the new editor buttons, if needed? It would be very nice, to have this feature also in the future to customize the editor.

Here's my code which I have used to modify the buttons:

window.addEventListener("editor-tinymce::pre-init", (event) => {
  const mceConfig = event.detail.config;
  mceConfig.toolbar += " clearformat";
});

window.addEventListener("editor-tinymce::setup", (event) => {
  const editor = event.detail.editor;

  // Registriere das Icon mit validiertem SVG-Code
  editor.ui.registry.addIcon(
    "clearformaticon",
    `<svg xmlns="http://www.w3.org/2000/svg"
      width="24" height="24"
      viewBox="0 0 496 496" xml:space="preserve">
      fill="currentColor">
    
      <path style="fill:#DD3E95;" d="M363.6,224V37.6C363.6,15.2,348.4,0,326,0H169.2c-22.4,0-37.6,15.2-37.6,37.6V224H363.6z"/>
      <path style="fill:#BC086B;" d="M131.6,224h232V37.6C363.6,15.2,348.4,0,326,0H179.6"/>
      <path style="fill:#2F96C9;" d="M131.6,272v186.4c0,22.4,23.2,37.6,45.6,37.6h149.6c22.4,0,37.6-15.2,37.6-37.6V272H131.6z"/>
      <path style="fill:#207EB7;" d="M181.2,272l-49.6,186.4c0,22.4,23.2,37.6,45.6,37.6h149.6c22.4,0,37.6-15.2,37.6-37.6V272H181.2z"/>
      <rect x="131.6" y="224" style="fill:#FFFFFF;" width="232" height="48"/>
      <rect x="179.6" y="224" style="fill:#EFE6D8;" width="184" height="48"/>
      <rect x="275.6" y="224" style="fill:#DDD3C5;" width="88" height="48"/>
      <path style="fill:#095A91;" d="M179.6,272v224H326c22.4,0,37.6-15.2,37.6-37.6V272H179.6z"/>
      <path style="fill:#044D7F;" d="M179.6,496H326c22.4,0,37.6-15.2,37.6-37.6V272"/>
      <path style="fill:#911743;" d="M326,0H179.6v224h184V37.6C363.6,15.2,348.4,0,326,0z"/>
      <polyline style="fill:#7F113E;" points="179.6,224 363.6,224 363.6,40 "/>

      </svg>`
  );

  // Füge den Button hinzu
  editor.ui.registry.addButton("clearformat", {
    tooltip: "Formatierung entfernen (Ctrl/Cmd+Alt+U)",
    icon: "clearformaticon",
    onAction() {
      editor.execCommand("RemoveFormat");
    },
  });

  // Shortcuts hinzufügen
  editor.addShortcut("ctrl+alt+u", "Formatierung entfernen", () => {
    editor.execCommand("RemoveFormat");
  });

  // macOS
  editor.addShortcut("meta+alt+u", "Formatierung entfernen", () => {
    editor.execCommand("RemoveFormat");
  });
});

@thegatesdev

@thegatesdev Thanks, lists are deceivingly complex 😅

Do you have a use-case/need for empty (space only) lists?
Just thinking on the balance of matching the new editor, vs potential convenience in treating whitespace only items as empty.

@miracuruzrh Thanks! Had meant to note the lack of dark mode support but had forgotten by release!

In regard to customizations/hacking, that's not something I'm considering right now in the earlier alpha/beta stages, but maybe it's something that can be discussed in the later stages toward when it's becoming the default, when internals/development has stabilised a bit.

Do you have a use-case/need for empty (space only) lists?

One use-case I can think of is when using numbered lists, when writing content from elsewhere that is already numbered, you can skip one entry (for later) by leaving it empty and preserving the numbering for the next.
Since it's basically the standard behaviour (both in Office 365 and Google Docs) I feel like keeping this would be nicer for the user.

lists are deceivingly complex

I realized that while testing, best of luck with the implementation 🙏🏼 🥲

@thegatesdev

@thegatesdev Thanks, lists are deceivingly complex 😅

Do you have a use-case/need for empty (space only) lists? Just thinking on the balance of matching the new editor, vs potential convenience in treating whitespace only items as empty.

@miracuruzrh Thanks! Had meant to note the lack of dark mode support but had forgotten by release!

In regard to customizations/hacking, that's not something I'm considering right now in the earlier alpha/beta stages, but maybe it's something that can be discussed in the later stages toward when it's becoming the default, when internals/development has stabilised a bit.

Hi @ssddanbrown
Many thanks for your reply. Sure, I fully understand. Important things first. If needed, we can always go back to the earlier editor.

Hi Dan, you may already be aware of this regarding collapsible blocks:

Unable to insert new content after/outside of the block.
It's not clear how to change the label
Header background is a different colour

Migrated Page

New Page

Additionally (These may be better suited as a dedicated feature requests),

I've really been enjoying Confluence's latest editor whereby you can use Markdown shortcuts as you type.

Starting a line with #<space> automatically converts it to Heading 1
--- inserts a horizontal rule
``` creates a code block

Separately, the / to list and search for page components is quite useful too.

@beanaroo

Thanks @beanaroo, have added those notes regarding collapse block issues.

@beanaroo @ttepatti I consider new functionality outside the scope of this issue, and in regard to markdown based auto-conversion/formatting specifically, this has been touched upon previously in #2025 and my feelings are much the same. Would be more open to making that kind of thing possible via an unofficial hack, once the editor is more stable/mature.

When switching from the old editor or from the markdown editor, task lists are converted to bullet lists. Switching them to a task list is easy (simply click the task list button again and it converts) but this would be a nice improvement.
This is something I do regularly. Create new pages in markdown (I find it easier in general) but then switch to the WYSIWYG so others can make edits too.

Ctrl+S does not save draft although the toast notification saying otherwise.
Ctrl+Return does not save page although the toast notification saying otherwise.

Hi,

I’d like to highlight some ergonomic issues with the new WYSIWYG editor compared to the previous version with the TinyMCE editor.

Details

Difficulty adding content before an image :
Actual Editor :

New Editor :

Another example with a table and an image :
Actual Editor :

New Editor :

It is impossible to resize columns of a table:
Actual Editor :

New Editor :

Browsers tested:
Firefox (128.6.0)
Chrome (132)

These issues make it challenging to manage layouts effectively.

Thank you for your attention to this matter.

Best regards,

When clicking a menu button on the new WYSIWYG editor, if you leave any of either the button or the menu that opens, it all closes out. The old editor, it would stay put until either you clicked off of the menu or you clicked on an item in the menu.

I cannot take a screencap or I would.

Yes! That is it. I don't see your comment in the thread though. Not sure how to see it. That is it though.

…

On Thu, Mar 13, 2025 at 9:47 AM Tim ***@***.***> wrote: @Hallsie <https://github.com/Hallsie> I think this is what you mean: (Oops, give me a second, wrong encoding) https://github.com/user-attachments/assets/e649d075-2758-4714-908d-5f9baabd807d — Reply to this email directly, view it on GitHub <#5245 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AGBRIX3PFBEGJWXJ6F6HNWL2UGD6LAVCNFSM6AAAAABPP2LD3OVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDOMRRGMZDCMZXGQ> . You are receiving this because you were mentioned.Message ID: ***@***.***> [image: thegatesdev]*thegatesdev* left a comment (BookStackApp/BookStack#5245) <#5245 (comment)> @Hallsie <https://github.com/Hallsie> I think this is what you mean: (Oops, give me a second, wrong encoding) https://github.com/user-attachments/assets/e649d075-2758-4714-908d-5f9baabd807d — Reply to this email directly, view it on GitHub <#5245 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AGBRIX3PFBEGJWXJ6F6HNWL2UGD6LAVCNFSM6AAAAABPP2LD3OVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDOMRRGMZDCMZXGQ> . You are receiving this because you were mentioned.Message ID: ***@***.***>

Haha, sorry the first part of the screen recording was broken for me, and I couldn't fix it in time. That is why I deleted the comment. I'll record it again today.

Here we go:

DisappearingMenuExample.mp4

It's great to see auto linking is back - is there any chance we can get automatic insertion of images from links? It used to be a feature of the last editor, and the process now to insert an external hotlinked image is a little convoluted (insert an uploaded image from the gallery first, then change the URL). Being able to paste the link right in would help.

@imlwhite

Sorry, got a bit behind in keeping up with additions.

Thanks @imlwhite, @thegatesdev, @Hallsie, @3ma-TSI, @dallyger for reporting this. All added to the list to address.

@dallyger In regards to saving, I've noticed this too sometimes during testing but never been able to nail down replication. I'll have a full review of the saving mechanics.

@imlwhite I wasn't even aware that was a feature! I've added to to the list, but I may come up with an alternative middle ground, to make using external links easier, but without the auto-convert, just to avoid users being potentially misled thinking that the image is somehow uploaded safely into BookStack (like it would be for pasting actual image data/files).

@LeeWhite187

@LeeWhite187 That is not a feature we specifically support. Feel free to request it via a new feature request issue. I'm going to hide your comment though since it's not relevant to this specific thread.

Thank you everyone for the feedback so far! Your testing has been super useful since otherwise I'm kinda on my own attempting to find issues and have limited insight into how stable folks are finding things.

As of the next feature release I'm moving on the editor to beta status, and also starting a new fresh thread for this phase in #5631. Therefore I'm going to now close this off.

Please provide future feedback via #5631.

Navigation Menu

Repository navigation

New WYSIWYG Editor: Share feedback & issues here #5245

Known Issues

Related PRs

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

New WYSIWYG Editor: Share feedback & issues here #5245

Description

Known Issues

Related PRs

Activity

AvrumFeldman commented on Oct 7, 2024

ssddanbrown commented on Oct 7, 2024

koen-divtag commented on Oct 9, 2024

thegatesdev commented on Oct 10, 2024

miracuruzrh commented on Oct 12, 2024

ssddanbrown commented on Oct 13, 2024

thegatesdev commented on Oct 14, 2024

miracuruzrh commented on Oct 15, 2024

beanaroo commented on Nov 10, 2024

ttepatti commented on Nov 14, 2024

ssddanbrown commented on Nov 15, 2024

dallyger commented on Jan 10, 2025

dallyger commented on Jan 10, 2025

3ma-TSI commented on Jan 27, 2025

Hallsie commented on Mar 13, 2025

Hallsie commented on Mar 13, 2025

thegatesdev commented on Mar 14, 2025

thegatesdev commented on Mar 14, 2025

imlwhite commented on Mar 26, 2025

ssddanbrown commented on Mar 26, 2025

LeeWhite187 commented on May 11, 2025

ssddanbrown commented on May 16, 2025

ssddanbrown commented on May 28, 2025

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions