Hi @dolszewski
Yes disabling this stops the stripping - but should there be a config to allow span to have an attribute?
With a custom tag this is possible. Would it make sense to use a custom tag?
Yes @cilefen but I think most people expect the content to stay the same as the view is changed
great, will you be doing a new release or wait a bit?
Hi @pravat231
I can't help with this as I've not had to implement that functionality.
It was certainly easier to work with CKE4!
Maybe it will get a bit better the more that is done and shared with CKE5, and the main docs updated.
Hi @pravat231
You need to add them to the allowed tags in the text-formats you are using, eg Full HTML (admin/config/content/formats)
Click configure
If you have 'Limit allowed HTML tags and correct faulty HTML' filter enabled (as I suspect you have):
Scroll down to the 'Filter settings' area and add to the 'Allowed HTML Tags' textarea as ''
Save
Edit your page and try again.
Note that even clicking the Source button in the editor makes the filters operate (ie you don't have to save to test this).
The other option is to switch off 'Limit allowed HTML tags and correct faulty HTML' - which I currently have, to deal with a different issue.
There is a 'Correct faulty and chopped off HTML' filter as well, which can be left on.
thanks
thanks, I'll have a look
I used 1.0.3 which seems to be the latest
Hi Wim - yep thanks - but could not find a plugin example with optional attributes - suggestion please?
@wim These lines were missing. I my case changing from false to
- <bbref>
- <bbref ver>as I have one attribute 'ver'
For info: to make editor pickup change: in text format - after enabling 'Limit allowed HTML tags and correct faulty HTML' filter, remove your plugin from text format, save, edit text format again and re-add.
BTW A related issue - not specifically to do with the above filter:
The attribute 'ver' is logically optional but in ckeditor5 it must be present (even as 'ver=""') otherwise ckeditor5 will not recognise the tag and removes that markup. Is there a way to configure an optional attribute?
Now on Drupal 9.5.4
The custom tag (and others like abbr) are now being stripped off when viewed if in 'Text formats and editors', the filter 'Limit allowed HTML tags and correct faulty HTML' is enabled.
This is done by Xss::filter() in process() (core/modules/filter/src/Plugin/Filter/FilterHtml.php) as the allowed tags do not include our custom tag.
The 'restrictions' are:<br> <p> <h2> <h3> <h4> <h5> <h6> <strong> <em> <blockquote> <a href> <ul> <ol reversed start> <li> <table> <tr> <td rowspan colspan> <th rowspan colspan> <thead> <tbody> <tfoot> <caption> <img src alt height width data-entity-uuid data-entity-type data-caption data-align> <drupal-media data-entity-type data-entity-uuid alt data-caption data-align>
as shown on the configuration page but are read-only as apparently come from ckeditor. It's not stated how to set them there.
Note this filter operates on normal view not just when saving in ckeditor.
If the filter 'Limit allowed HTML tags and correct faulty HTML' is switched off the custom tag is shown correctly on view and edit - no data-ck-unsafe-element
I could not see a release note on filters or ckeditor in Drupal 9.5.4
It would be good to confirm what should happen and how to add a custom tag if you want 'Limit allowed HTML tags and correct faulty HTML' switched on.
The above build issues were related to using the latest yarn version (v3) - yarn v1 is needed! (see https://github.com/ckeditor/ckeditor5/issues/13340).
The page
https://www.drupal.org/docs/core-modules-and-themes/core-modules/ckeditor-5-module/ckeditor-5-development →
has been updated to note this.
I was able to do a debug build - which is complicated with all the yarn-linking but could not see exactly where this was happening.
I did a CSS work-round so the data was at least visible.
However - in 'Text formats and editors' if the filter 'Limit allowed HTML tags and correct faulty HTML' is enabled the problem goes away...
This is in core/modules/filter/src/Plugin/Filter/FilterHtml.php
Again it's not clear how this is affecting ckeditor5
git@github .. gives:
git@github.com: Permission denied (publickey).
fatal: Could not read from remote repository.so https:... more convenient
Hi Wim
Tried that:
$ yarn cache clean
➤ YN0000: Done in 0s 1ms
jon@nat:/var/www/ktt/web/core$ yarn build:ckeditor5-dev
Internal Error: Drupal@workspace:.: This package doesn't seem to be present in your lockfile; run "yarn install" to update the lockfile
at Cb.getCandidates (/home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:435:5146)
at zf.getCandidates (/home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:391:1264)
at /home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:439:7695
at Ff (/home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:390:8965)
at ge (/home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:439:7675)
at async Promise.allSettled (index 0)
at async eo (/home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:390:8293)
at async /home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:439:8205
at async ni.startProgressPromise (/home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:390:45507)
at async He.resolveEverything (/home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:439:6238)
$ yarn install
➤ YN0000: ┌ Resolution step
➤ YN0013: │ farbtastic@https://github.com/mattfarina/farbtastic/archive/1.3u.tar.gz can't be found in the cache and will be fetched from the remote server
➤ YN0013: │ joyride@https://github.com/zurb/joyride/archive/refs/heads/v2.1.tar.gz can't be found in the cache and will be fetched from the remote server
➤ YN0061: │ picturefill@npm:3.0.3 is deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.
➤ YN0032: │ fsevents@npm:2.3.2: Implicit dependencies on node-gyp are discouraged
➤ YN0061: │ request@npm:2.88.2 is deprecated: request has been deprecated, see https://github.com/request/request/issues/3142
➤ YN0001: │Error: farbtastic@https://github.com/mattfarina/farbtastic/archive/1.3u.tar.gz: Manifest not found
at el.find (/home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:390:29961)
at async /home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:601:11496
at async Object.Gbe (/home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:390:8896)
at async yQ.resolve (/home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:601:11457)
at async zf.resolve (/home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:391:1400)
at async zf.resolve (/home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:391:1400)
at async /home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:439:6346
at async Ff (/home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:390:8959)
at async Z (/home/jon/.cache/node/corepack/yarn/3.3.1/yarn.js:439:6328)
at async Promise.allSettled (index 43)
➤ YN0000: └ Completed in 2s 892ms
➤ YN0000: Failed with errors in 2s 896ms
➤ YN0061: request-promise@npm:4.2.6 is deprecated: request-promise has been deprecated because it extends the now deprecated request package, see https://github.com/request/request/issues/3142
➤ YN0061: debug@npm:3.2.6 is deprecated: Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797)
➤ YN0061: mkdirp@npm:0.5.4 is deprecated: Legacy versions of mkdirp are no longer supported. Please update to mkdirp 1.x. (Note that the API surface has changed to use Promises in 1.x.)
➤ YN0061: har-validator@npm:5.1.5 is deprecated: this library is no longer supported
➤ YN0061: uuid@npm:3.4.0 is deprecated: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See https://v8.dev/blog/math-random for details.
➤ YN0061: @npmcli/move-file@npm:2.0.1 is deprecated: This functionality has been moved to @npmcli/fs
I've tried related actions with npm and get similar problems with farbtastic, also if trying to add packages in package.json manually
Wim, yes looks like I'll need to debug the Drupal setup - could you advise easiest way to build a 'source' version of web/core/assets/vendor/ckeditor5/ckeditor5-dll/ckeditor5-dll.js with same loaders etc? package.json, webpack.config.js are obviously not in the core area.
I guess along these lines https://ckeditor.com/docs/ckeditor5/latest/installation/advanced/alterna...
I created a standalone version of the plugin with local paths (ie so runs like one of the example plugins) (uploaded to github issue). This works fine so the issue seems to be something to do with the Drupal environment? Both are running the same version of CKE (34.2.0) according to window.CKEDITOR_VERSION
Looking at unminified ckeditor5-dll.js it seems to be evaluated in cjs.js which is passed various rules:
"./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./packages/ckeditor5-engine/theme/renderer.css": (e, t, o) => {
"use strict";
o.d(t, { Z: () => n });
var s = o("./node_modules/css-loader/dist/runtime/api.js"),
i = o.n(s)()(function (e) {
return e[1];
});
i.push([e.id, ".ck.ck-editor__editable span[data-ck-unsafe-element]{display:none}", ""]);
const n = i;
},This seems to be in one of the loaders as not in core ckeditor5 source on github, from what I can see (https://github.com/ckeditor)
BTW Working through the ckeditor sample plugins, all the code is local in node_modules etc
When transferring to running under drupal the structure is not the same.
I worked out the import path changes.
I can see ckeditor5-dll.js in core/assets/... and the plugins in core/modules/ckeditor5/js/ckeditor5_plugins
Also clues in core/modules/ckeditor5/js/build/ckeditor5.types.jsdoc
But could full structure be documented please to help with debugging?
thanks Wim - posted as: https://github.com/ckeditor/ckeditor5/issues/13340