From c6788cdd5eaa918aed2019d2fa60b3f88f375e4c Mon Sep 17 00:00:00 2001
From: Daniel Choudhury <dannychoudhury@gmail.com>
Date: Mon, 22 Apr 2024 23:44:36 +0700
Subject: [PATCH] feat(cookieJar): Change cookie.get to directly return value
 (#10493)

---
 .changesets/10493.md                          | 19 +++++++++++++++++++
 .../vite/src/middleware/CookieJar.test.ts     | 18 ++++++------------
 packages/vite/src/middleware/CookieJar.ts     |  2 +-
 .../src/middleware/MiddlewareRequest.test.ts  |  4 ++--
 packages/vite/src/middleware/register.test.ts |  2 +-
 5 files changed, 29 insertions(+), 16 deletions(-)
 create mode 100644 .changesets/10493.md

diff --git a/.changesets/10493.md b/.changesets/10493.md
new file mode 100644
index 000000000000..461695b4b362
--- /dev/null
+++ b/.changesets/10493.md
@@ -0,0 +1,19 @@
+- feat(cookieJar): Change cookie.get to directly return value (#10493) by @dac09
+
+**Motivation**
+My original design of the `CookeiJar.get` would return the full cookie object we store, including cookie options. This is not ideal because you need to access the cookie like this:
+
+```js
+const myCookie = mwRequest.cookies.get('myCookie')
+
+// 👇
+const actualValue = myCookie.value
+```
+
+This is unwieldy, and feels unergonomic for the 98% of cases where `get` will be used to just see the value. 
+
+**How do I still see the options of the cookie?**
+You can still access all the details of the cookie by doing `cookie.entries`. I don't really have a case for this yet, so let's not optimise for this case, but we know it's possible!
+
+
+This is me just stabilizing the API for Middleware stuff, before we ship it out of experimental
diff --git a/packages/vite/src/middleware/CookieJar.test.ts b/packages/vite/src/middleware/CookieJar.test.ts
index 66f01011c49c..6fa61e9dc572 100644
--- a/packages/vite/src/middleware/CookieJar.test.ts
+++ b/packages/vite/src/middleware/CookieJar.test.ts
@@ -12,21 +12,17 @@ describe('CookieJar', () => {
   )
 
   test('instatitates cookie jar from a cookie string', () => {
-    expect(cookieJar.get('color_mode')).toStrictEqual({
-      value: JSON.stringify({
+    expect(cookieJar.get('color_mode')).toStrictEqual(
+      JSON.stringify({
         color_mode: 'light',
         light_theme: { name: 'light', color_mode: 'light' },
         dark_theme: { name: 'dark_dimmed', color_mode: 'dark' },
       }),
-    })
+    )
 
-    expect(cookieJar.get('preferred_color_mode')).toStrictEqual({
-      value: 'dark',
-    })
+    expect(cookieJar.get('preferred_color_mode')).toStrictEqual('dark')
 
-    expect(cookieJar.get('tz')).toStrictEqual({
-      value: 'Asia/Bangkok',
-    })
+    expect(cookieJar.get('tz')).toStrictEqual('Asia/Bangkok')
   })
 
   describe('Helper methods like JS Map', () => {
@@ -60,11 +56,9 @@ describe('CookieJar', () => {
 
       myJar.unset('auth_provider')
 
-      const { value: authProviderValue, options: authProviderOptions } =
-        myJar.get('auth_provider')!
+      const authProviderValue = myJar.get('auth_provider')
 
       expect(authProviderValue).toBeFalsy()
-      expect(authProviderOptions!.expires).toStrictEqual(new Date(0))
     })
 
     test('clear All', () => {
diff --git a/packages/vite/src/middleware/CookieJar.ts b/packages/vite/src/middleware/CookieJar.ts
index 55c358d63a18..cba97fac0569 100644
--- a/packages/vite/src/middleware/CookieJar.ts
+++ b/packages/vite/src/middleware/CookieJar.ts
@@ -37,7 +37,7 @@ export class CookieJar {
   }
 
   public get(name: string) {
-    return this.map.get(name)
+    return this.map.get(name)?.value
   }
 
   public has(name: string) {
diff --git a/packages/vite/src/middleware/MiddlewareRequest.test.ts b/packages/vite/src/middleware/MiddlewareRequest.test.ts
index 379532521fb5..f0f1dbe7cebc 100644
--- a/packages/vite/src/middleware/MiddlewareRequest.test.ts
+++ b/packages/vite/src/middleware/MiddlewareRequest.test.ts
@@ -18,7 +18,7 @@ describe('MiddlewareRequest', () => {
     })
     const mReq = createMiddlewareRequest(req)
 
-    expect(mReq.cookies.get('foo')).toStrictEqual({ value: 'bar' })
+    expect(mReq.cookies.get('foo')).toStrictEqual('bar')
     expect(mReq.method).toStrictEqual('POST')
     expect(mReq.headers.get('Content-Type')).toStrictEqual('application/json')
 
@@ -43,7 +43,7 @@ describe('MiddlewareRequest', () => {
 
     const mReq = createMiddlewareRequest(whatWgRequest)
 
-    expect(mReq.cookies.get('errybody')).toStrictEqual({ value: 'lets-funk' })
+    expect(mReq.cookies.get('errybody')).toStrictEqual('lets-funk')
     expect(mReq.method).toStrictEqual('PUT')
 
     expect(mReq.headers.get('x-custom-header')).toStrictEqual('beatdrop')
diff --git a/packages/vite/src/middleware/register.test.ts b/packages/vite/src/middleware/register.test.ts
index 69d888fc757b..7cc000bd8259 100644
--- a/packages/vite/src/middleware/register.test.ts
+++ b/packages/vite/src/middleware/register.test.ts
@@ -139,7 +139,7 @@ describe('chain', () => {
     expect(output.headers.get('class-mw-value')).toBe('999')
 
     // The other one still gets chained
-    expect(output.cookies.get('add-cookie-mw').value).toBe('added')
+    expect(output.cookies.get('add-cookie-mw')).toBe('added')
 
     // Because /bazinga is more specific, the '*' handlers won't be executed
     expect(output.headers.get('add-header-mw')).toBeFalsy()