fix issue #3432756: Splitting the links in two

antistatique · Jun 10, 2024 · ca4c86e · ca4c86e
1 parent ae2ee5b
commit ca4c86e
Show file tree

Hide file tree

Showing 3 changed files with 50 additions and 6 deletions.
diff --git a/js/build/nbsp.js b/js/build/nbsp.js
diff --git a/js/ckeditor5_plugins/nbsp/src/nbspCommand.js b/js/ckeditor5_plugins/nbsp/src/nbspCommand.js
@@ -2,12 +2,19 @@ import { Command } from "ckeditor5/src/core";
 
 export default class NbspCommand extends Command {
   execute() {
+    const editor = this.editor;
+    const selection = editor.model.document.selection;
+
     // Insert tag in the current selection location.
-    this.editor.model.change((writer) => {
-      const nbspElement = "<nbsp>&nbsp;</nbsp>";
-      const nbspViewFragment = this.editor.data.processor.toView(nbspElement);
-      const nbspModelFragment = this.editor.data.toModel(nbspViewFragment);
-      this.editor.model.insertContent(nbspModelFragment);
+    editor.model.change((writer) => {
+
+      // Create a <nbsp> element with all the selection attributes.
+      const placeholder = writer.createElement( 'nbsp', {
+        ...Object.fromEntries(selection.getAttributes()),
+      } );
+
+      // Insert it into the document. Put the selection on the inserted element.
+      editor.model.insertObject( placeholder, null, null, { setSelection: 'on' } );
     });
   }
 }
diff --git a/tests/src/FunctionalJavascript/DrupalCKEditor5NbspTest.php b/tests/src/FunctionalJavascript/DrupalCKEditor5NbspTest.php
@@ -199,4 +199,41 @@ public function testNbspInsideLinkTag() {
     $this->assertEquals("dolore sit", $link[0]->textContent);
   }
 
+  /**
+   * Tests using Drupal Nbsp button to add non-breaking space into Link via Btn.
+   *
+   * @group kevin
+   */
+  public function testNbspInsideLinkTagWithButton() {
+    $this->drupalGet('node/add/page');
+    $this->waitForEditor();
+    $assert_session = $this->assertSession();
+    $editor = $assert_session->waitForElementVisible('css', '.ck-editor__editable', 1000);
+
+    // Emulate the user typing a link element.
+    $this->pressEditorButton('Source');
+    $source_text_area = $assert_session->waitForElement('css', '.ck-source-editing-area textarea');
+    $source_text_area->setValue('lorem ipsum <a href="https://www.google.ch">dolore<em>sit</em>dolo</a> amet.');
+
+    // Click source again to make source inactive and have the Schema refreshed.
+    $this->pressEditorButton('Source');
+
+    $link_element = $assert_session->waitForElement('css', '.ck-editor__editable a');
+    $em_inside_link_element = $assert_session->waitForElement('css', '.ck-editor__editable a em');
+    $this->selectTextInsideElement('.ck-editor__editable a em');
+    $this->pressEditorButton('Insert non-breaking space');
+
+    $this->assertNotEmpty($assert_session->waitForElement('css', '.ck-editor__editable a em > nbsp'));
+    $this->assertEquals('<p>lorem ipsum <a href="https://www.google.ch" class="ck-link_selected">dolore<em><nbsp><br data-cke-filler="true"></nbsp></em>dolo</a> amet.</p>', $editor->getHtml());
+
+    // The link should be left intact and we should have 1 NBSP element inside.
+    $xpath = new \DOMXPath($this->getEditorDataAsDom());
+    $nbsp = $xpath->query('//nbsp');
+    $this->assertCount(1, $nbsp);
+    $this->assertEquals(" ", $nbsp[0]->firstChild->nodeValue);
+    $link = $xpath->query('//a');
+    $this->assertCount(1, $link);
+    $this->assertEquals("dolore dolo", $link[0]->textContent);
+  }
+
 }