test: v-pre (#14)

Co-authored-by: 三咲智子 Kevin Deng <sxzz@sxzz.moe>

packages/compiler-vapor/__tests__/__snapshots__/compile.test.ts.snap

@@ -141,6 +141,58 @@ export function render() {
 "
 `;
 
+exports[`compile > directives > v-pre > basic 1`] = `
+"import { template } from 'vue/vapor';
+const t0 = template('<div :id=\\"foo\\"><Comp></Comp>{{ bar }}</div>');
+export function render() {
+  const n0 = t0();
+  return n0;
+}
+"
+`;
+
+exports[`compile > directives > v-pre > self-closing v-pre 1`] = `
+"import { template, children, createTextNode, append, effect, setAttr, setText } from 'vue/vapor';
+const t0 = template('<div></div><div><Comp></Comp></div>');
+export function render() {
+  const n0 = t0();
+  const {
+    1: [n1],
+  } = children(n0);
+  const n2 = createTextNode(bar);
+  append(n1, n2);
+  effect(() => {
+    setAttr(n1, 'id', undefined, foo);
+  });
+  effect(() => {
+    setText(n2, undefined, bar);
+  });
+  return n0;
+}
+"
+`;
+
+exports[`compile > directives > v-pre > should not affect siblings after it 1`] = `
+"import { template, children, createTextNode, append, effect, setAttr, setText } from 'vue/vapor';
+const t0 = template('<div :id=\\"foo\\"><Comp></Comp>{{ bar }}</div><div><Comp></Comp></div>');
+export function render() {
+  const n0 = t0();
+  const {
+    1: [n1],
+  } = children(n0);
+  const n2 = createTextNode(bar.value);
+  append(n1, n2);
+  effect(() => {
+    setAttr(n1, 'id', undefined, foo.value);
+  });
+  effect(() => {
+    setText(n2, undefined, bar.value);
+  });
+  return n0;
+}
+"
+`;
+
 exports[`compile > directives > v-text > no expression 1`] = `
 "import { template, children, effect, setText } from 'vue/vapor';
 const t0 = template('<div></div>');

packages/compiler-vapor/__tests__/compile.test.ts

@@ -189,5 +189,51 @@ describe('compile', () => {
         expect(code).not.contains('effect')
       })
     })
+
+    describe('v-pre', () => {
+      test('basic', async () => {
+        const code = await compile(
+          `<div v-pre :id="foo"><Comp/>{{ bar }}</div>\n`,
+          {
+            bindingMetadata: {
+              foo: BindingTypes.SETUP_REF,
+              bar: BindingTypes.SETUP_REF,
+            },
+          },
+        )
+
+        expect(code).toMatchSnapshot()
+        expect(code).contains('<div :id="foo"><Comp></Comp>{{ bar }}</div>')
+        expect(code).not.contains('effect')
+      })
+
+      // TODO: support multiple root nodes and components
+      test('should not affect siblings after it', async () => {
+        const code = await compile(
+          `<div v-pre :id="foo"><Comp/>{{ bar }}</div>\n` +
+            `<div :id="foo"><Comp/>{{ bar }}</div>`,
+          {
+            bindingMetadata: {
+              foo: BindingTypes.SETUP_REF,
+              bar: BindingTypes.SETUP_REF,
+            },
+          },
+        )
+
+        expect(code).toMatchSnapshot()
+        // Waiting for TODO, There should be more here.
+      })
+
+      // TODO: support multiple root nodes and components
+      test('self-closing v-pre', async () => {
+        const code = await compile(
+          `<div v-pre/>\n<div :id="foo"><Comp/>{{ bar }}</div>`,
+        )
+
+        expect(code).toMatchSnapshot()
+        expect(code).contains('<div></div><div><Comp></Comp></div>')
+        // Waiting for TODO, There should be more here.
+      })
+    })
   })
 })