Parcourir la source

Fix: Used the data-placeholder attribute instead of invalid placeholder to set the editor placeholder text (see ckeditor/ckeditor5#1517).

Aleksander Nowodzinski il y a 6 ans
Parent
commit
0b0fd73f41

+ 1 - 1
packages/ckeditor5-editor-inline/src/inlineeditorui.js

@@ -163,7 +163,7 @@ export default class InlineEditorUI extends EditorUI {
 		const editingRoot = editingView.document.getRoot();
 
 		const placeholderText = editor.config.get( 'placeholder' ) ||
-			editor.sourceElement && editor.sourceElement.getAttribute( 'placeholder' );
+			editor.sourceElement && editor.sourceElement.dataset.placeholder;
 
 		if ( placeholderText ) {
 			enablePlaceholder( {

+ 4 - 4
packages/ckeditor5-editor-inline/tests/inlineeditorui.js

@@ -148,10 +148,10 @@ describe( 'InlineEditorUI', () => {
 					} );
 			} );
 
-			it( 'sets placeholder from "placeholder" attribute of a passed element', () => {
+			it( 'sets placeholder from the "data-placeholder" attribute of a passed element', () => {
 				const element = document.createElement( 'div' );
 
-				element.setAttribute( 'placeholder', 'placeholder-text' );
+				element.dataset.placeholder = 'placeholder-text';
 
 				return VirtualInlineTestEditor
 					.create( element, {
@@ -166,10 +166,10 @@ describe( 'InlineEditorUI', () => {
 					} );
 			} );
 
-			it( 'uses editor.config.placeholder rather than "placeholder" attribute of a passed element', () => {
+			it( 'uses editor.config.placeholder rather than the "data-placeholder" attribute of a passed element', () => {
 				const element = document.createElement( 'div' );
 
-				element.setAttribute( 'placeholder', 'placeholder-text' );
+				element.dataset.placeholder = 'placeholder-text';
 
 				return VirtualInlineTestEditor
 					.create( element, {

+ 2 - 2
packages/ckeditor5-editor-inline/tests/manual/placeholder.html

@@ -1,5 +1,5 @@
-<div id="editor-1" placeholder="Placeholder from the attribute">
+<div id="editor-1" data-placeholder="Placeholder from the attribute">
 	<p>Remove this text to see the placeholder.</p>
 </div>
 <br />
-<div id="editor-2" placeholder="Placeholder from the attribute"></div>
+<div id="editor-2" data-placeholder="Placeholder from the attribute"></div>