Content of book lost, when switching to new WYSIWYG editor

Describe the Bug

Hi

I encountered a bug with a particular book.
When I switch from the old WYSIWYG editor to the new WYSIWYG editor, then the complete content is gone, and a blank page is presented. Fortunately, the content is not lost. I can click on "Delete draft", go back and then the content is available again.

This issue ocourred only in one particular book so far.

Here is the error, which is visible in devtools -> console:

wysiwyg.js?version=v24.12:12 Error: Internal Lexical error: invariant() is meant to be replaced at compile time. There is no runtime version. Error: Expected node %s to have a parent.
    at x (wysiwyg.js?version=v24.12:4:591)
    at Eo.getParentOrThrow (wysiwyg.js?version=v24.12:6:5367)
    at Eo.insertBefore (wysiwyg.js?version=v24.12:6:10148)
    at $N (wysiwyg.js?version=v24.12:12:54218)
    at Di (wysiwyg.js?version=v24.12:12:51994)
    at _o (wysiwyg.js?version=v24.12:14:11452)
    at wysiwyg.js?version=v24.12:16:65925
    at jd (wysiwyg.js?version=v24.12:12:24836)
    at xe (wysiwyg.js?version=v24.12:12:25794)
    at po.update (wysiwyg.js?version=v24.12:12:43951)
jd @ wysiwyg.js?version=v24.12:12
xe @ wysiwyg.js?version=v24.12:12
update @ wysiwyg.js?version=v24.12:12
Zn @ wysiwyg.js?version=v24.12:16
Z$ @ wysiwyg.js?version=v24.12:20
(anonymous) @ app.js?version=v24.12:22
Promise.then
setup @ app.js?version=v24.12:22
initComponent @ app.js?version=v24.12:22
init @ app.js?version=v24.12:22
(anonymous) @ app.js?version=v24.12:22

Steps to Reproduce

Open a Book, which is in the old WYSIWYG format
Click on "Edit" (or press 'e')
Click on "Draft Options"
Select "Switch to new WYSIWYG (in alpha testing)
Confirm the Dialogue box with button Continue
"Are you sure you want to change the editor for this page?
Consider the following when changing editors:"
Confirm Browser Message "Leave website?"
End -> Blank page visible and error message in "Devtools -> Console" is visible

Expected Behaviour

The content should not be lost when switching to the new editor.

Screenshots or Additional Context

Bookstack.mp4

Browser Details

Brave Browser

Exact BookStack Version

BookStack v24.12

@miracuruzrh

Thanks @miracuruzrh,
If you're also able to share the source of the page content (via old WYSIWYG editor, source button towards the top-right of the editor toolbar) that would also be very helpful for replicating the exact cause here.

@ssddanbrown

Dear @ssddanbrown

This is the source for the page in question. Hopefully, it helps.
Please let me know, If I can assist with further details.

<h2 id="bkmrk-git-befehle">Git Befehle</h2>
<table id="bkmrk-aktion-befehl-bemerk">
<thead>
<tr>
<th>Aktion</th>
<th>Befehl</th>
<th>Bemerkung</th>
</tr>
</thead>
<tbody>
<tr>
<td>List Remote</td>
<td>`git branch`</td>
<td>-</td>
</tr>
<tr>
<td>List Remote Branch</td>
<td>`git branch -r`</td>
<td>-</td>
</tr>
<tr>
<td>Branches auflisten</td>
<td>`git branch -v -a`</td>
<td>Verbose und All</td>
</tr>
<tr>
<td>Neuen Branch anlegen</td>
<td>`git checkout -b `</td>
<td>-</td>
</tr>
<tr>
<td>Branch wechseln</td>
<td>`git checkout main`</td>
<td>Wenn es den Branch bereits lokal gibt</td>
</tr>
<tr>
<td>Branch wechseln</td>
<td>`git checkout -t origin/main`</td>
<td>Wenn es den Branch lokal noch nicht gibt</td>
</tr>
<tr>
<td>Branch wechseln</td>
<td>`git switch main`</td>
<td>-</td>
</tr>
<tr>
<td>Alle Updates holen</td>
<td>`git fetch --all`</td>
<td>-</td>
</tr>
<tr>
<td>Branch aktualisieren</td>
<td>`git pull`</td>
<td>-</td>
</tr>
<tr>
<td>Branch aktualisieren</td>
<td>`git pull --all`</td>
<td>-</td>
</tr>
<tr>
<td>Lokalen Branch l&ouml;schen</td>
<td>`git branch --delete old-branch`</td>
<td>-</td>
</tr>
<tr>
<td>Bereinigt lokal das Repo</td>
<td>`git fetch --prune origin`</td>
<td>-</td>
</tr>
</tbody>
</table>
<h2 id="bkmrk-%C2%A0"></h2>
<h2 id="bkmrk-git-konfigurieren">Git konfigurieren</h2>
<h5 id="bkmrk-globale-einstellunge">Globale Einstellungen anpassen</h5>
<pre id="bkmrk-git-config---global-"><code class="language-bash">git config --global --edit</code></pre>
<pre id="bkmrk-%23-das-ist-gits-benut"><code class="language-ini"># Das ist Gits benutzerspezifische Konfigurationsdatei.
[user]
        name = Simon Boonstra
        email = redacted@redacted.ch
