Completly ignore underlines in links

The Docs UI continues to be a little too "helpful" when styling links, leading to un-closed tags.
Automattic · Jun 26, 2017 · 1f41449 · 1f41449
1 parent c802f49
commit 1f41449
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 18 deletions.
diff --git a/server/doc-service/tags.js b/server/doc-service/tags.js
@@ -24,41 +24,36 @@ function objectDiff( obj1, obj2 ) {
 	}, {} )
 }
 
-/**
- * Convert an object diff into HTML tags
- *
- * @param {object} diffParam An object with changed attributes (e.g. `{ BOLD: true }`)
- * @returns {string} HTML tags that open or close
- */
-function tagsForAttrDiff( diffParam ) {
-	const diff = Object.assign( {}, diffParam )
+export function changedTags( elAttributes, prevAttributes ) {
+	const diff = objectDiff( prevAttributes, elAttributes )
 	let tags = '';
 
 	if ( diff.LINK_URL ) {
 		tags += `<a href="${ quoteattr( diff.LINK_URL ) }">`
-		delete diff.UNDERLINE;
-		delete diff.FOREGROUND_COLOR;
-	}
-
-	if ( diff.LINK_URL === null ) {
-		tags += '</a>'
-		delete diff.UNDERLINE;
-		delete diff.FOREGROUND_COLOR;
 	}
 
 	for ( let prop in simpleTagMap ) {
+		// Ignore underlines in links
+		if ( 'UNDERLINE' === prop ) {
+			if ( elAttributes.LINK_URL || diff.LINK_URL === null ) {
+				continue;
+			}
+		}
+
 		if ( diff[ prop ] ) {
 			tags += '<' + simpleTagMap[ prop ] + '>';
 		} else if ( diff[ prop ] === null ) {
 			tags += '</' + simpleTagMap[ prop ] + '>';
 		}
 	}
 
+	if ( diff.LINK_URL === null ) {
+		tags += '</a>'
+	}
+
 	return tags
 }
 
-export const changedTags = ( elAttributes, prevAttributes ) => tagsForAttrDiff( objectDiff( prevAttributes, elAttributes ) )
-
 /*
  * From StackOverflow - http://stackoverflow.com/a/9756789
  * (cc) by-sa 3.0 verdy-p http://stackoverflow.com/users/407132/verdy-p

diff --git a/test/doc-service.js b/test/doc-service.js
@@ -97,6 +97,7 @@ function paragraphOf( ...elements ) {
 	paragraph.getAlignment = td.function( 'getAlignment' )
 	td.when( paragraph.getType() ).thenReturn( DocumentApp.ElementType.PARAGRAPH )
 	td.when( paragraph.getAlignment() ).thenReturn( DocumentApp.HorizontalAlignment.LEFT )
+	td.when( paragraph.getAttributes() ).thenReturn( blankAttributes() )
 	return paragraph
 }
 
@@ -169,6 +170,28 @@ describe( 'renderContainer()', function() {
 
 			expect( actual ).to.equal( link )
 		} )
+
+		it( 'ignores underlines in links', function() {
+			const link = 'http://stackoverflow.com/a/1732454'
+			const linkAttrs = Object.assign( blankAttributes(), {
+				LINK_URL: link,
+				FOREGROUND_COLOR: '#1155cc'
+			} )
+			const underlineStart = Object.assign( linkAttrs, { UNDERLINE: true  } )
+
+			const text = mockText( link )
+			const endPoint = link.length
+			td.when( text.getTextAttributeIndices() ).thenReturn( [ 0, 1, endPoint ] )
+			td.when( text.getAttributes() ).thenReturn( blankAttributes() );
+			td.when( text.getAttributes( 0 ) ).thenReturn( linkAttrs );
+			td.when( text.getAttributes( 1 ) ).thenReturn( underlineStart );
+			td.when( text.getAttributes( endPoint ) ).thenReturn( blankAttributes() );
+			const container = containerOf( text )
+
+			const actual = renderContainer( container )
+
+			expect( actual ).to.equal( link )
+		} )
 	} )
 
 	describe( 'ListItem', function() {
@@ -182,6 +205,7 @@ describe( 'renderContainer()', function() {
 				td.when( listItem.getType() ).thenReturn( DocumentApp.ElementType.LIST_ITEM )
 				td.when( listItem.getGlyphType() ).thenReturn( DocumentApp.GlyphType.BULLET )
 				td.when( listItem.getNestingLevel() ).thenReturn( 0 )
+				td.when( listItem.getAttributes() ).thenReturn( blankAttributes() )
 				return listItem
 			} );
 		} )