From cce54b10bb1778ed7762b451514e5b9da05be496 Mon Sep 17 00:00:00 2001
From: Guilherme Carreiro <guilherme.carreiro@shopify.com>
Date: Fri, 20 Sep 2024 07:37:38 +0200
Subject: [PATCH] Fix Theme Access authentication on `shopify theme dev` and
 `shopify theme console` commands.

---
 .changeset/hip-chefs-dance.md                             | 5 +++++
 .../cli/utilities/theme-environment/dev-server-session.ts | 6 +++++-
 .../theme-environment/storefront-renderer.test.ts         | 8 +++++++-
 .../utilities/theme-environment/storefront-renderer.ts    | 7 +++++++
 4 files changed, 24 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/hip-chefs-dance.md

diff --git a/.changeset/hip-chefs-dance.md b/.changeset/hip-chefs-dance.md
new file mode 100644
index 0000000000..803ae4e91b
--- /dev/null
+++ b/.changeset/hip-chefs-dance.md
@@ -0,0 +1,5 @@
+---
+'@shopify/theme': patch
+---
+
+Fix Theme Access authentication on `shopify theme dev` and `shopify theme console` commands
diff --git a/packages/theme/src/cli/utilities/theme-environment/dev-server-session.ts b/packages/theme/src/cli/utilities/theme-environment/dev-server-session.ts
index e89c56f7ba..62630ac21f 100644
--- a/packages/theme/src/cli/utilities/theme-environment/dev-server-session.ts
+++ b/packages/theme/src/cli/utilities/theme-environment/dev-server-session.ts
@@ -50,7 +50,11 @@ async function fetchDevServerSession(
 
   const session = await ensureAuthenticatedThemes(adminSession.storeFqdn, adminPassword, [])
   const storefrontToken = await ensureAuthenticatedStorefront([], adminPassword)
-  const sessionCookies = await getStorefrontSessionCookies(baseUrl, themeId, storefrontPassword, {})
+  const sessionCookies = await getStorefrontSessionCookies(baseUrl, themeId, storefrontPassword, {
+    'X-Shopify-Shop': session.storeFqdn,
+    'X-Shopify-Access-Token': session.token,
+    Authorization: `Bearer ${storefrontToken}`,
+  })
 
   return {
     ...session,
diff --git a/packages/theme/src/cli/utilities/theme-environment/storefront-renderer.test.ts b/packages/theme/src/cli/utilities/theme-environment/storefront-renderer.test.ts
index 40071d6d64..c57703fedc 100644
--- a/packages/theme/src/cli/utilities/theme-environment/storefront-renderer.test.ts
+++ b/packages/theme/src/cli/utilities/theme-environment/storefront-renderer.test.ts
@@ -12,7 +12,7 @@ vi.mock('@shopify/cli-kit/node/http', async () => {
   }
 })
 
-const successResponse = {ok: true, status: 200, headers: {get: vi.fn()}} as any
+const successResponse = {ok: true, status: 200, headers: {get: vi.fn(), delete: vi.fn()}} as any
 
 const session: DevServerSession = {
   token: 'admin_token_abc123',
@@ -50,6 +50,7 @@ describe('render', () => {
 
     // Then
     expect(response.status).toEqual(200)
+    expect(response.headers.delete).toBeCalled()
     expect(fetch).toHaveBeenCalledWith(
       'https://store.myshopify.com/products/1?_fd=0&pb=0',
       expect.objectContaining({
@@ -74,6 +75,7 @@ describe('render', () => {
 
     // Then
     expect(response.status).toEqual(200)
+    expect(response.headers.delete).toBeCalled()
     expect(fetch).toHaveBeenCalledWith(
       'https://theme-kit-access.shopifyapps.com/cli/sfr/products/1?_fd=0&pb=0',
       expect.objectContaining({
@@ -109,6 +111,7 @@ describe('render', () => {
 
     // Then
     expect(response.status).toEqual(200)
+    expect(response.headers.delete).toBeCalled()
     expect(fetch).toHaveBeenCalledWith(
       'https://store.myshopify.com/products/1?_fd=0&pb=0&section_id=sections--1__announcement-bar',
       expect.objectContaining({
@@ -135,6 +138,7 @@ describe('render', () => {
 
     // Then
     expect(response.status).toEqual(200)
+    expect(response.headers.delete).toBeCalled()
     expect(fetch).toHaveBeenCalledWith(
       'https://store.myshopify.com/products/1?_fd=0&pb=0&app_block_id=00001111222233334444',
       expect.objectContaining({
@@ -162,6 +166,7 @@ describe('render', () => {
 
     // Then
     expect(response.status).toEqual(200)
+    expect(response.headers.delete).toBeCalled()
     expect(fetch).toHaveBeenCalledWith(
       'https://store.myshopify.com/products/1?_fd=0&pb=0&section_id=sections--1__announcement-bar',
       expect.objectContaining({
@@ -191,6 +196,7 @@ describe('render', () => {
 
     // Then
     expect(response.status).toEqual(200)
+    expect(response.headers.delete).toBeCalled()
     expect(fetch).toHaveBeenCalledWith(
       'https://store.myshopify.com/products/1?_fd=0&pb=0&value=A&value=B',
       expect.objectContaining({
diff --git a/packages/theme/src/cli/utilities/theme-environment/storefront-renderer.ts b/packages/theme/src/cli/utilities/theme-environment/storefront-renderer.ts
index ab04ec0ba5..f9b49f3abd 100644
--- a/packages/theme/src/cli/utilities/theme-environment/storefront-renderer.ts
+++ b/packages/theme/src/cli/utilities/theme-environment/storefront-renderer.ts
@@ -34,6 +34,13 @@ export async function render(session: DevServerSession, context: DevServerRender
   const requestId = response.headers.get('x-request-id')
   outputDebug(`← ${response.status} (request_id: ${requestId})`)
 
+  /**
+   * Theme Access app requests return the 'application/json' content type.
+   * However, patched renderings will never patch JSON requests; so we're
+   * consistently discarding the content type.
+   */
+  response.headers.delete('Content-Type')
+
   return response
 }