Resolve #3432756 "Splitting the links"

CHANGELOG.md

@@ -13,6 +13,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Changed
 - fix tests on Drupal 10.2+ using HTML5 filter
+- fix issue #3432756: Splitting the links in two
 
 ### Removed
 - removed translation-files - Issue #3365383

js/build/nbsp.js

-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.CKEditor5=t():(e.CKEditor5=e.CKEditor5||{},e.CKEditor5.nbsp=t())}(self,(()=>(()=>{var e={"ckeditor5/src/core.js":(e,t,r)=>{e.exports=r("dll-reference CKEditor5.dll")("./src/core.js")},"ckeditor5/src/ui.js":(e,t,r)=>{e.exports=r("dll-reference CKEditor5.dll")("./src/ui.js")},"dll-reference CKEditor5.dll":e=>{"use strict";e.exports=CKEditor5.dll}},t={};function r(s){var o=t[s];if(void 0!==o)return o.exports;var n=t[s]={exports:{}};return e[s](n,n.exports,r),n.exports}r.d=(e,t)=>{for(var s in t)r.o(t,s)&&!r.o(e,s)&&Object.defineProperty(e,s,{enumerable:!0,get:t[s]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);var s={};return(()=>{"use strict";r.d(s,{default:()=>c});var e=r("ckeditor5/src/core.js");class t extends e.Command{execute(){this.editor.model.change((e=>{const t=this.editor.data.processor.toView("<nbsp>&nbsp;</nbsp>"),r=this.editor.data.toModel(t);this.editor.model.insertContent(r)}))}}class o extends e.Plugin{_defineSchema(){this.editor.model.schema.register("nbsp",{allowWhere:"$text",isInline:!0})}_defineConverters(){this.editor.conversion.elementToElement({model:"nbsp",view:"nbsp"})}init(){const e=this.editor;this.editor.commands.add("nbsp",new t(this.editor)),this._defineSchema(),this._defineConverters(),e.keystrokes.set(["ctrl",32],((t,r)=>{e.commands.execute("nbsp"),r()}))}}var n=r("ckeditor5/src/ui.js");class i extends e.Plugin{init(){const e=this.editor;e.ui.componentFactory.add("nbsp",(t=>{const r=new n.ButtonView(t);return r.set({label:"Insert non-breaking space",icon:'<svg width="32" height="30" version="1.1" viewBox="0 0 8.4667 7.9375" xmlns="http://www.w3.org/2000/svg">\n<g transform="translate(-39.93 -130.78)" stroke-width=".26458">\n<path d="m41.256 134.75h.78859c.0011 0 .0021.00092.0021.002v2.1126c0 .001-.000922.002-.0021.002h-.78859c-.0011 0-.0021-.00092-.0021-.002v-2.1126c0-.001.000922-.002.0021-.002z"/>\n<path d="m42.048 136.07h4.2292c.0011 0 .0021.00092.0021.002v.78962c0 .001-.000922.002-.0021.002h-4.2292c-.0011 0-.0021-.00092-.0021-.002v-.78962c0-.001.000922-.002.0021-.002z"/>\n<path d="m46.282 134.75h.78962c.0011 0 .0021.00092.0021.002v2.1126c0 .001-.000922.002-.0021.002h-.78962c-.0011 0-.0021-.00092-.0021-.002v-2.1126c0-.001.000922-.002.0021-.002z"/>\n</g>\n</svg>\n',tooltip:!0}),r.on("execute",(()=>{e.model.change((t=>{e.commands.execute("nbsp")}))})),r}))}}class d extends e.Plugin{static get pluginName(){return"Nbsp"}static get requires(){return[o,i]}}const c={Nbsp:d}})(),s=s.default})()));
\ No newline at end of file
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.CKEditor5=t():(e.CKEditor5=e.CKEditor5||{},e.CKEditor5.nbsp=t())}(self,(()=>(()=>{var e={"ckeditor5/src/core.js":(e,t,s)=>{e.exports=s("dll-reference CKEditor5.dll")("./src/core.js")},"ckeditor5/src/ui.js":(e,t,s)=>{e.exports=s("dll-reference CKEditor5.dll")("./src/ui.js")},"dll-reference CKEditor5.dll":e=>{"use strict";e.exports=CKEditor5.dll}},t={};function s(r){var o=t[r];if(void 0!==o)return o.exports;var n=t[r]={exports:{}};return e[r](n,n.exports,s),n.exports}s.d=(e,t)=>{for(var r in t)s.o(t,r)&&!s.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},s.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);var r={};return(()=>{"use strict";s.d(r,{default:()=>d});var e=s("ckeditor5/src/core.js");class t extends e.Command{execute(){this.editor.model.change((e=>{const t=this.editor.data.processor.toView("<nbsp>&nbsp;</nbsp>"),s=this.editor.data.toModel(t);this.editor.model.insertContent(s)}))}}class o extends e.Plugin{_defineSchema(){this.editor.model.schema.register("nbsp",{allowWhere:"$text",allowAttributesOf:"$text",isInline:!0,isObject:!0})}_defineConverters(){this.editor.conversion.elementToElement({model:"nbsp",view:"nbsp"})}init(){const e=this.editor;this.editor.commands.add("nbsp",new t(this.editor)),this._defineSchema(),this._defineConverters(),e.keystrokes.set(["ctrl",32],((t,s)=>{e.commands.execute("nbsp"),s()}))}}var n=s("ckeditor5/src/ui.js");class i extends e.Plugin{init(){const e=this.editor;e.ui.componentFactory.add("nbsp",(t=>{const s=new n.ButtonView(t);return s.set({label:"Insert non-breaking space",icon:'<svg width="32" height="30" version="1.1" viewBox="0 0 8.4667 7.9375" xmlns="http://www.w3.org/2000/svg">\n<g transform="translate(-39.93 -130.78)" stroke-width=".26458">\n<path d="m41.256 134.75h.78859c.0011 0 .0021.00092.0021.002v2.1126c0 .001-.000922.002-.0021.002h-.78859c-.0011 0-.0021-.00092-.0021-.002v-2.1126c0-.001.000922-.002.0021-.002z"/>\n<path d="m42.048 136.07h4.2292c.0011 0 .0021.00092.0021.002v.78962c0 .001-.000922.002-.0021.002h-4.2292c-.0011 0-.0021-.00092-.0021-.002v-.78962c0-.001.000922-.002.0021-.002z"/>\n<path d="m46.282 134.75h.78962c.0011 0 .0021.00092.0021.002v2.1126c0 .001-.000922.002-.0021.002h-.78962c-.0011 0-.0021-.00092-.0021-.002v-2.1126c0-.001.000922-.002.0021-.002z"/>\n</g>\n</svg>\n',tooltip:!0}),s.on("execute",(()=>{e.model.change((t=>{e.commands.execute("nbsp")}))})),s}))}}class c extends e.Plugin{static get pluginName(){return"Nbsp"}static get requires(){return[o,i]}}const d={Nbsp:c}})(),r=r.default})()));
\ No newline at end of file

