Fix empty heading anchor id leaving an empty id attribute on the head…

…ing html tag (WordPress#11663)

This commit checks that the anchor id attribute is not an empty string before saving it as additional props. Also adds a test to cover this behaviour.

packages/editor/src/hooks/anchor.js

@@ -97,7 +97,7 @@ export const withInspectorControl = createHigherOrderComponent( ( BlockEdit ) =>
  * @return {Object} Filtered props applied to save element.
  */
 export function addSaveProps( extraProps, blockType, attributes ) {
-	if ( hasBlockSupport( blockType, 'anchor' ) ) {
+	if ( hasBlockSupport( blockType, 'anchor' ) && attributes.anchor !== '' ) {
 		extraProps.id = attributes.anchor;
 	}
 

packages/editor/src/hooks/test/anchor.js

@@ -62,5 +62,17 @@ describe( 'anchor', () => {
 
 			expect( extraProps.id ).toBe( 'foo' );
 		} );
+
+		it( 'should have no id property if anchor attribute id is an empty string', () => {
+			const attributes = { anchor: '' };
+			const extraProps = getSaveContentExtraProps( {}, {
+				...blockSettings,
+				supports: {
+					anchor: true,
+				},
+			}, attributes );
+
+			expect( extraProps ).not.toHaveProperty( 'id' );
+		} );
 	} );
 } );