refactor(reactivity): toRaw

pages/index/index.uvue

@@ -617,6 +617,11 @@ export default {
                   name: 'shallowRef',
                   url: 'shallow-ref/shallow-ref'
                 },
+                {
+                  id: 'to-raw',
+                  name: 'toRaw',
+                  url: 'to-raw/to-raw'
+                },
               ]
             }
           ] as Page[]

pages/reactivity/advanced/to-raw/to-raw.test.js

-const PAGE_PATH = '/pages/composition-api/reactivity/to-raw/to-raw'
+const PAGE_PATH = '/pages/reactivity/advanced/to-raw/to-raw'
 
 describe('toRaw', () => {
   let page = null
+  
   beforeAll(async () => {
     page = await program.reLaunch(PAGE_PATH)
     await page.waitFor('view')
   })
+  
   it('basic', async () => {
     const checkToRawRef = await page.$('#check-to-raw-ref')
-    expect(await checkToRawRef.text()).toBe('check toRaw ref: false')
+    expect(await checkToRawRef.text()).toBe('false')
 
     const checkToRawReactive = await page.$('#check-to-raw-reactive')
-    expect(await checkToRawReactive.text()).toBe('check toRaw reactive: true')
+    expect(await checkToRawReactive.text()).toBe('true')
 
     const checkToRawReadonly = await page.$('#check-to-raw-readonly')
-    expect(await checkToRawReadonly.text()).toBe('check toRaw readonly: true')
+    expect(await checkToRawReadonly.text()).toBe('true')
 
     const checkToRawShallowReactive = await page.$('#check-to-raw-shallow-reactive')
-    expect(await checkToRawShallowReactive.text()).toBe('check toRaw shallowReactive: true')
+    expect(await checkToRawShallowReactive.text()).toBe('true')
 
     const checkToRawShallowReadonly = await page.$('#check-to-raw-shallow-readonly')
-    expect(await checkToRawShallowReadonly.text()).toBe('check toRaw shallowReadonly: true')
+    expect(await checkToRawShallowReadonly.text()).toBe('true')
   })
 })
\ No newline at end of file

pages/reactivity/advanced/to-raw/to-raw.uvue

 <template>
   <view class="page">
-    <text id="check-to-raw-ref">check toRaw ref: {{ checkToRawRef }}</text>
-    <text class="mt-10" id="check-to-raw-reactive">check toRaw reactive: {{ checkToRawReactive }}</text>
-    <text class="mt-10" id="check-to-raw-readonly">check toRaw readonly: {{ checkToRawReadonly }}</text>
-    <text class="mt-10" id="check-to-raw-shallow-reactive">check toRaw shallowReactive:
-      {{ checkToRawShallowReactive }}</text>
-    <text class="mt-10" id="check-to-raw-shallow-readonly">check toRaw shallowReadonly:
-      {{ checkToRawShallowReadonly }}</text>
+    <view class="flex justify-between flex-row mb-10">
+      <text>check toRaw ref:</text>
+      <text id="check-to-raw-ref">{{ checkToRawRef }}</text>
+    </view>
+    <view class="flex justify-between flex-row mb-10">
+      <text>check toRaw reactive:</text>
+      <text id="check-to-raw-reactive">{{ checkToRawReactive }}</text>
+    </view>
+    <view class="flex justify-between flex-row mb-10">
+      <text>check toRaw readonly:</text>
+      <text id="check-to-raw-readonly">{{ checkToRawReadonly }}</text>
+    </view>
+    <view class="flex justify-between flex-row mb-10">
+      <text>check toRaw shallowReactive:</text>
+      <text id="check-to-raw-shallow-reactive">{{
+        checkToRawShallowReactive
+      }}</text>
+    </view>
+    <view class="flex justify-between flex-row mb-10">
+      <text>check toRaw shallowReadonly:</text>
+      <text id="check-to-raw-shallow-readonly">{{
+        checkToRawShallowReadonly
+      }}</text>
+    </view>
   </view>
 </template>
 
-<script setup>
-  const obj = {}
+<script setup lang="uts">
+const obj = {}
 
-  const refObj = ref(obj);
-  const checkToRawRef = toRaw<UTSJSONObject>(refObj) === obj;
+const refObj = ref(obj);
+const checkToRawRef = toRaw<UTSJSONObject>(refObj) === obj;
 
-  const reactiveObj = reactive(obj);
-  const checkToRawReactive = toRaw<UTSJSONObject>(reactiveObj) === obj;
+const reactiveObj = reactive(obj);
+const checkToRawReactive = toRaw<UTSJSONObject>(reactiveObj) === obj;
 
-  const readonlyObj = readonly(obj);
-  const checkToRawReadonly = toRaw<UTSJSONObject>(readonlyObj) === obj;
+const readonlyObj = readonly(obj);
+const checkToRawReadonly = toRaw<UTSJSONObject>(readonlyObj) === obj;
 
-  const shallowReactiveObj = shallowReactive(obj);
-  const checkToRawShallowReactive = toRaw<UTSJSONObject>(shallowReactiveObj) === obj;
+const shallowReactiveObj = shallowReactive(obj);
+const checkToRawShallowReactive = toRaw<UTSJSONObject>(shallowReactiveObj) === obj;
 
-  const shallowReadonlyObj = shallowReadonly(obj);
-  const checkToRawShallowReadonly = toRaw<UTSJSONObject>(shallowReadonlyObj) === obj;
-</script>
\ No newline at end of file
+const shallowReadonlyObj = shallowReadonly(obj);
+const checkToRawShallowReadonly = toRaw<UTSJSONObject>(shallowReadonlyObj) === obj;
+</script>

refactor_options-API-composition-API-correspondence.md

@@ -148,7 +148,7 @@ function transform(fileInfo, api) {
 - [x] shallowReactive
 - [x] shallowReadonly
 - [x] shallowRef
-- [ ] toRaw
+- [x] toRaw
 - [ ] triggerRef
 
 ## directives