js/ckeditor5_plugins/nbsp/src/nbspEditing.js

@@ -11,7 +11,9 @@ export default class NbspEditing extends Plugin {
     const schema = this.editor.model.schema;
     schema.register("nbsp", {
       allowWhere: "$text",
+      allowAttributesOf: "$text",
       isInline: true,
+      isObject: true,
     });
   }
 

tests/src/FunctionalJavascript/DrupalCKEditor5NbspTest.php

@@ -83,6 +83,7 @@ class DrupalCKEditor5NbspTest extends WebDriverTestBase {
       'toolbar' => [
         'items' => [
           'sourceEditing',
+          'link',
           'bold',
           'italic',
           'nbsp',
@@ -170,4 +171,32 @@ class DrupalCKEditor5NbspTest extends WebDriverTestBase {
     $this->assertEquals(" ", $nbsp->firstChild->nodeValue);
   }
 
+  /**
+   * Tests using Drupal Nbsp button to add non-breaking space into Link.
+   */
+  public function testNbspInsideLinkTag() {
+    $this->drupalGet('node/add/page');
+    $this->waitForEditor();
+    $assert_session = $this->assertSession();
+    $assert_session->waitForElementVisible('css', '.ck-editor__editable', 1000);
+
+    // Emulate the user typing a link and adding an NBSP element inside.
+    $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<nbsp>&npbs;</nbsp>sit</a> amet.');
+
+    // Click source again to make source inactive and have the Schema refreshed.
+    $this->pressEditorButton('Source');
+
+    // 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 sit", $link[0]->textContent);
+  }
+
 }