test: add ssr test for hydrate custom refs

diff --git a/packages/pinia/__tests__/ssr.spec.ts b/packages/pinia/__tests__/ssr.spec.ts
index 6bd63cbc71dcc5f8974fa58deb4a5b6cdc0782e5..f179d28014529c44df1636fbb7edf746121787e6 100644 (file)
--- a/packages/pinia/__tests__/ssr.spec.ts
+++ b/packages/pinia/__tests__/ssr.spec.ts
@@ -2,7 +2,7 @@
  * @jest-environment node
  */
 import { createPinia, defineStore } from '../src'
-import { Component, createSSRApp, inject, ref, computed } from 'vue'
+import { Component, createSSRApp, inject, ref, computed, customRef } from 'vue'
 import { renderToString, ssrInterpolate } from '@vue/server-renderer'
 import { useUserStore } from './pinia/stores/user'
 import { useCartStore } from './pinia/stores/cart'
@@ -86,6 +86,40 @@ describe('SSR', () => {
     expect(await renderToString(app)).toBe(`<p>Tom: water, water, apples</p>`)
   })
 
+  it('hydrates custom refs', async () => {
+    function useCustomRef() {
+      let value = 3
+      return customRef((track, trigger) => ({
+        get() {
+          track()
+          return value
+        },
+        set(newValue: number) {
+          value = newValue
+          trigger()
+        },
+      }))
+    }
+
+    const useMainOptions = defineStore('main-options', {
+      state: () => ({
+        customRef: useCustomRef(),
+      }),
+    })
+
+    const { app } = createMyApp({
+      ssrRender(ctx: any, push: any, _parent: any) {
+        push(`<p>${ssrInterpolate(ctx.store.customRef)}</p>`)
+      },
+      setup() {
+        const store = useMainOptions()
+        return { store }
+      },
+    })
+
+    expect(await renderToString(app)).toBe(`<p>3</p>`)
+  })
+
   it('can use a different store', async () => {
     const { app: a1 } = createMyApp()
     const { app: a2 } = createMyApp()