Changeset 60007

Timestamp:

03/17/2025 04:14:05 PM (5 weeks ago)

Author:

joedolson

Message:

TinyMCE: A11y: Remove title attributes and improve placeholders.

Shifts the title attribute on more and page-break placeholder images to alt, moves the title attribute to alt on the style and script placeholders and replaces the images to differentiate between CSS and JS content.

Props sabernhardt, abcd95, joedolson.
Fixes #62861.

Location:

trunk/src/js/_enqueues/vendor/tinymce

Files:

• plugins/wordpress/plugin.js (modified) (4 diffs)
• skins/wordpress/images/script.svg (added)
• skins/wordpress/images/style.svg (added)
• skins/wordpress/wp-content.css (modified) (1 diff)

trunk/src/js/_enqueues/vendor/tinymce/plugins/wordpress/plugin.js

@@ -117 +117 @@
                 event.content = event.content.replace( /<!--more(.*?)-->/g, function( match, moretext ) {
                     return '<img src="' + tinymce.Env.transparentSrc + '" data-wp-more="more" data-wp-more-text="' + moretext + '" ' +
-                        'class="wp-more-tag mce-wp-more" alt="" title="' + title + '" data-mce-resize="false" data-mce-placeholder="1" />';
+                        'class="wp-more-tag mce-wp-more" alt="' + title + '" data-mce-resize="false" data-mce-placeholder="1" />';
                 });
             }
@@ -126 +126 @@
                 event.content = event.content.replace( /<!--nextpage-->/g,
                     '<img src="' + tinymce.Env.transparentSrc + '" data-wp-more="nextpage" class="wp-more-tag mce-wp-nextpage" ' +
-                        'alt="" title="' + title + '" data-mce-resize="false" data-mce-placeholder="1" />' );
+                        'alt="' + title + '" data-mce-resize="false" data-mce-placeholder="1" />' );
             }
 
@@ -145 +145 @@
                         'data-mce-resize="false" ' +
                         'data-mce-placeholder="1" '+
-                        'class="mce-object" ' +
+                        'class="mce-object mce-object-' + tag + '" ' +
                         'width="20" height="20" '+
                         'alt="&lt;' + tag + '&gt;" ' +
-                        'title="&lt;' + tag + '&gt;" ' +
                     '/>';
                 } );
@@ -215 +214 @@
         title = tag === 'more' ? 'Read more...' : 'Next page';
         title = __( title );
-        html = '<img src="' + tinymce.Env.transparentSrc + '" alt="" title="' + title + '" class="' + classname + '" ' +
+        html = '<img src="' + tinymce.Env.transparentSrc + '" alt="' + title + '" class="' + classname + '" ' +
             'data-wp-more="' + tag + '" data-mce-resize="false" data-mce-placeholder="1" />';
 

trunk/src/js/_enqueues/vendor/tinymce/skins/wordpress/wp-content.css

@@ -161 +161 @@
 }
 
+.mce-object-style {
+    background-image: url( images/style.svg );
+}
+
+.mce-object-script {
+    background-image: url( images/script.svg );
+}
+
 /* Styles for formatting the boundaries of anchors and code elements */
 .mce-content-body a[data-mce-selected] {