diff --git a/src/view/placeholder.js b/src/view/placeholder.js index 07d81d5d5..8b3b77363 100644 --- a/src/view/placeholder.js +++ b/src/view/placeholder.js @@ -110,15 +110,19 @@ function updateSinglePlaceholder( element, checkFunction ) { return; } + // Element is empty for placeholder purposes when it has no children or only ui elements. + // This check is taken from `view.ContainerElement#getFillerOffset`. + const isEmptyish = !Array.from( element.getChildren() ).some( element => !element.is( 'uiElement' ) ); + // If element is empty and editor is blurred. - if ( !document.isFocused && !element.childCount ) { + if ( !document.isFocused && isEmptyish ) { element.addClass( 'ck-placeholder' ); return; } // It there are no child elements and selection is not placed inside element. - if ( !element.childCount && anchor && anchor.parent !== element ) { + if ( isEmptyish && anchor && anchor.parent !== element ) { element.addClass( 'ck-placeholder' ); } else { element.removeClass( 'ck-placeholder' ); diff --git a/tests/view/placeholder.js b/tests/view/placeholder.js index 4d8c43f75..10df30134 100644 --- a/tests/view/placeholder.js +++ b/tests/view/placeholder.js @@ -47,6 +47,16 @@ describe( 'placeholder', () => { expect( element.hasClass( 'ck-placeholder' ) ).to.be.false; } ); + it( 'if element has only ui elements, set CSS class and data attribute', () => { + setData( viewDocument, '