Fix: Used the data-placeholder attribute instead of invalid placehold…

…er to set the editor placeholder text (see ckeditor/ckeditor5#1517).

src/ballooneditorui.js

@@ -126,7 +126,7 @@ export default class BalloonEditorUI 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( {

tests/ballooneditorui.js

@@ -131,10 +131,10 @@ describe( 'BalloonEditorUI', () => {
 					} );
 			} );
 
-			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 VirtualBalloonTestEditor
 					.create( element, {
@@ -149,10 +149,10 @@ describe( 'BalloonEditorUI', () => {
 					} );
 			} );
 
-			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 VirtualBalloonTestEditor
 					.create( element, {

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>