fix: don't remove non-null-assertion operator

#2248

packages/svelte2tsx/src/utils/htmlxparser.ts

@@ -152,6 +152,8 @@ const possibleOperatorOrPropertyAccess = new Set([
  '-'
 ]);
 
+const id_char = /[\w$]/;
+
 function blankPossiblyErrorOperatorOrPropertyAccess(htmlx: string) {
  let index = htmlx.indexOf('}');
  let lastIndex = 0;
@@ -162,6 +164,16 @@ function blankPossiblyErrorOperatorOrPropertyAccess(htmlx: string) {
  while (backwardIndex > lastIndex) {
  const char = htmlx.charAt(backwardIndex);
  if (possibleOperatorOrPropertyAccess.has(char)) {
+ if (char === '!') {
+ // remove ! if it's at the beginning but not if it's used as the TS non-null assertion operator
+ let prev = backwardIndex - 1;
+ while (prev > lastIndex && htmlx.charAt(prev) === ' ') {
+ prev--;
+ }
+ if (id_char.test(htmlx.charAt(prev))) {
+ break;
+ }
+ }
  const isPlusOrMinus = char === '+' || char === '-';
  const isIncrementOrDecrement =
  isPlusOrMinus && htmlx.charAt(backwardIndex - 1) === char;

packages/svelte2tsx/test/htmlx2jsx/samples/ts-in-template.v5/expected-svelte5.js

@@ -21,4 +21,5 @@ item as string;
 ;__sveltets_2_ensureSnippet(foo(bar as string));
 
  { svelteHTML.createElement("button", { "onclick":(e: Event) => {e as any},}); }
- { const $$_tnenopmoC0C = __sveltets_2_ensureComponent(Component); new $$_tnenopmoC0C({ target: __sveltets_2_any(), props: { "attr":attr as boolean,}});}
+ { const $$_tnenopmoC0C = __sveltets_2_ensureComponent(Component); new $$_tnenopmoC0C({ target: __sveltets_2_any(), props: { "attr":attr as boolean,}});}
+ { svelteHTML.createElement("label", { "id":ok!,}); }

packages/svelte2tsx/test/htmlx2jsx/samples/ts-in-template.v5/input.svelte

@@ -30,3 +30,4 @@
 
 <button onclick={(e: Event) => {e as any}}>click</button>
 <Component attr={attr as boolean} />
+<label id={ok!}></label>