mirror_php/wordpress
1
0
Fork 0
mirror of git://develop.git.wordpress.org/ synced 2025-03-23 13:29:56 +01:00
Code Issues Actions 10 Packages Projects Releases Wiki Activity

TinyMCE: A11y: Remove title attributes and improve placeholders.

Browse Source 
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.

git-svn-id: https://develop.svn.wordpress.org/trunk@60007 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Joe Dolson 2025-03-17 16:14:05 +00:00
parent a179731534
commit c8414754e9
4 changed files with 14 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/js/_enqueues/vendor/tinymce/plugins/wordpress/plugin.js vendored
View File

@ -116,7 +116,7 @@ tinymce.PluginManager.add( 'wordpress', function( editor ) {
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" />';
});
}
@ -125,7 +125,7 @@ tinymce.PluginManager.add( 'wordpress', function( editor ) {
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" />' );
}
if ( event.load && event.format !== 'raw' ) {
@ -144,10 +144,9 @@ tinymce.PluginManager.add( 'wordpress', function( editor ) {
'data-wp-preserve="' + encodeURIComponent( match ) + '" ' +
'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;" ' +
'/>';
} );
}
@ -214,7 +213,7 @@ tinymce.PluginManager.add( 'wordpress', function( editor ) {
classname += ' mce-wp-' + tag;
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" />';
// Most common case.

1
src/js/_enqueues/vendor/tinymce/skins/wordpress/images/script.svg vendored Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"><path fill="#D5D5D5" d="M0 0h20v20H0z"/><path fill="#101517" d="m8.43 18.18-5.05-2.45v-.84l5.05-2.42v1.1l-3.9 1.74 3.9 1.77v1.1zM16.38 15.73l-5.05 2.45v-1.1l3.9-1.77-3.9-1.74v-1.1l5.05 2.42v.84zM4.7 8.1h.94c.08.48.37.72.85.72s.82-.1 1.01-.31c.2-.2.3-.78.3-1.73V1.81h1.07v4.93c0 1.07-.18 1.85-.52 2.33-.35.47-.97.71-1.85.71-.52 0-.94-.15-1.26-.45-.33-.3-.51-.72-.54-1.23zM10.73 9.31l.39-.98c.2.14.45.27.75.36.3.1.57.15.8.15.42 0 .76-.11 1.01-.34s.38-.52.38-.88c0-.26-.07-.5-.2-.73-.15-.23-.5-.48-1.07-.75l-.64-.3a2.53 2.53 0 0 1-1.12-.88 2.31 2.31 0 0 1-.32-1.25c0-.58.2-1.07.62-1.46s.95-.58 1.6-.58c.87 0 1.48.15 1.82.43l-.32.93c-.14-.1-.36-.2-.66-.3s-.56-.14-.81-.14c-.37 0-.65.1-.86.3-.21.22-.32.48-.32.8a1.25 1.25 0 0 0 .43.96c.13.12.4.28.82.48l.65.3c.54.26.91.56 1.13.91.22.36.32.8.32 1.35 0 .59-.23 1.1-.7 1.5a2.8 2.8 0 0 1-1.91.62c-.7 0-1.3-.17-1.8-.5z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 930 B

1
src/js/_enqueues/vendor/tinymce/skins/wordpress/images/style.svg vendored Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"><path fill="#D5D5D5" d="M0 0h20v20H0z"/><path fill="#101517" d="m8.43 18.18-5.05-2.45v-.84l5.05-2.42v1.1l-3.9 1.74 3.9 1.77v1.1zM16.38 15.73l-5.05 2.45v-1.1l3.9-1.77-3.9-1.74v-1.1l5.05 2.42v.84zM7.25 2.1 6.89 3c-.35-.25-.89-.37-1.63-.37-.69 0-1.24.3-1.66.89-.41.6-.62 1.36-.62 2.3 0 .9.21 1.62.64 2.18a2 2 0 0 0 1.66.83c.73 0 1.3-.26 1.7-.78l.59.82c-.62.62-1.43.93-2.4.93-1.03 0-1.84-.37-2.43-1.11s-.9-1.72-.9-2.93c0-1.18.32-2.15.95-2.93s1.45-1.17 2.45-1.17c.85 0 1.52.14 2 .43zM8.45 9.31l.4-.98c.2.14.44.27.74.36.3.1.57.15.8.15.42 0 .76-.11 1.01-.34s.38-.52.38-.88c0-.26-.07-.5-.2-.73-.15-.23-.5-.48-1.07-.75l-.64-.3a2.53 2.53 0 0 1-1.12-.89 2.31 2.31 0 0 1-.32-1.24c0-.59.2-1.07.62-1.46s.95-.58 1.6-.58c.87 0 1.48.14 1.82.42l-.32.94c-.14-.1-.36-.2-.65-.3s-.57-.15-.82-.15A1.08 1.08 0 0 0 9.5 3.7a1.25 1.25 0 0 0 .43.96c.13.12.41.27.82.47l.65.31c.54.25.91.56 1.13.91.22.35.33.8.33 1.35 0 .59-.24 1.09-.72 1.5a2.8 2.8 0 0 1-1.9.62c-.7 0-1.3-.17-1.79-.5zM13.74 9.31l.4-.98c.2.14.44.27.74.36.3.1.57.15.8.15.43 0 .76-.11 1.02-.34s.38-.52.38-.88c0-.26-.07-.5-.21-.73-.15-.23-.5-.48-1.07-.75l-.63-.3a2.53 2.53 0 0 1-1.13-.88 2.31 2.31 0 0 1-.32-1.25c0-.58.2-1.07.62-1.46s.95-.58 1.6-.58c.88 0 1.48.15 1.82.43l-.32.93c-.14-.1-.36-.2-.65-.3s-.57-.15-.82-.15c-.36 0-.65.1-.86.32-.21.2-.32.47-.32.8a1.25 1.25 0 0 0 .43.96c.14.11.41.27.83.47l.64.3c.54.26.91.56 1.13.91.22.35.33.8.33 1.35 0 .59-.24 1.09-.72 1.5a2.8 2.8 0 0 1-1.9.62c-.7 0-1.3-.17-1.79-.5z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

8
src/js/_enqueues/vendor/tinymce/skins/wordpress/wp-content.css vendored
View File

@ -160,6 +160,14 @@ img[data-mce-selected]::selection {
background: transparent url( images/pagebreak.png ) repeat-y scroll center center;
}
.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] {
padding: 0 2px;