(trivago#276) Fixed dollar sign group replace in vue preprocessor

src/preprocessors/vue-preprocessor.ts

@@ -10,5 +10,9 @@ export function vuePreprocessor(code: string, options: PrettierOptions) {
         return code;
     }
 
-    return code.replace(content, `\n${preprocessor(content, options)}\n`);
+    // 'replacer' is a function so it returns the preprocessed code as-is.
+    // If it were passed as just a string and the string contained special groups (like $&, $`, $', $n, $<n>, etc.) this would produce invalid results
+    const replacer =  () => `\n${preprocessor(content, options)}\n`;
+
+    return code.replace(content, replacer);
 }

tests/Vue/__snapshots__/ppsi.spec.js.snap

@@ -137,6 +137,25 @@ div {
 
 `;
 
+exports[`sfcWithSpecialReplacerGroups.vue - vue-verify: sfcWithSpecialReplacerGroups.vue 1`] = `
+<script setup>
+let a = '$';
+let b = '$';
+let c = '$$';
+</script>
+<template><div>{{ a + b + c }}</div></template>
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+<script setup>
+let a = "$";
+let b = "$";
+let c = "$$";
+</script>
+<template>
+    <div>{{ a + b + c }}</div>
+</template>
+
+`;
+
 exports[`ts.vue - vue-verify: ts.vue 1`] = `
 <script lang="ts">
 // I am top level comment in this file.

tests/Vue/sfcWithSpecialReplacerGroups.vue

@@ -0,0 +1,6 @@
+<script setup>
+let a = '$';
+let b = '$';
+let c = '$$';
+</script>
+<template><div>{{ a + b + c }}</div></template>