[html] Sytax Highlighting is way off with new line after event handler (microsoft#162319)

Author: aeschli

extensions/html-language-features/server/src/modes/embeddedSupport.ts

@@ -196,9 +196,9 @@ function getSuffix(c: EmbeddedRegion) {
 }
 
 function substituteWithWhitespace(result: string, start: number, end: number, oldContent: string, before: string, after: string) {
-	let accumulatedWS = 0;
 	result += before;
-	for (let i = start + before.length; i < end; i++) {
+	let accumulatedWS = -before.length; // start with a negative value to account for the before string
+	for (let i = start; i < end; i++) {
 		const ch = oldContent[i];
 		if (ch === '\n' || ch === '\r') {
 			// only write new lines, skip the whitespace

extensions/html-language-features/server/src/test/embedded.test.ts

@@ -122,7 +122,7 @@ suite('HTML Embedded Support', () => {
 
 		assertEmbeddedLanguageContent('<div onKeyUp="foo()" onkeydown="bar()"/>', 'javascript', '              foo();            bar();  ');
 		assertEmbeddedLanguageContent('<div onKeyUp="return"/>', 'javascript', '              return;  ');
-
+		assertEmbeddedLanguageContent('<div onKeyUp=return\n/><script>foo();</script>', 'javascript', '             return;\n          foo();         ');
 	});
 
 });