[push]
        autoSetupRemote = true
[branch]
        autosetuprebase = always
[color]
        ui = true
        status = auto
        branch = auto
[core]
        editor = nano
[credential]
        helper = store</code></pre>
<h5 id="bkmrk-ssh-key-f%C3%BCr-gitlab-e">SSH Key f&uuml;r Gitlab einrichten</h5>
<ul id="bkmrk-auf-der-gitlab-homep">
<li class="null">Auf der Gitlab homepage
<ul>
<li class="null"><a href="https://gitlab.com/-/profile/keys">Gitlab</a> &ouml;ffnen und Neuen SSH Key anlegen klicken.</li>
<li>1Password &ouml;ffnen und ein neues SSH-Keypair anlegen.</li>
<li>Public Key von 1Password kopieren und auf der Gitlab Seite im Feld "Key" einf&uuml;gen.</li>
</ul>
</li>
<li>Lokaler Rechner: 1Passord &ouml;ffnen und den Private Key exportieren.
<ul id="bkmrk-speicherort%C2%A0-windows">
<li>Private Key einf&uuml;gen
<ul id="bkmrk-windows%3A-c%3A%5C%25userpro">
<li>Windows: <code>c:\%userprofile%\.ssh</code></li>
<li>Auf der Ansible Maschine: <code>cat ~/.ssh/id_ed25519_Gitlab</code></li>
<li>Linux: <code>nano ~/.ssh/id_ed25519_Gitlab</code><br></li>
</ul>
</li>
<li>Dateirechte anpassen
<ul id="bkmrk-chmod-600-%7E%2F.ssh%2Fid_">
<li><code>chmod 600 ~/.ssh/id_ed25519_Gitlab</code></li>
</ul>
</li>
</ul>
</li>
<li>Eintrag f&uuml;r die Git Konfiguration erstellen in
<ul id="bkmrk-window%3A-c%3A%5C%25userprof">
<li>Windows: <code>c:\%userprofile%\.ssh\config</code></li>
<li>Linux:&nbsp;<code>nano ~/.ssh/config</code>
<ul id="bkmrk-%23-gitlab.com-host-gi">
<li>
<pre><code class="language-ini"># GitLab.com
Host gitlab.com
  PreferredAuthentications publickey
  IdentityFile ~/.ssh/id_ed25519_Gitlab</code></pre>
