Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

upcase attributeToAttribute / downcast attributeToElement #12157

Closed
AroundtheGlobe opened this issue Jul 27, 2022 · 4 comments
Closed

upcase attributeToAttribute / downcast attributeToElement #12157

AroundtheGlobe opened this issue Jul 27, 2022 · 4 comments
Labels
resolution:expired This issue was closed due to lack of feedback. type:task This issue reports a chore (non-production change) and other types of "todos".

Comments

@AroundtheGlobe
Copy link

Provide a description of the task

I am trying to upgrade the ckeditor5-build-classic and my custom plugins from version 21.0.0 to 34.2.0. The following plugin code works fine in 21.0.0. The plugin allows the editor to keep two specific classes ['brokenlink', 'redirectlink'] on a ahref element to highlight the link is working or not.

import Plugin from '@ckeditor/ckeditor5-core/src/plugin';

import './theme/brokenlinks.css';

const BROKENLINKS = 'brokenLinks';

export default class BrokenLinks extends Plugin {
    static get pluginName() {
        return BROKENLINKS;
    }
    init() {
        const editor = this.editor;

        editor.model.schema.extend('$text', { allowAttributes: 'linkClass' })

        editor.conversion.for('downcast').attributeToElement({
            model: 'linkClass',
            view: (attributeValue, writer) => writer.createAttributeElement('a', { class: attributeValue }, { priority: 5 }),
            converterPriority: 'low'
        })

        editor.conversion.for('upcast').attributeToAttribute({
            view: {
                name: 'a',
                key: 'class'
            },
            model: {
                key: 'linkClass',
                values: ['brokenlink', 'redirectlink']
            },
            converterPriority: 'low'
        })
    }
}

The documentation on the API change for the view isn't very clear (to me) how to update the code for version 34.2.0.
Based on this link I should update:

view: (attributeValue, writer) => writer.createAttributeElement('a', { class: attributeValue }, { priority: 5 }),
to
view: (attributeValue, { writer }) => { return writer.createAttributeElement('a', { class: attributeValue }, { priority: 5 }) },
But that doesn't seem to work. There isn't a similar example in the documentation with a createAttributeElement for the view. As far as I was able to find no other changes are needed to update to version 34.2? Is that correct?

The documentation shows a "classes" property so it might be that "class" is a reserved word now that can't be used in the same was as in 21.0.0? I've tried multiple variations of code that I've found online, but none of them seem to work. What am I missing or what is missing in the documentation?

What do I need to change to update make this plugin working for version 34.2.0?

Second question:
As an addition to this plugin I would also like to remove the class when the url is updated in the editor and the value is different than it was when the editor loaded. Any documentation on how to do that?

📃 Other details

  • Browser:FireFox
  • OS: Windows 10
  • CKEditor version: 21, 34,2
  • Installed CKEditor plugins: custom
@AroundtheGlobe AroundtheGlobe added the type:task This issue reports a chore (non-production change) and other types of "todos". label Jul 27, 2022
@AroundtheGlobe
Copy link
Author

I've managed to work around the issue by using link decorators.

ClassicEditor.create(document.querySelector('#editor'),
		{
			link: {
				decorators: {
					brokenLink: {
						mode: 'manual',
						classes:'brokenlink'
					},
					redirectLink: {
						mode: 'manual',
						classes:'redirectlink'
					}
				}
			}
		})
		.then(editor => {
			window.editor = editor;
		})
		.catch(error => {
			console.error('There was a problem initializing the editor.', error);
		});

I haven't found a way yet to remove the class once the url is changed.

@CKEditorBot
Copy link
Collaborator

There has been no activity on this issue for the past year. We've marked it as stale and will close it in 30 days. We understand it may be relevant, so if you're interested in the solution, leave a comment or reaction under this issue.

@CKEditorBot
Copy link
Collaborator

There has been no activity on this issue for the past year. We've marked it as stale and will close it in 30 days. We understand it may still be relevant, so if you're interested in the solution, leave a comment or reaction under this issue.

@CKEditorBot
Copy link
Collaborator

We've closed your issue due to inactivity over the last year. We understand that the issue may still be relevant. If so, feel free to open a new one (and link this issue to it).

@CKEditorBot CKEditorBot added resolution:expired This issue was closed due to lack of feedback. and removed status:stale labels Jan 15, 2024
@CKEditorBot CKEditorBot closed this as not planned Won't fix, can't repro, duplicate, stale Jan 15, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
resolution:expired This issue was closed due to lack of feedback. type:task This issue reports a chore (non-production change) and other types of "todos".
Projects
None yet
Development

No branches or pull requests

2 participants