From 2bbd012952a6c89be8e9f0d01abcf6f5bea5b008 Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Sun, 11 Jul 2021 20:39:51 +0200
Subject: [PATCH] test(ssr): test basic hydration

---
 __tests__/ssr.spec.ts | 37 +++++++++++++++++++++++++++++++++----
 1 file changed, 33 insertions(+), 4 deletions(-)

diff --git a/__tests__/ssr.spec.ts b/__tests__/ssr.spec.ts
index 7d0a417b..96502c16 100644
--- a/__tests__/ssr.spec.ts
+++ b/__tests__/ssr.spec.ts
@@ -2,7 +2,7 @@
  * @jest-environment node
  */
 import { createPinia } from '../src'
-import { createSSRApp, inject } from 'vue'
+import { Component, createSSRApp, inject } from 'vue'
 import { renderToString, ssrInterpolate } from '@vue/server-renderer'
 import { useUserStore } from './pinia/stores/user'
 import { useCartStore } from './pinia/stores/cart'
@@ -25,14 +25,14 @@ describe('SSR', () => {
     },
   }
 
-  function createMyApp() {
-    const app = createSSRApp(App)
+  function createMyApp(MyApp: Component = App) {
+    const app = createSSRApp(MyApp)
     const pinia = createPinia()
     app.use(pinia)
     // const rootEl = document.createElement('div')
     // document.body.appendChild(rootEl)
 
-    return { app }
+    return { app, pinia }
   }
 
   it('keeps apps separated', async () => {
@@ -57,6 +57,35 @@ describe('SSR', () => {
     `)
   })
 
+  it('automatically hydrates', async () => {
+    const { app, pinia } = createMyApp({
+      ssrRender(ctx: any, push: any, _parent: any) {
+        push(
+          `<p>${ssrInterpolate(ctx.user.name)}: ${ssrInterpolate(
+            ctx.cart.rawItems.join(', ')
+          )}</p>`
+        )
+      },
+      setup() {
+        const cart = useCartStore()
+        const user = useUserStore()
+        return { cart, user }
+      },
+    })
+
+    pinia.state.value.user = {
+      name: 'Tom',
+      isAdmin: false,
+    }
+
+    pinia.state.value.cart = {
+      id: 10,
+      rawItems: ['water', 'water', 'apples'],
+    }
+
+    expect(await renderToString(app)).toBe(`<p>Tom: water, water, apples</p>`)
+  })
+
   it('can use a different store', async () => {
     const { app: a1 } = createMyApp()
     const { app: a2 } = createMyApp()
-- 
2.47.2