Problem/Motivation
The Drupal status report incorrectly flags valid SVG icons as incompatible with CKEditor5, and console errors are observed on pages with CKEditor due to SVG URL format issues. The `guessMimeType($icon)` method may not accurately identify SVG files with URLs containing AWS S3 `?VersionId=...` query parameters, leading to these errors.



Steps to reproduce
Necessary modules:
Necessary config:
- S3FS and S3 must have file revisions enabled.
- S3FS setting to Use S3 for public:// files should be enabled.
- AWS Configuration and SVG Hosting: Host SVG icons on AWS S3, with URLs that include `?VersionId=...` query parameters.
- Link SVGs in Drupal and Observe Errors: Use these SVG URLs in Drupal. Observe incorrect flagging in the status report and console errors on pages with CKEditor5, stating that SVG icons are not in the supported format.
Proposed resolution
Modify the `guessMimeType($icon)` function or its usage in `embed_requirements` to handle URLs with query parameters accurately. Additionally, address the CKEditor5 console errors by ensuring it recognizes SVG URLs with query parameters as valid.
Remaining tasks
- Analyze and update the mime type guessing logic and CKEditor5's SVG URL handling.
- Test with various SVG URLs, particularly those with query parameters.
- Ensure accurate identification of SVG mime types and compatibility with CKEditor5.
- Review and commit changes.
User interface changes
None expected, as changes pertain to backend processing and CKEditor5's handling of file types.
API changes
Potential minor adjustments in file type processing methods and CKEditor5's SVG handling.
Data model changes
No changes expected.
Release notes snippet
"Fixed issues with SVG icon URL processing in Drupal status reports and CKEditor5. Updates ensure SVGs with query parameters are correctly identified as valid formats, resolving both status report inaccuracies and CKEditor5 console errors."
Other notes
Status error
Status Details
Errors found
Embed button CKEditor5 compatiblity
The following embed button(s) are not using SVG icons and will not be compatible with CKEditor5
Embed Content: somefile.svg?VersionId=i8YlnyiQ7jgD_ZPP6sDFsWsbof5tAA3B
console error
CKEditor 5 only supports enity embed icons in SVG format. The icon provided is post_add_FILL0_wght400_GRAD0_opsz24.svg?VersionId=U2OvXbMiPNLelJEnvmocKQVjh2Towbh8
SVG icons not appearing in ckeditor.
Offending code for status report https://git.drupalcode.org/project/embed/-/blob/8.x-1.x/embed.install?re...
| Comment | File | Size | Author |
|---|---|---|---|
| Screenshot 2024-01-11 at 3.00.32 PM.png | 582.96 KB | trackleft2 | |
| Screenshot 2024-01-11 at 2.42.37 PM.png | 651.22 KB | trackleft2 | |
| Screenshot 2024-01-11 at 2.50.53 PM.png | 153.96 KB | trackleft2 |
Issue fork embed-3414167
Show commands
Start within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
Comments
Comment #2
trackleft2Comment #3
trackleft2Possibly similar issue on other contrib module https://www.drupal.org/project/remote_stream_wrapper/issues/2776951