Start a 3.0.x branch for CKEditor Anchor Link for semantic versioning and better integration with Drupal 10, CKEditor 5, and LinkIt

Created on 31 March 2021, about 3 years ago
Updated 9 February 2024, 4 months ago

Problem/Motivation

  • Semantic versioning
  • Better integration with Drupal 10 core link in the CKEditor 5
  • Better integration with third party modules like LinkIt

Only to have the Flag Anchor button with
- CKEditor 5 anchor

"@ckeditor/ckeditor5-anchor": "bvedad/ckeditor5-anchor",

https://github.com/bvedad/ckeditor5-anchor

It would be grate to have the output sample module be pushed to be part of the CKEditor library in Drupal core

Proposed resolution

Remaining tasks

  • ✅ File an issue
  • ➖ Addition/Change/Update/Fix
  • ➖ Testing to ensure no regression
  • ➖ Automated unit testing coverage
  • ➖ Automated functional testing coverage
  • ➖ UX/UI designer responsibilities
  • ➖ Readability
  • ➖ Accessibility
  • ➖ Performance
  • ➖ Security
  • ➖ Documentation
  • ➖ Code review by maintainers
  • ➖ Full testing and approval
  • ➖ Credit contributors
  • ➖ Review with the product owner
  • ➖ Release notes snippet
  • ❌ Release

API changes

  • N/A

Data model changes

  • N/A

Release notes snippet

  • N/A
📌 Task
Status

Fixed

Version

3.0

Component

Code

Created by