</li>
</ul>
</li>
</ul>
</li>
<li>SSH Key testen
<ul id="bkmrk-ssh--t-git%40gitlab.co">
<li><code>ssh -T git@gitlab.com</code></li>
</ul>
</li>
</ul>
<h5 id="bkmrk-ssh-key-testen">SSH Key testen</h5>
<p id="bkmrk-verbindung-testen-mi">Verbindung testen mit Befehl:<br><code>ssh -T <a href="mailto:git@gitlab.com">git@gitlab.com</a></code>.</p>
<p id="bkmrk-bei-erfolg-erscheint" class="callout success">Bei Erfolg erscheint die Meldung: Welcome to GitLab, @MiracuruZRH!</p>
<pre id="bkmrk-%E2%95%AD%E2%94%80simon-at-klipper-i"><code class="language-bash">╭─simon at Klipper in ~/.ssh
╰─○ ssh -T git@gitlab.com
Welcome to GitLab, @MiracuruZRH!</code></pre>
<h3 id="bkmrk-datei-in-einem-alten"></h3>
<h2 id="bkmrk-branch-erstellen-und">Branch erstellen und wechseln</h2>
<p id="bkmrk-neuer-branch-mit-2in">Neuer Branch mit <em>2in1</em> Befehl<br></p>
<pre class="highlight" id="bkmrk-git-checkout--b-iss5"><code class="language-bash">git checkout -b iss53
# Switched to a new branch "iss53"</code></pre>
<p id="bkmrk-neuer-branch-mit-zwe">Neuer Branch mit zwei einzelnen Befehlen</p>
<pre class="highlight" id="bkmrk-git-branch-iss53-git"><code class="language-bash">git branch iss53
git checkout iss53</code></pre>
<h2 id="bkmrk-weitere-befehle">Weitere Befehle</h2>
<p id="bkmrk-start-by-fetching-th">Start by fetching the latest remote changes</p>
<pre id="bkmrk-git-fetch-origin"><code class="language-bash">git fetch origin</code></pre>
<p id="bkmrk-fetch-all-of-the-ava">Fetch all of the available remote branches</p>
<pre id="bkmrk-git-branch--v--a"><code class="language-bash">git branch -v -a</code></pre>
<p id="bkmrk-branch-wechseln--c-e">Branch wechseln <code>-c</code> erstellt einen neuen lokalen Branch</p>
<pre id="bkmrk-git-switch--c-test-o"><code class="language-bash">git switch -c test origin/test</code></pre>
<p id="bkmrk-for-more-information">For more information about using git switch:</p>
<pre id="bkmrk-%24-man-git-switch"><code class="language-bash">$ man git-switch</code></pre>
<p id="bkmrk-prune-kann-auch-perm">Prune kann auch permanent aktiviert werden. Wird dann mit jedem Fetch ausgef&uuml;hrt</p>
<pre id="bkmrk-git-config---global--1"><code class="language-bash">git config --global fetch.prune true</code></pre>
<h3 id="bkmrk-hard-reset">Hard reset</h3>
<pre id="bkmrk-git-reset---hard"><code class="language-bash">git reset --hard</code></pre>
<p id="bkmrk-"></p>
<h3 id="bkmrk-datei-in-einem-alten-1">Datei in einem alten Commit &auml;ndern</h3>
<p id="bkmrk-https%3A%2F%2Fwww.youtube."><a href="https://www.youtube.com/watch?v=zb5TXz2dHbU">https://www.youtube.com/watch?v=zb5TXz2dHbU</a></p>
<p id="bkmrk-interaktiv-modusnur-">Interaktiv Modus<br>Nur bei einem Branch anwenden. Nicht an zwei.</p>

@miracuruzrh

Thanks @miracuruzrh, that helps a lot.
I've now added this to the megathread for new editor bugs (#5245), therefore I'll close this off.

Reduced replication case

<ul id="bkmrk-%23-gitlab.com-host-gi">
<li>
<pre><code class="language-ini">Code</code></pre>
</li>
</ul>

Also got a similar bug, can't tell if its the same:

What I've seen it's the image caused som infinite code and if I remove it the page becomes functional again.

Navigation Menu

Repository navigation

Content of book lost, when switching to new WYSIWYG editor #5378

Describe the Bug

Steps to Reproduce

Expected Behaviour

Screenshots or Additional Context

Browser Details

Exact BookStack Version

Reduced replication case

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Content of book lost, when switching to new WYSIWYG editor #5378

Description

Describe the Bug

Steps to Reproduce

Expected Behaviour

Screenshots or Additional Context

Browser Details

Exact BookStack Version

Activity

ssddanbrown commented on Dec 31, 2024

miracuruzrh commented on Jan 7, 2025

ssddanbrown commented on Jan 15, 2025

Reduced replication case

YamiGhor commented on Feb 18, 2025

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions