refactor: replace ref() with shallowRef() in all test files

AGENTS.md requires shallowRef by default. All test state uses
reassignment (not mutation), so shallowRef is correct.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Yunfei He
2026-05-25 23:28:06 +08:00
parent 6e01954cf9
commit 5e54e5742d
12 changed files with 34 additions and 34 deletions
@@ -1,4 +1,4 @@
import { defineComponent, nextTick, ref } from "vue";
import { defineComponent, nextTick, shallowRef } from "vue";
import { expect, test } from "vite-plus/test";
import { render } from "@vue-tui/testing";
import { Box, Text } from "@vue-tui/runtime";
@@ -41,7 +41,7 @@ test("borderBottom:false suppresses bottom edge", async () => {
});
test("reactive borderTop:false update removes top edge", async () => {
const showTop = ref(true);
const showTop = shallowRef(true);
const App = defineComponent(() => {
return () => <Box borderStyle="single" borderTop={showTop.value} width={6} height={3} />;
});
@@ -1,10 +1,10 @@
import { defineComponent, nextTick, ref } from "vue";
import { defineComponent, nextTick, shallowRef } from "vue";
import { expect, test } from "vite-plus/test";
import { render } from "@vue-tui/testing";
import { Box, Text } from "@vue-tui/runtime";
test("v-if toggle preserves sibling order", async () => {
const show = ref(true);
const show = shallowRef(true);
const App = defineComponent(() => {
return () => (
<Box flexDirection="column">
@@ -37,7 +37,7 @@ test("v-if toggle preserves sibling order", async () => {
});
test("keyed v-for reorder renders in new order", async () => {
const items = ref([1, 2, 3]);
const items = shallowRef([1, 2, 3]);
const App = defineComponent(() => {
return () => (
<Box flexDirection="column">
@@ -63,7 +63,7 @@ test("keyed v-for reorder renders in new order", async () => {
});
test("repeated list shuffles don't crash", async () => {
const items = ref([1, 2, 3, 4, 5]);
const items = shallowRef([1, 2, 3, 4, 5]);
const App = defineComponent(() => {
return () => (
<Box flexDirection="column">
@@ -1,11 +1,11 @@
import { PassThrough } from "node:stream";
import { defineComponent, nextTick, ref } from "vue";
import { defineComponent, nextTick, shallowRef } from "vue";
import { expect, test } from "vite-plus/test";
import { render } from "@vue-tui/testing";
import { Box, Text, Static, createApp } from "@vue-tui/runtime";
test("Static appends new items above the dynamic frame", async () => {
const items = ref<string[]>([]);
const items = shallowRef<string[]>([]);
const App = defineComponent(() => {
return () => (
@@ -34,8 +34,8 @@ test("Static appends new items above the dynamic frame", async () => {
});
test("Static preserves prior items when new ones are added", async () => {
const logs = ref<string[]>([]);
const status = ref("idle");
const logs = shallowRef<string[]>([]);
const status = shallowRef("idle");
const App = defineComponent(() => {
return () => (
@@ -89,7 +89,7 @@ test("Static flush clears the dynamic frame first (non-debug mode)", async () =>
},
});
const items = ref<string[]>([]);
const items = shallowRef<string[]>([]);
const App = defineComponent(() => () => (
<Box>
<Static items={items.value}>
@@ -177,7 +177,7 @@ test.todo(
);
test("Static items do not add blank lines to the dynamic frame", async () => {
const items = ref<string[]>([]);
const items = shallowRef<string[]>([]);
const App = defineComponent(() => () => (
<Box flexDirection="column">
@@ -1,4 +1,4 @@
import { defineComponent, ref } from "vue";
import { defineComponent, shallowRef } from "vue";
import { expect, test } from "vite-plus/test";
import { render } from "@vue-tui/testing";
import { Text, useInput, useStdout, type Key } from "@vue-tui/runtime";
@@ -29,7 +29,7 @@ test("useInput receives arrow keys", async () => {
test("useInput respects isActive ref", async () => {
const calls: string[] = [];
const active = ref(false);
const active = shallowRef(false);
const App = defineComponent(() => {
useInput((input) => calls.push(input), { isActive: active });
return () => <Text>x</Text>;
@@ -192,7 +192,7 @@ test("useInput - ignore input if not active (isActive: false)", async () => {
test("useInput - ignore input if not active (isActive ref toggled)", async () => {
const calls: string[] = [];
const active = ref(false);
const active = shallowRef(false);
const App = defineComponent(() => {
useInput((input) => calls.push(input), { isActive: active });
return () => <Text>x</Text>;
@@ -1,11 +1,11 @@
import { defineComponent, ref } from "vue";
import { defineComponent, shallowRef } from "vue";
import { expect, test } from "vite-plus/test";
import { render } from "@vue-tui/testing";
import { Box, Text, useInput } from "@vue-tui/runtime";
test("counter responds to + and - keys", async () => {
const Counter = defineComponent(() => {
const count = ref(0);
const count = shallowRef(0);
useInput((input) => {
if (input === "+") count.value++;
if (input === "-") count.value--;
@@ -1,4 +1,4 @@
import { defineComponent, nextTick, ref, shallowRef } from "vue";
import { defineComponent, nextTick, shallowRef } from "vue";
import { expect, test } from "vite-plus/test";
import { render } from "@vue-tui/testing";
import { Box, Text, useFocus, useFocusManager } from "@vue-tui/runtime";
@@ -41,7 +41,7 @@ test("focus(id) programmatically focuses another component", async () => {
});
test("isActive=false prevents component from receiving focus", async () => {
const active = ref(false);
const active = shallowRef(false);
const Item = defineComponent({
props: { id: { type: String, required: true } },
@@ -76,7 +76,7 @@ test("isActive=false prevents component from receiving focus", async () => {
});
test("autoFocus + isActive=false does not focus at mount", async () => {
const active = ref(false);
const active = shallowRef(false);
const App = defineComponent(() => {
const { isFocused } = useFocus({ id: "item", autoFocus: true, isActive: active });
@@ -93,7 +93,7 @@ test("autoFocus + isActive=false does not focus at mount", async () => {
});
test("flipping isActive to false on focused item blurs it", async () => {
const active = ref(true);
const active = shallowRef(true);
const App = defineComponent(() => {
const { isFocused } = useFocus({ id: "item", autoFocus: true, isActive: active });
@@ -1,10 +1,10 @@
import { defineComponent, nextTick, ref } from "vue";
import { defineComponent, nextTick, shallowRef } from "vue";
import { expect, test } from "vite-plus/test";
import { render } from "@vue-tui/testing";
import { Text, useFocus } from "@vue-tui/runtime";
test("swapping focusable components never disables raw mode", async () => {
const showA = ref(true);
const showA = shallowRef(true);
const Item = defineComponent(() => {
useFocus();
@@ -1,4 +1,4 @@
import { defineComponent, nextTick, ref } from "vue";
import { defineComponent, nextTick, shallowRef } from "vue";
import { expect, test } from "vite-plus/test";
import { render } from "@vue-tui/testing";
import { Text, useExit } from "@vue-tui/runtime";
@@ -11,7 +11,7 @@ test("setup() throw rejects render()", async () => {
});
test("render-time throw does not prevent unmount", async () => {
const trigger = ref(false);
const trigger = shallowRef(false);
const App = defineComponent(() => {
return () => {
if (trigger.value) throw new Error("render boom");
@@ -1,4 +1,4 @@
import { defineComponent, nextTick, ref } from "vue";
import { defineComponent, nextTick, shallowRef } from "vue";
import { expect, test } from "vite-plus/test";
import { render } from "@vue-tui/testing";
import { Box, Text, useInput } from "@vue-tui/runtime";
@@ -33,7 +33,7 @@ test("100 render/unmount cycles leak zero yoga nodes", async () => {
});
test("raw mode stays on when one of two useInput components unmounts", async () => {
const showB = ref(true);
const showB = shallowRef(true);
const Listener = defineComponent(() => {
useInput(() => {});
@@ -1,11 +1,11 @@
import { defineComponent, ref } from "vue";
import { defineComponent, shallowRef } from "vue";
import { expect, test } from "vite-plus/test";
import { render } from "@vue-tui/testing";
import { Box, Text, useInput } from "@vue-tui/runtime";
test("README quickstart code runs to a Count: 0 frame", async () => {
const Counter = defineComponent(() => {
const count = ref(0);
const count = shallowRef(0);
useInput((input) => {
if (input === "+") count.value++;
if (input === "-") count.value--;
@@ -1,10 +1,10 @@
import { defineComponent, nextTick, ref, watch } from "vue";
import { defineComponent, nextTick, shallowRef, watch } from "vue";
import { expect, test } from "vite-plus/test";
import { render } from "@vue-tui/testing";
import { Box, Text } from "@vue-tui/runtime";
test("multiple mutations in one tick produce at most 1 new frame", async () => {
const count = ref(0);
const count = shallowRef(0);
const App = defineComponent(() => {
return () => <Text>{String(count.value)}</Text>;
});
@@ -23,7 +23,7 @@ test("multiple mutations in one tick produce at most 1 new frame", async () => {
});
test("post-flush watch sees the same value the commit paints", async () => {
const count = ref(0);
const count = shallowRef(0);
let observed = 0;
const App = defineComponent(() => {
+2 -2
View File
@@ -1,4 +1,4 @@
import { nextTick, ref } from "vue";
import { nextTick, shallowRef } from "vue";
import { expect, test } from "vite-plus/test";
import { render } from "../src/index.ts";
import { Text } from "@vue-tui/runtime";
@@ -9,7 +9,7 @@ test("lastFrame captures rendered output", async () => {
});
test("frames accumulate on reactive updates", async () => {
const message = ref("first");
const message = shallowRef("first");
const { lastFrame, frames } = await render(() => <Text>{message.value}</Text>);
const initialCount = frames.length;
expect(lastFrame()).toContain("first");