🇯🇴Jordan Rajab Natshah Jordan

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

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

  • 🇺🇸United States SamLerner

    @Rajab where can I find the 3.0.x branch? I'd love to help get anchor_link working with CKE5 until it can be part of core. Let me know where and how I can assist.

  • 🇧🇪Belgium Jelle_S Antwerp, Belgium

    RE #18 @Wim is there a core issue for this somewhere, are there any concrete plans?

  • 🇨🇦Canada Dylan Donkersgoed London, Ontario

    Dylan Donkersgoed made their first commit to this issue’s fork.

  • @dylan-donkersgoed opened merge request.
  • 🇨🇦Canada Dylan Donkersgoed London, Ontario

    The plugin linked in the issue description seems to at least partially work for me outside Drupal. I'm looking into integrating it with Drupal and probably fixing some issues with it now.

  • 🇳🇱Netherlands BryanDeNijs

    #32: That would be absolutely great, Dylan! Many thanks for your effort!

  • 🇯🇴Jordan Rajab Natshah Jordan

    Thank you, Dylan, for the MR on this issue.

    Seeking co-maintainer(s) for the 3.0.x branch.
    I'm having a tight time following on this, Following up on upgrades to Drupal 10 on over 250 modules for our product and projects.

    Dylan, Would you like to help maintaining the 3.0.x, you will be able to commit and release directly.

    Hoping that your work may end up in Drupal Core

  • 🇨🇦Canada Dylan Donkersgoed London, Ontario

    Sure. I can't make any definite committment regarding ongoing maintenance but I know we use this module for many sites so we do have an interest in making sure it keeps working.

    This also probably could be merged into the 2.0.x branch eventually - CKE5 and CKE4 support are not mutually exclusive.

    As to the MR itself the basic functionality of this for editing anchor links seems to be working and we've deployed it to a site for an initial D10 upgrade. This upgrade is curently being tested and not yet live. The MR does not provide the link/unlink plugins the module does for CKE4, and may not have 100% feature parity with what the old link plugin does since it's using a brand new CKE5 plugin. I did not write either the CKE5 or CKE5 plugin (just the Drupal integration and some necessary tweaks for new APIs/Drupal compatibility for the CKE5 one) but at a glance I think the CKE4 plugin does some things the CKE5 plugin does not. I'm not sure how much of that is still necessary. I'll likely update this issue and possibly the MR as we do further testing/revisions.

  • 🇯🇴Jordan Rajab Natshah Jordan

    Thank you, Dylan for helping :)

    Lets keep 3.0.x minimum to the "Anchor" to follow with #18
    Hoping to have it in Core CKEditor 5 out of the box.
    We need help on maintenance, you do not know maybe, the Drupal core team may step in for this.

    Do any change you feel is it better for the 8.x-2.x branch.

    8.x-2.x and 3.0.x are yours.

    Thanks for stepping in. Cheers.

  • Issue was unassigned.
  • 🇧🇪Belgium leanderjcc Ghent

    Hi, I tried out the merge from Dylan and was able to get this to work with the following steps:

    1. Composer require drupal/anchor_link:^3
    2. Add a patch for the MR (https://git.drupalcode.org/project/anchor_link/-/merge_requests/5.patch)
    3. The repository did not seem to automatically added for me so I manually added the following snippet to the repositories section in my composer.json
      {
            "type": "package",
            "package": {
              "name": "northernco/ckeditor5-anchor-drupal",
              "version": "0.1.0.",
              "type": "drupal-library",
              "dist": {
                "url": "https://registry.npmjs.org/@northernco/ckeditor5-anchor-drupal/-/ckeditor5-anchor-drupal-0.1.0.tgz",
                "type": "tar"
              }
            }
          }

      After this I required the library northernco/ckeditor5-anchor-drupal

    4. I tried enabling the module but was getting an error that the fakeobject package was required. Since I'm not interested in the CKE4 functionality I removed the dependency fakeobject:fakeobject in anchor_link.info.yml with a patch. After the patch was applied I had no problem enabling the module
    5. Now all left to do was add the anchor link button in my text editor.
    6. After adding the button I could use it in my WYSIWYG editors to add an anchor link and via the link functionality I could link to it by using the anchor name with the # in front.
  • I can confirm this, thank you, Leander! With your steps, I was able to get anchor_link to work successfully in CKEditor5.

  • 🇱🇻Latvia artis.bajars

    One thing that neither the bvedad/ckeditor5-anchor nor the forked northernco/ckeditor5-anchor-drupal libraries currently support is empty anchor link elements in the form of <a id="myAnchor" name="myAnchor"></a>. Our editors have created most of the anchor links like this and upgrading to the CKEditor5 version of anchor_link in this form would make them uneditable.

    Previously this was supported by Fakeobjects I guess, but since there is no equivalent for CKEditor5 what are our options here?

  • Same issue as #40 📌 Start a 3.0.x branch for CKEditor Anchor Link for semantic versioning and better integration with Drupal 10, CKEditor 5, and LinkIt Fixed . Without empty anchor link support, even switching to source editing shows the anchor markup being completely removed, so they can't even be fixed manually. Editing any existing text and saving removes the empty anchors completely.

  • 🇺🇸United States dwisnousky

    agh same as #40 and #41... I followed the steps in #39 - thank you for your help getting this far at least? I'm adding the patch mentioned in #39 that requires removing fakeobject

  • Status changed to Needs work about 1 year ago
  • 🇨🇦Canada Dylan Donkersgoed London, Ontario

    I'm looking into making empty anchor links work without fakeobjects now.

  • 🇬🇧United Kingdom sergiur London, UK

    Thanks all for your work on this! I got it working on my project and it's very close. I notice if I add an empty space character and select the space, I can add an anchor as it uses &nbsp; as the content. Doesn't help with editing existing ones created without any content, but at least there's a way to achieve the same thing

  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update about 1 year ago
    Waiting for branch to pass
  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update about 1 year ago
    Waiting for branch to pass
  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update about 1 year ago
    Waiting for branch to pass
  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update about 1 year ago
    Waiting for branch to pass
  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update about 1 year ago
    Waiting for branch to pass
  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update about 1 year ago
    Waiting for branch to pass
  • Status changed to Needs review about 1 year ago
  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update about 1 year ago
    Waiting for branch to pass
  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update about 1 year ago
    Waiting for branch to pass
  • 🇨🇦Canada Dylan Donkersgoed London, Ontario

    I've pushed an update to the npm package and to this branch that adds limited support for empty anchors. The package has been reworked to build as a DLL similar to what the codemirror module/package does. This has an important side-effect for sites that already installed the branch: the names of the module and of built JS file have changed slightly!. If you manually installed the library before rather than using composer merge you will need to manually update that when pulling the latest version of the branch! You can refer to the composer.libraries.json file for an example, or just use composer-merge to include it.

    The empty anchor link functionality doesn't work quite the same (or quite as well) as it did in D7. Notably you can't select empty anchor links once they're placed, so if you want to edit them you have to backspace and re-add them. They also display differently - some text with the ID of the link is displayed rather than an icon. Non-empty anchor links work as they did before.

    I don't currently plan on working to make this work more like the CKE4 version. However, it would be better if it was at least possible to select and edit those anchor links rather than backspacing and re-adding them. I would probably accept an MR that fixes that on the plugin on GitHub.

  • 🇪🇸Spain budalokko Girona

    Just tested your recent commits on the MR and the plugin on GitHub and it worked for me. Thank you !!

    Will let others test the "empty anchors" functionality.

    So now, to include the required npm package into composer there is a slight version change, right?

    {
          "type": "package",
          "package": {
            "name": "northernco/ckeditor5-anchor-drupal",
            "version": "0.2.0.",
            "type": "drupal-library",
            "dist": {
              "url": "https://registry.npmjs.org/@northernco/ckeditor5-anchor-drupal/-/ckeditor5-anchor-drupal-0.2.0.tgz",
              "type": "tar"
            }
          }
        }

    And then

    composer require northernco/ckeditor5-anchor-drupal

  • 🇨🇦Canada Dylan Donkersgoed London, Ontario

    If you're using wikimedia's composer merge plugin you shouldn't need to manually change the JSON (should probably add something about that to the README) but if you have that set in your composer.json that's correct.

  • 🇪🇸Spain budalokko Girona

    Found a small issue. This is the code in CKEditor:

    <a class="ck-anchor" id="a-name" name="a-name">an anchor</a>

    but this is the final code when viewing the node:

    <a id="a-name">an anchor</a>

    class and name have been stripped out!

    Adding the following to the "elements" section in anchor_link.ckeditor5.yml solves the issue:
    elements:
    -
    -

    Do you prefer I create a new issue with the patch for it? Not sure if "name" is actually required as only with "id" anchors seem to work.

  • 🇺🇸United States Luke.Leber Pennsylvania

    The MR seems to work against 9.5.x 👍.

    My only review note is that it seems like the library referenced from composer.libraries.json has been specially crafted for Drupal consumption -- which might be better managed within the module itself and not externally hosted. Thoughts?

  • 🇧🇪Belgium leanderjcc Ghent

    We are noticing some unexpected behaviour with the module.

    When we have the link and anchor functionality enabled on our WYSIWYG and we add for example 'https://www.google.be/' in the text it will automatically see this as a link, but also as an anchor. I would expected it to make it a link, but not the anchor. Same goes for other links such as an email address.

    This was the case for both version 0.1.0 and 0.2.0 of the plugin.

    Also since 0.2.0 we see that some styling has been enabled that doesn't fit very well imo (see screenshot '0.2.0-anchor-style'). I'm using gin dark-theme where it does not make text very readable. In gin light-theme it is better, but I believe theming should be added as little as possible to the library.

    A little cleaner proposal I would make instead of the current styling is adding something like a dashed line (see screenshot 'proposed-anchor-style'). This is something that we used with the 0.1.0 functionality to differentiate anchor links from normal links. In our case, the client was happy with the look.

    We used the following CSS for this:

    .ck a[id] {
      text-decoration: underline dashed;
      text-underline-offset: 0.3em;
    }

    Also +1 for the proposal on #49 for adding the library to the module.

  • 🇦🇺Australia fenstrat Australia

    Initial testing of the MR with the changes from #45 seems to be working well.

    It's not clear why we're keeping the dependency on fakeobjects. But as that is staying (for now at least) then in order to uninstall ckeditor (i.e. version 4 from contrib) you'll need 📌 Remove dependency on ckeditor as fakeobjects can also be used with ckeditor5 RTBC .

  • 🇦🇺Australia fenstrat Australia

    Whups, didn't mean to change the issue summary.

  • First commit to issue fork.
  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update about 1 year ago
    Waiting for branch to pass
  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update about 1 year ago
    Waiting for branch to pass
  • 🇧🇪Belgium cgoffin

    I added the remark from @budalokko ( https://www.drupal.org/project/anchor_link/issues/3206676#comment-15023554 📌 Start a 3.0.x branch for CKEditor Anchor Link for semantic versioning and better integration with Drupal 10, CKEditor 5, and LinkIt Fixed ) to the merge request.

    Here also a patch of the MR.

  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update about 1 year ago
    Waiting for branch to pass
  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update about 1 year ago
    Waiting for branch to pass
  • 🇧🇪Belgium cgoffin

    Fixed the icon in the backend when configuring the anchor onto the editor.

  • 🇺🇸United States seattlehimay

    Comment only for anyone else wanting to use this now. Works great for me, and I thank all those involved.

    require the 3.0.x-dev version with composer,
    patch it,
    dl the library https://registry.npmjs.org/@northernco/ckeditor5-anchor-drupal/-/ckedito...
    extract in your /libraries directory.
    rename the extracted directory to ckeditor5-anchor-drupal
    clear caches
    add the flag icon to your editor /admin/config/content/formats

    Thank you again!

    (I *thought* the patch would install the needed library, but my order of operations was weird, so I may have caused that extra step.)

  • 🇺🇸United States kenrbnsn New Jersey

    I just applied the patch and the library did NOT get downloaded. The file composer.libraries.json did get created, but it's not being invoked.

  • 🇬🇧United Kingdom sergiur London, UK

    It does download correctly for me. You need to require
    wikimedia/composer-merge-plugin then add the path to the composer.libraries.json file in the extra section, under “merge-plugin”. See instructions here https://github.com/wikimedia/composer-merge-plugin#usage

  • 🇺🇸United States kenrbnsn New Jersey

    Thanks, but now when I try to enable the anchor_link module, I get this error:

    $ ddev drush en anchor_link
    [error] Unable to install module 'fakeobjects' due to unmet requirement(s):
    - Before you can use the FakeObjects module, you need to download the plugin from ckeditor.com and place it in /libraries/fakeobjects. Check the README.txt for more information. Get the plugin here. (Currently using FakeObjects version Plugin not detected)

    Shouldn't this be installed automatically too?

  • Status changed to Needs work about 1 year ago
  • 🇳🇿New Zealand RoSk0 Wellington

    I believe name should be removed from the scope completely - it's deprecated according to MDN https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#deprecated_a... and is not part of the the HTML specification https://html.spec.whatwg.org/multipage/text-level-semantics.html#the-a-e... .

  • 🇮🇳India mohit_aghera Rajkot

    Sharing my finding here.

    Steps mentioned in #56 worked for me.
    I'm using the patch in #55
    Also, I am using 0.2.0 version of the `@northernco/ckeditor5-anchor-drupal` library.

    I've noticed another issue when I tried to edit the anchor link.
    After creating first time, you can't edit the anchor link as the popup to edit the anchor link doesn't open.
    I don't see any errors in console either.

  • 🇺🇸United States loopy1492

    Unfortunately, it also looks like fakeobjects isn't even started with their CKEditor 5 conversion. Is this module actually necessary?

    https://www.drupal.org/project/fakeobjects/issues/3262037 📌 Plan what's needed for ckeditor 5 in Drupal 9.3+ / Drupal 10 Active

  • Fake Objects lists Page Break as another module that depended on it. It looks like the 3.x branch found a way to go without Fake Objects.

  • 🇺🇸United States loopy1492

    Yeah. The recommended action from CK is to switch to "Custom Widgets" which just SOUNDS like a lot of work. I wonder how necessary the fake links are to this project. I'm worried it's not just a visual thing, but something that's transforming them so they are/aren't clickable in the editor or something. I only have speculation at this pont.

  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update 12 months ago
    Waiting for branch to pass
  • @loopy1492 opened merge request.
  • 🇺🇸United States loopy1492

    I created a new branch in gitlab which removes all references and dependencies for fakeobjects. The js code is still really full of references to "ck-fake-anchor" and "FakeVisualSelection" and whatnot. I am dubious about pulling at the strings of this myself at the moment. However, the anchor link widget DOES work on Chrome right now using this branch, and it doesn't try pulling in old ckeditor or fakeobjects.

  • 🇨🇦Canada Dylan Donkersgoed London, Ontario

    @loopy1492 Please feel free to bring that into my branch. I was originally thinking we could keep it to retain CKE4 support but it probably does make more sense to just have a 3.0.x branch that supports only CKE5 and doesn't bring in the CKE4 dependencies.

    As for the other issue with empty anchor links not being editable on click I fixed something similar for Footnotes, leaving it here in case someone else wants to apply a similar fix or for if/when I get around to it: https://git.drupalcode.org/project/footnotes/-/merge_requests/4/diffs?co...

  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update 11 months ago
    Waiting for branch to pass
  • 🇺🇸United States loopy1492

    Right on. I've merged my branch into yours. Posting a new patch now for people to use, though they will still need to pin the 3206676-start-a-3.0.x branch in order to disable the ckedior 4 module.

  • 🇳🇿New Zealand siramsay

    The latest @dev version "drupal/anchor_link": "3.0.x-dev@dev" / drupal/anchor_link dev-3.0.x 6938068 doesn't include the fake object removal patch so you get unable to install CKEditor 4 in the UI and drush.

    If you use the patch from the following branch you can uninstall fake objects and therefore CKEditor 4 https://git.drupalcode.org/issue/anchor_link-3206676/-/commit/c91ee92c4e...
    - https://git.drupalcode.org/issue/anchor_link-3206676/-/commit/c91ee92c4e...

    Would be good to get this merged into the dev branch.

    The instructions at #56 otherwise worked for me.

  • 🇳🇿New Zealand siramsay

    Follow up on my above comment about Fake Objects.

    You are able to uninstall the module from the UI/drush but when you come to composer remove you get the below because composer is checking drupal packages remotely.

    Removal failed, drupal/fakeobjects is still present, it may be required by another package. See `composer why drupal/fakeobjects`.
    
    $ composer why drupal/fakeobjects
    drupal/anchor_link 3.0.x-dev requires drupal/fakeobjects (~1.0) 
  • 🇦🇺Australia pasan.gamage

    Hi @RajabNatshah

    I've tested this out using a Vanilla Drupal 10 instance running Drupal 10.1.0.
    I followed the instructions in #56
    However, I seem to have this issue where when creating an anchor in a paragraph, it gets created in the exact place I want;
    (i.e. middle of the paragraph) after saving the node and returning to edit it, I can observe the anchor had jumped to the end of the same paragraph.
    Please see the attached.
    I'm wondering if anyone else here found this issue ?

    Thanks

  • 🇳🇿New Zealand siramsay

    @pasan.gamage I can verify that when you enter an anchor link in the middle of a paragraph it jumps to the end of the paragraph when you re-edit the content.

  • 🇦🇺Australia pasan.gamage

    @siramsay Thanks for testing it out. I've updated my previous comment as it happens when you place an anchor to start or middle of a text wrapped in a paragraph tag. Thanks

  • I was also having the same problem with anchors moving to the end of the line. I believe the problem is located in the JS library (specifically the 'upcast' converter in anchorediting.js. I'm looking into a fix, but CKEditor is not one of my strong points.

  • And I've been able to find a fix. I made a PR on the library (https://github.com/northernco/ckeditor5-anchor-drupal/pull/1). If others could test, that would be helpful.

  • 🇦🇺Australia pasan.gamage

    Hi @ok-steve
    Thank you very much for figuring it out and creating a fix. For me to try it out, I need to re-build the ckeditor5-anchor-drupal library with your updated file, but having issues with that. Something to do with my local node 18. But when I get those sorted, I will test this one out. Thank you

  • 🇦🇺Australia darvanen Sydney, Australia

    @ok-steve I downloaded the PR version of the library but was unable to build the dist in node 16, 18 or 20.

    I'd like to test the library - any chance you could post a built version here?

  • Please try again. The npm start command that I was using did work, but now I see that the build command didn't. I updated the dependencies and removed an extraneous import. Now I believe the build command should work too.

  • 🇺🇸United States carsoncho

    Is it also expected behavior that a content author can create an invisible anchor like what appears in #71? It appears that the invisible anchor can only be deleted via editing the source.

  • 🇬🇧United Kingdom sergiur London, UK

    Our clients use invisible anchors often, they are useful. I think that was the purpose of the old fake objects module. It would be good if they could be deleted without going to Source though

  • I am able to delete invisible anchors without editing the source by highlighting () the "[INVISIBLE ANCHOR: anchor name]" text and pressing Delete. I find I need to highlight the entire text (I can also place my cursor at the beginning or end of the text and pressing an arrow key towards the text to highlight the entire text).

  • 🇦🇺Australia darvanen Sydney, Australia

    Re #75:

    On a fresh install of Drupal 10 I:

    • downloaded anchor_link 3.x
    • applied the patch from #55
    • installed the fakeobjects library and module
    • installed the forked ckeditor5-anchor-drupal library
    • enabled anchor_link
    • added the anchor button to the full_html text format
    • Created an article with an invisible anchor which produced this markup: <a class="ck-anchor" id="asdf" name="asdf"></a>
    • Saved the article
    • went to the edit page
    • The markup for the invisible anchor was now: <a class="ck-anchor" name="asdf"><a class="ck-anchor" id="asdf" name="asdf"></a></a>

    That duplication wasn't happening to invisible anchors with the previous library.

    I was not able to delete invisible anchors by highlighting them, I had to put my cursor to the left of them and hit delete twice. Attempts to highlight ended with my cursor to the right of the anchor with no text highlighted.

    The in-paragraph anchors, however, did stay in their original location. So at least that worked.

  • The problem was caused by a conflict with the `@ckeditor/ckeditor5-html-support` plugin. The Basic HTML format was cleaning up the error and the sample that comes with the JS library didn't include that plugin. So the problem was only appearing in Drupal using the Full HTML text format.

    I updated the schema to only allow specific attributes (class, id, name) and that seems to fix the problem.

  • 🇦🇺Australia darvanen Sydney, Australia

    Thanks @ok-steve, latest version seems to run pretty well. I tested anchors at the start, middle, end and inbetween paragraphs and all of them stayed where they were placed and functioned correctly.

    For anyone else reviewing - I suspect the patch at #68 will be easier than what I outlined in #82 as it shouldn't require the fakeobjects module or library.

    I'm hesitant to set this to NR let alone RTBC - looks like #60 hasn't been answered/addressed.

  • 🇦🇺Australia darvanen Sydney, Australia

    Oh and here's the built library I made today for anyone wishing to test/use it.

  • 🇦🇺Australia darvanen Sydney, Australia

    and one more thing: the anchor icon is missing on the text format configuration page:

  • Open in Jenkins → Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update 11 months ago
    Build Successful
  • Ok, I've removed the support for the name attribute and resolved another bug resulting from a conflict with the General HTML Support plugin. This requires a change to the Drupal module (I pushed a change to MR 5 and uploaded a patch file) and the JS library (I've uploaded a new built version).

    As far as the missing icon in the text edit screen, I saw that issue before but after clearing my cache I see it working fine without any changes.

    I'd be interested in hearing from a maintainer what's still needed for a 0.3.0 release of the JS library. For my purposes the PR is good enough and I have some sites I need to get on Drupal 10, with this being the last roadblock.

  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update 11 months ago
    Waiting for branch to pass
  • 🇦🇺Australia thtas

    Here is the same zip from #87 but in structure more easily brought in with composer.

  • 🇱🇻Latvia artis.bajars

    Would the (hopefully) upcoming 10.1.x core update of CKEditor 5 to v39 that apparently adds empty element support help here in making the "invisible anchor" placeholders editable? https://www.drupal.org/project/drupal/issues/3377562 📌 Update CKEditor 5 to 39.0.0 Fixed

  • I forgot to follow up on another point in #84. The 0.2.0 version of the northernco package contains the same built code. I don't know if that's desirable or not, but my updates didn't change that fact.

  • Status changed to Needs review 10 months ago
  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update 10 months ago
    Waiting for branch to pass
  • Status changed to Needs work 10 months ago
  • 🇳🇱Netherlands gaele

    The behaviour when editing empty anchors is messy.

    The easiest way to delete an empty anchor seems to be to double click the chain icon and then hit delete. However when I click anywhere on the empty anchor I expect the anchor edit pop-up to appear, just like when the anchor is not empty. Instead nothing happens. If I then click the anchor button, a pop-up to add a new anchor appears. If I cancel that, the anchor edit pop-up does appear, but CKeditor reports an error and stops working completely.

  • 🇧🇪Belgium Wim Leers Ghent 🇧🇪🇪🇺

    To check if this an upstream bug, we need the steps to reproduce that error without using the custom CKEditor 5 plugin being worked on here.

    Until then, we have to assume it's a bug in this custom CKEditor 5 plugin 😇

  • 🇨🇳China randy Tang

    Here is the same zip from #88
    1、Create a Page

    2、Add a CKEditor paragraph

    3、Input a random word and Add link

    4、Add "3" on ID field below on link advanced

    5、Save as Published

    6、Edit the page and check this link

    Phenomenon:Link change to Anchor automatically

  • 🇺🇸United States FatherShawn New York

    I've just been following rather than in the weeds on this issue. That said, I can't help but wonder if CKEditor 5 updated to version 39, now supports empty inline elements, for inline icons such as Fontawesome won't also help with empty <a> tags here?

  • 🇳🇱Netherlands gaele

    The original CKEditor 5 plugin doesn't work with Drupal, so I'm not sure how to reproduce the error with that version.

    Differences between the original and custom plugin: https://github.com/bvedad/ckeditor5-anchor/compare/master...northernco:c...
    It seems the only meaningful differences are in anchorediting.js and utils.js.

  • 🇳🇱Netherlands gaele

    I tested with Drupal 10.1.x-dev / CKeditor 39, but this did not solve the problem I reported.

  • 🇨🇳China randy Tang

    Modify ckeditor5 icon to svg

  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update 10 months ago
    Waiting for branch to pass
  • 🇺🇸United States BenStallings

    #98 works for me, Drupal 10.1 with CKEditor 5! Thanks to everyone who's been working on this!

  • 🇷🇸Serbia ratvas Novi Sad

    Patch #98 works perfect with anchor_link 3.0.x-dev on Drupal 9.5.9 and CKEditor 5.

  • 🇺🇸United States sclsweb

    Patch #98 works for me too, with a question. As a content editor I would expect to be able to edit an anchor after I've placed it, and I can't figure out how to do it with this patch. Should I be able to do that? (It's also possible that I don't have everything installed properly; I don't know.)

    What I'm seeing is a link icon and a large blue "[INVISIBLE ANCHOR: myanchortext]" where the anchor exists, but I can't change "myanchortext" as expected. Clicking, or double-clicking, or selecting the "[INVISIBLE ANCHOR: myanchortext]" text or the link icon doesn't bring up any editing balloon options. Seems like I can only delete the anchor and place a new one with different text.

    I'm using anchor_link 3.0.x-dev on Drupal 10.1.2 with CKEditor 5, and patch #98, plus Linkit and the CKEditor Anchor link matcher in the Linkit profile.

  • 🇳🇱Netherlands gaele

    @sclsweb The patch currently does not allow editing an empty (invisible) anchor. See #92.

  • 🇧🇪Belgium LRoels Ghent

    Coming back on what is mentioned in #50.
    We still get the same behaviour of links and email addresses in ckeditor being recognised as anchor links.

    Is there anyone that can confirm this behaviour?

    Steps to reproduce:
    1. start typing in wysiwyg: test@test.com
    2. when you press space, the email gets transformed into an anchor and link, all at once.

    See attached mp4 file for reconstruction of what is happening.

    Would be nice to see if this is an issue on our side, or if this has something to do with this patch.

  • 🇺🇸United States afinnarn

    I've tested the patch in #98 with "3.0.x-dev@dev" and I do see the same issue as @LRoels reports about email addresses getting converted to anchor links. I didn't try any other special characters in a string to see if those also turned into anchor links, but I will look at the code further now to see what might be happening.

  • 🇺🇸United States afinnarn

    The issue with email addresses and anchor links seems to stem from the "URL_REG_EXP" variable in "/src/autoanchor.js" of the zip/library I pulled from #88. It captures links correctly, but I think it should exclude email addresses from auto-anchoring.

    I tested by adding this code around line #106 of "/src/autoanchor.js" in the "_enableTypingHandling()" function. I am able to anchor an email manually after updating the code so all it attempts to do is prevent auto-anchoring.

    // 3. Check if the URL is an email address.
    if (url.match(/[^\s@]+@[^\s@]+\.[^\s@]+/gi)) {
    	return;
    }
    

    Of course, the regex can be improved and the fix should be updating "URL_REG_EXP" or "getUrlAtTextEnd( text )" in "/src/autoanchor.js" but this is a quick way to test and see if it fixes your issue @LRoels. Plus regex is not my strong suit, and I'm not sure how we're supposed to be working with the JS library. Exchanging zip files seems weird to me vs. hosting it in the module or on npm.

  • 🇬🇧United Kingdom iancawthorne

    I'm using the patch at #98 with "3.0.x-dev@dev" and the library at #88 but am still finding that when going back into edit a page, the anchors have jumped to the end of the paragraph.

  • 🇺🇸United States bburg Washington D.C.

    Pardon me for jumping in this issue, but I'm trying to test the patch in #98, and I'm getting this error:

    InvalidPluginDefinitionException:
    The "anchor_link_ckeditor5_anchor" CKEditor 5 plugin definition has a "drupal.admin_library" key whose asset library "anchor_link/admin.cke5_anchor_link" does not exist. in CKEditor5PluginDefinition->validateDrupalAspects() CKEditor5PluginDefinition.php

    Were there any steps I'm missing on utilizing this?

  • 🇮🇳India sumit_saini

    Used patch in #98 with 3.0.x-dev and requiring the library as suggested in #88.
    - Anchor jump to end of paragraph (#71) is fixed
    - Link change to Anchor automatically (#94) is fixed.
    - Email linking do not work (#103)

  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update 9 months ago
    Waiting for branch to pass
  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update 9 months ago
    Waiting for branch to pass
  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update 9 months ago
    Waiting for branch to pass
  • Open on Drupal.org →
    Core: 10.0.7 + Environment: PHP 8.1 & MySQL 8
    last update 9 months ago
    Waiting for branch to pass
  • 🇨🇦Canada Dylan Donkersgoed London, Ontario

    This library seems to be working for several people now. I've brought in the fixes from ok-steve and randy Tang. I'm going to merge this into the 3.0.x branch, double check that the install from 3.0.x is working, then close this issue and open a new issue for the problem with empty anchors not being editable. Thanks all for your testing and patches.

  • Status changed to Fixed 9 months ago
  • 🇨🇦Canada Dylan Donkersgoed London, Ontario
  • 🇨🇦Canada Dylan Donkersgoed London, Ontario

    See issues for editing anchor links:

    https://www.drupal.org/project/anchor_link/issues/3391107 🐛 Empty anchor links are not editable Active

    and the bug where mailto links can be converted to anchor links:

    https://www.drupal.org/project/anchor_link/issues/3391107 🐛 Empty anchor links are not editable Active

  • 🇺🇸United States tzura

    I think the bug where mailto links can be converted to anchor links is actually here:

    https://www.drupal.org/project/anchor_link/issues/3391120 🐛 E-mail addresses are automatically picked up as anchor links Needs review

  • 🇮🇳India sumit_saini

    Adding pull request https://github.com/northernco/ckeditor5-anchor-drupal/pull/3 here, which will add back the name attribute for anchor.
    Also, fix provided in 🐛 E-mail addresses are automatically picked up as anchor links Needs review fixes the email linking issue.

  • 🇮🇳India sumit_saini

    Created 🐛 CKEditor5 - Link with id changes to anchor Active for the issue mentioned in #94

  • 🇦🇺Australia dpi Perth, Australia

    @ #115

    FYI if you want the package hosted:

    https://www.npmjs.com/package/@dpi/ckeditor5-anchor-drupal/v/0.0.999

            {
                "type": "package",
                "package": {
                    "name": "northernco/ckeditor5-anchor-drupal",
                    "version": "0.0.999",
                    "type": "drupal-library",
                    "dist": {
                        "url": "https://registry.npmjs.org/@dpi/ckeditor5-anchor-drupal/-/ckeditor5-anchor-drupal-0.0.999.tgz",
                        "type": "tar",
                        "shasum": "8b10162773a6d3fc8feb73481b67dda5e2867b58"
                    }
                }
            }
  • 🇮🇳India sumit_saini

    I needed fixes from both issues mentioned in #115, so here is a zip of build file including both fixes.
    As suggested in comments already, require "drupal-library/ckeditor5-anchor-drupal" after adding below snippet in composer's repositories section:

           {
                "type": "package",
                "package": {
                    "name": "drupal-library/ckeditor5-anchor-drupal",
                    "version": "0.0.0",
                    "type": "drupal-library",
                    "dist": {
                        "url": "https://www.drupal.org/files/issues/2023-10-25/ckeditor5-anchor-drupal.zip",
                        "type": "zip"
                    }
                }
            }
    
    
  • 🇮🇳India sumit_saini

    Zip in #118 don't get unzipped in desired folder structure due to a composer issue, so here is the complete zip.
    I needed fixes from both issues mentioned in #115, so here is a zip of build file including both fixes.
    As suggested in comments already, require "drupal-library/ckeditor5-anchor-drupal" after adding below snippet in composer's repositories section:

           {
                "type": "package",
                "package": {
                    "name": "drupal-library/ckeditor5-anchor-drupal",
                    "version": "0.0.0",
                    "type": "drupal-library",
                    "dist": {
                        "url": "https://www.drupal.org/files/issues/2023-10-25/ckeditor5-anchor-drupal.zip",
                        "type": "zip"
                    }
                }
            }
  • Automatically closed - issue fixed for 2 weeks with no activity.

  • Status changed to Fixed 4 months ago
  • 🇨🇦Canada lindsay.wils

    Sorry to comment on an old thread, but seemed like a good place rather than starting a new thread.

    I cannot for the life of me get this to install via composer. Ive followed the steps from the instructions

      "merge-plugin": {
                "include": [
                    "web/modules/contrib/anchor_link/composer.libraries.json"
                ]
            }

    I get

     Install of northernco/ckeditor5-anchor-drupal failed
      unable to decompress gzipped phar archive "/cygdrive/c/webroot/nova-parks/vendor/composer/tmp-b7926d8d252cafa08cfd9a751ed46531.tg
      z" to temporary file, enable zlib extension in php.ini

    if instead i use the above snippet

           {
                "type": "package",
                "package": {
                    "name": "drupal-library/ckeditor5-anchor-drupal",
                    "version": "0.0.0",
                    "type": "drupal-library",
                    "dist": {
                        "url": "https://www.drupal.org/files/issues/2023-10-25/ckeditor5-anchor-drupal_0.zip",
                        "type": "zip"
                    }
                }
            }

    and run
    composer require drupal-library/ckeditor5-anchor-drupal

    i get

      Problem 1
        - Root composer.json requires northernco/ckeditor5-anchor-drupal, it could not be found in any version, there may be a typo in the package name.
    

    Ive just wasted 2 hours trying to install this damn thing! All for an anchor button that should just be standard with the CkEditor out of the box. Drupal desperately needs a better way for managing these plugins.

    any tips would be really appreciated. Thanks

  • 🇨🇦Canada lindsay.wils

    UPDATE.

    I ended up giving up. removed the composer merge and just added manually into my code base

Production build 0.69.0 2024