diff --git a/pages/composition-api/reactivity/shallow-reactive/shallow-reactive.test.js b/pages/composition-api/reactivity/shallow-reactive/shallow-reactive.test.js
new file mode 100644
index 0000000000000000000000000000000000000000..8691dcb23116dfc1db7ad2856f3fee4bc13dbc80
--- /dev/null
+++ b/pages/composition-api/reactivity/shallow-reactive/shallow-reactive.test.js
@@ -0,0 +1,33 @@
+const PAGE_PATH = '/pages/composition-api/reactivity/shallow-reactive/shallow-reactive'
+
+describe('shallowReactive', () => {
+  if (process.env.uniTestPlatformInfo.startsWith('android')) {
+    let page = null
+    beforeAll(async () => {
+      page = await program.reLaunch(PAGE_PATH)
+      await page.waitFor('view')
+    })
+    it('basic', async () => {
+      const stateCount = await page.$('#state-count')
+      expect(await stateCount.text()).toBe('state.count: 0')
+
+      const stateNestedCount = await page.$('#state-nested-count')
+      expect(await stateNestedCount.text()).toBe('state.nested.count: 0')
+
+      const incrementStateNestedCountBtn = await page.$('#increment-state-nested-count-btn')
+      await incrementStateNestedCountBtn.tap()
+
+      expect(await stateNestedCount.text()).toBe('state.nested.count: 0')
+
+      const incrementStateCountBtn = await page.$('#increment-state-count-btn')
+      await incrementStateCountBtn.tap()
+
+      expect(await stateCount.text()).toBe('state.count: 1')
+      expect(await stateNestedCount.text()).toBe('state.nested.count: 1')
+    })
+  } else {
+    it('other platform', () => {
+      expect(1).toBe(1)
+    })
+  }
+})
\ No newline at end of file
diff --git a/pages/composition-api/reactivity/shallow-reactive/shallow-reactive.uvue b/pages/composition-api/reactivity/shallow-reactive/shallow-reactive.uvue
index 623121842f782d4d0bad378df8434063d2def430..578c922b44b3b3b3bcc1e6781ee08ac7ec1955a8 100644
--- a/pages/composition-api/reactivity/shallow-reactive/shallow-reactive.uvue
+++ b/pages/composition-api/reactivity/shallow-reactive/shallow-reactive.uvue
@@ -1 +1,36 @@
- <template><view class="page">shallowReactive</view></template>
\ No newline at end of file
+<template>
+  <view class="page">
+    <text id="state-count" class="uni-common-mb">state.count: {{ state.count }}</text>
+    <text id="state-nested-count" class="uni-common-mb">state.nested.count: {{ state.nested.count }}</text>
+    <button id="increment-state-count-btn" class="uni-common-mb" @click="incrementStateCount">
+      increment state.count
+    </button>
+    <button id="increment-state-nested-count-btn" @click="incrementStateNestedCount">
+      increment state.nested.count
+    </button>
+  </view>
+</template>
+
+<script setup>
+  type StateNested = {
+    count : number
+  }
+  type State = {
+    count : number,
+    nested : StateNested
+  }
+  const state = shallowReactive({
+    count: 0,
+    nested: {
+      count: 0
+    } as StateNested
+  } as State)
+
+  const incrementStateCount = () => {
+    state.count++
+  }
+
+  const incrementStateNestedCount = () => {
+    state.nested.count++
+  }
+</script>
\ No newline at end of file
diff --git a/pages/tab-bar/composition-api.uvue b/pages/tab-bar/composition-api.uvue
index dfc577778a9b8530d1e8c2c9c7ba7a35af09a7ad..64adae97294d2a09adbf7e5216a305ee1d6dd176 100644
--- a/pages/tab-bar/composition-api.uvue
+++ b/pages/tab-bar/composition-api.uvue
@@ -181,7 +181,7 @@
           {
             name: 'shallowReactive',
             url: 'shallow-reactive',
-            enable: false,
+            enable: true,
           },
           {
             name: 'shallowReadonly',