From f338316522369b4720f254be2082330df21e7e99 Mon Sep 17 00:00:00 2001 From: Josh Faigan Date: Mon, 25 Nov 2024 13:26:39 -0500 Subject: [PATCH] Add --silence flag to the theme dev commands This commit adds a `--silence` flag to the `theme dev` command. When this flag is passed, it will disable request logging. --- .changeset/modern-fans-buy.md | 5 ++++ .../interfaces/theme-dev.interface.ts | 6 +++++ .../generated/generated_docs_data.json | 11 +++++++- packages/cli/README.md | 5 +++- packages/cli/oclif.manifest.json | 14 ++++++++++ packages/theme/src/cli/commands/theme/dev.ts | 5 ++++ packages/theme/src/cli/services/dev.test.ts | 26 +++++++++++++++++++ packages/theme/src/cli/services/dev.ts | 2 ++ .../hot-reload/server.test.ts | 1 + .../cli/utilities/theme-environment/html.ts | 4 ++- .../cli/utilities/theme-environment/proxy.ts | 4 ++- .../theme-environment.test.ts | 1 + .../cli/utilities/theme-environment/types.ts | 5 ++++ .../theme-ext-environment/theme-ext-server.ts | 1 + 14 files changed, 86 insertions(+), 4 deletions(-) create mode 100644 .changeset/modern-fans-buy.md diff --git a/.changeset/modern-fans-buy.md b/.changeset/modern-fans-buy.md new file mode 100644 index 00000000000..134ac71b7d0 --- /dev/null +++ b/.changeset/modern-fans-buy.md @@ -0,0 +1,5 @@ +--- +'@shopify/theme': minor +--- + +Add silence flag to theme dev command to disable request logs diff --git a/docs-shopify.dev/commands/interfaces/theme-dev.interface.ts b/docs-shopify.dev/commands/interfaces/theme-dev.interface.ts index e8f131c9941..7b63b9f1aa0 100644 --- a/docs-shopify.dev/commands/interfaces/theme-dev.interface.ts +++ b/docs-shopify.dev/commands/interfaces/theme-dev.interface.ts @@ -75,6 +75,12 @@ export interface themedev { */ '--port '?: string + /** + * Disable request logs. + * @environment SHOPIFY_FLAG_SILENCE + */ + '--silence'?: '' + /** * Store URL. It can be the store prefix (example) or the full myshopify.com URL (example.myshopify.com, https://example.myshopify.com). * @environment SHOPIFY_FLAG_STORE diff --git a/docs-shopify.dev/generated/generated_docs_data.json b/docs-shopify.dev/generated/generated_docs_data.json index c725ab97c80..1dc53661246 100644 --- a/docs-shopify.dev/generated/generated_docs_data.json +++ b/docs-shopify.dev/generated/generated_docs_data.json @@ -5072,6 +5072,15 @@ "isOptional": true, "environmentValue": "SHOPIFY_FLAG_PORT" }, + { + "filePath": "docs-shopify.dev/commands/interfaces/theme-dev.interface.ts", + "syntaxKind": "PropertySignature", + "name": "--silence", + "value": "\"\"", + "description": "Disable request logs.", + "isOptional": true, + "environmentValue": "SHOPIFY_FLAG_SILENCE" + }, { "filePath": "docs-shopify.dev/commands/interfaces/theme-dev.interface.ts", "syntaxKind": "PropertySignature", @@ -5154,7 +5163,7 @@ "environmentValue": "SHOPIFY_FLAG_IGNORE" } ], - "value": "export interface themedev {\n /**\n * The environment to apply to the current command.\n * @environment SHOPIFY_FLAG_ENVIRONMENT\n */\n '-e, --environment '?: string\n\n /**\n * Set which network interface the web server listens on. The default value is 127.0.0.1.\n * @environment SHOPIFY_FLAG_HOST\n */\n '--host '?: string\n\n /**\n * Skip hot reloading any files that match the specified pattern.\n * @environment SHOPIFY_FLAG_IGNORE\n */\n '-x, --ignore '?: string\n\n /**\n * The live reload mode switches the server behavior when a file is modified:\n- hot-reload Hot reloads local changes to CSS and sections (default)\n- full-page Always refreshes the entire page\n- off Deactivate live reload\n * @environment SHOPIFY_FLAG_LIVE_RELOAD\n */\n '--live-reload '?: string\n\n /**\n * Disable color output.\n * @environment SHOPIFY_FLAG_NO_COLOR\n */\n '--no-color'?: ''\n\n /**\n * Prevents files from being deleted in the remote theme when a file has been deleted locally. This applies to files that are deleted while the command is running, and files that have been deleted locally before the command is run.\n * @environment SHOPIFY_FLAG_NODELETE\n */\n '-n, --nodelete'?: ''\n\n /**\n * The file path or URL. The file path is to a file that you want updated on idle. The URL path is where you want a webhook posted to report on file changes.\n * @environment SHOPIFY_FLAG_NOTIFY\n */\n '--notify '?: string\n\n /**\n * Hot reload only files that match the specified pattern.\n * @environment SHOPIFY_FLAG_ONLY\n */\n '-o, --only '?: string\n\n /**\n * Automatically launch the theme preview in your default web browser.\n * @environment SHOPIFY_FLAG_OPEN\n */\n '--open'?: ''\n\n /**\n * Password generated from the Theme Access app.\n * @environment SHOPIFY_CLI_THEME_TOKEN\n */\n '--password '?: string\n\n /**\n * The path to your theme directory.\n * @environment SHOPIFY_FLAG_PATH\n */\n '--path '?: string\n\n /**\n * Local port to serve theme preview from.\n * @environment SHOPIFY_FLAG_PORT\n */\n '--port '?: string\n\n /**\n * Store URL. It can be the store prefix (example) or the full myshopify.com URL (example.myshopify.com, https://example.myshopify.com).\n * @environment SHOPIFY_FLAG_STORE\n */\n '-s, --store '?: string\n\n /**\n * The password for storefronts with password protection.\n * @environment SHOPIFY_FLAG_STORE_PASSWORD\n */\n '--store-password '?: string\n\n /**\n * Theme ID or name of the remote theme.\n * @environment SHOPIFY_FLAG_THEME_ID\n */\n '-t, --theme '?: string\n\n /**\n * Synchronize Theme Editor updates in the local theme files.\n * @environment SHOPIFY_FLAG_THEME_EDITOR_SYNC\n */\n '--theme-editor-sync'?: ''\n\n /**\n * Increase the verbosity of the output.\n * @environment SHOPIFY_FLAG_VERBOSE\n */\n '--verbose'?: ''\n}" + "value": "export interface themedev {\n /**\n * The environment to apply to the current command.\n * @environment SHOPIFY_FLAG_ENVIRONMENT\n */\n '-e, --environment '?: string\n\n /**\n * Set which network interface the web server listens on. The default value is 127.0.0.1.\n * @environment SHOPIFY_FLAG_HOST\n */\n '--host '?: string\n\n /**\n * Skip hot reloading any files that match the specified pattern.\n * @environment SHOPIFY_FLAG_IGNORE\n */\n '-x, --ignore '?: string\n\n /**\n * The live reload mode switches the server behavior when a file is modified:\n- hot-reload Hot reloads local changes to CSS and sections (default)\n- full-page Always refreshes the entire page\n- off Deactivate live reload\n * @environment SHOPIFY_FLAG_LIVE_RELOAD\n */\n '--live-reload '?: string\n\n /**\n * Disable color output.\n * @environment SHOPIFY_FLAG_NO_COLOR\n */\n '--no-color'?: ''\n\n /**\n * Prevents files from being deleted in the remote theme when a file has been deleted locally. This applies to files that are deleted while the command is running, and files that have been deleted locally before the command is run.\n * @environment SHOPIFY_FLAG_NODELETE\n */\n '-n, --nodelete'?: ''\n\n /**\n * The file path or URL. The file path is to a file that you want updated on idle. The URL path is where you want a webhook posted to report on file changes.\n * @environment SHOPIFY_FLAG_NOTIFY\n */\n '--notify '?: string\n\n /**\n * Hot reload only files that match the specified pattern.\n * @environment SHOPIFY_FLAG_ONLY\n */\n '-o, --only '?: string\n\n /**\n * Automatically launch the theme preview in your default web browser.\n * @environment SHOPIFY_FLAG_OPEN\n */\n '--open'?: ''\n\n /**\n * Password generated from the Theme Access app.\n * @environment SHOPIFY_CLI_THEME_TOKEN\n */\n '--password '?: string\n\n /**\n * The path to your theme directory.\n * @environment SHOPIFY_FLAG_PATH\n */\n '--path '?: string\n\n /**\n * Local port to serve theme preview from.\n * @environment SHOPIFY_FLAG_PORT\n */\n '--port '?: string\n\n /**\n * Disable request logs.\n * @environment SHOPIFY_FLAG_SILENCE\n */\n '--silence'?: ''\n\n /**\n * Store URL. It can be the store prefix (example) or the full myshopify.com URL (example.myshopify.com, https://example.myshopify.com).\n * @environment SHOPIFY_FLAG_STORE\n */\n '-s, --store '?: string\n\n /**\n * The password for storefronts with password protection.\n * @environment SHOPIFY_FLAG_STORE_PASSWORD\n */\n '--store-password '?: string\n\n /**\n * Theme ID or name of the remote theme.\n * @environment SHOPIFY_FLAG_THEME_ID\n */\n '-t, --theme '?: string\n\n /**\n * Synchronize Theme Editor updates in the local theme files.\n * @environment SHOPIFY_FLAG_THEME_EDITOR_SYNC\n */\n '--theme-editor-sync'?: ''\n\n /**\n * Increase the verbosity of the output.\n * @environment SHOPIFY_FLAG_VERBOSE\n */\n '--verbose'?: ''\n}" } } } diff --git a/packages/cli/README.md b/packages/cli/README.md index ca7521e5ea2..016374afc2b 100644 --- a/packages/cli/README.md +++ b/packages/cli/README.md @@ -1799,7 +1799,7 @@ Uploads the current theme as a development theme to the connected store, then pr USAGE $ shopify theme dev [-e ] [--host ] [-x ] [--live-reload hot-reload|full-page|off] [--no-color] [-n] [--notify ] [-o ] [--open] [--password ] [--path ] [--port ] - [-s ] [--store-password ] [-t ] [--theme-editor-sync] [--verbose] + [--silence] [-s ] [--store-password ] [-t ] [--theme-editor-sync] [--verbose] FLAGS -e, --environment= @@ -1851,6 +1851,9 @@ FLAGS --port= Local port to serve theme preview from. + --silence + Disable request logs. + --store-password= The password for storefronts with password protection. diff --git a/packages/cli/oclif.manifest.json b/packages/cli/oclif.manifest.json index e565cdfdbf6..8d6ac05002e 100644 --- a/packages/cli/oclif.manifest.json +++ b/packages/cli/oclif.manifest.json @@ -5265,6 +5265,13 @@ "name": "port", "type": "option" }, + "silence": { + "allowNo": false, + "description": "Disable request logs.", + "env": "SHOPIFY_FLAG_SILENCE", + "name": "silence", + "type": "boolean" + }, "store": { "char": "s", "description": "Store URL. It can be the store prefix (example) or the full myshopify.com URL (example.myshopify.com, https://example.myshopify.com).", @@ -6359,6 +6366,13 @@ "name": "port", "type": "option" }, + "silence": { + "allowNo": false, + "description": "Disable request logs.", + "env": "SHOPIFY_FLAG_SILENCE", + "name": "silence", + "type": "boolean" + }, "store": { "char": "s", "description": "Store URL. It can be the store prefix (example) or the full myshopify.com URL (example.myshopify.com, https://example.myshopify.com).", diff --git a/packages/theme/src/cli/commands/theme/dev.ts b/packages/theme/src/cli/commands/theme/dev.ts index c137bf671a7..9ee79f7c6c1 100644 --- a/packages/theme/src/cli/commands/theme/dev.ts +++ b/packages/theme/src/cli/commands/theme/dev.ts @@ -112,6 +112,10 @@ You can run this command only in a directory that matches the [default Shopify t description: 'The password for storefronts with password protection.', env: 'SHOPIFY_FLAG_STORE_PASSWORD', }), + silence: Flags.boolean({ + description: 'Disable request logs.', + env: 'SHOPIFY_FLAG_SILENCE', + }), } async run(): Promise { @@ -153,6 +157,7 @@ You can run this command only in a directory that matches the [default Shopify t ignore, only, notify: flags.notify, + silence: flags.silence, }) } } diff --git a/packages/theme/src/cli/services/dev.test.ts b/packages/theme/src/cli/services/dev.test.ts index 63d3ec8efee..bb5d8617430 100644 --- a/packages/theme/src/cli/services/dev.test.ts +++ b/packages/theme/src/cli/services/dev.test.ts @@ -7,6 +7,7 @@ import {ensureValidPassword} from '../utilities/theme-environment/storefront-pas import {emptyThemeExtFileSystem} from '../utilities/theme-fs-empty.js' import {initializeDevServerSession} from '../utilities/theme-environment/dev-server-session.js' import {DevServerSession} from '../utilities/theme-environment/types.js' +import {logRequestLine} from '../utilities/log-request-line.js' import {describe, expect, test, vi} from 'vitest' import {buildTheme} from '@shopify/cli-kit/node/themes/factories' import {DEVELOPMENT_THEME_ROLE} from '@shopify/cli-kit/node/themes/utils' @@ -22,6 +23,7 @@ vi.mock('../utilities/theme-environment/storefront-session.js') vi.mock('../utilities/theme-environment/theme-environment.js') vi.mock('../utilities/theme-fs-empty.js') vi.mock('../utilities/theme-fs.js') +vi.mock('../utilities/log-request-line.js') vi.mock('@shopify/cli-kit/node/colors', () => ({ default: { bold: (str: string) => str, @@ -101,11 +103,35 @@ describe('dev', () => { ignore: [], noDelete: false, only: [], + silence: false, }, }) }) }) + test('does not log requests and responses when the `-silence` option is true', async () => { + // Given + vi.mocked(initializeDevServerSession).mockResolvedValue(session) + vi.mocked(isStorefrontPasswordProtected).mockResolvedValue(false) + vi.mocked(mountThemeFileSystem).mockReturnValue(localThemeFileSystem) + vi.mocked(emptyThemeExtFileSystem).mockReturnValue(localThemeExtensionFileSystem) + vi.mocked(logRequestLine).mockReturnValue(undefined) + vi.mocked(setupDevServer).mockReturnValue({ + workPromise: Promise.resolve(), + renderDevSetupProgress: () => Promise.resolve(), + dispatchEvent: () => {}, + serverStart: async () => ({close: async () => {}}), + }) + + const devOptions = {...options, silence: true} + + // When + await dev(devOptions) + + // Then + expect(logRequestLine).not.toHaveBeenCalled() + }) + test('renders "dev" command links', async () => { // Given const themeId = theme.id.toString() diff --git a/packages/theme/src/cli/services/dev.ts b/packages/theme/src/cli/services/dev.ts index 9223b4633df..5357c6dbe63 100644 --- a/packages/theme/src/cli/services/dev.ts +++ b/packages/theme/src/cli/services/dev.ts @@ -35,6 +35,7 @@ export interface DevOptions { ignore: string[] only: string[] notify?: string + silence?: boolean } export async function dev(options: DevOptions) { @@ -91,6 +92,7 @@ export async function dev(options: DevOptions) { noDelete: options.noDelete, ignore: options.ignore, only: options.only, + silence: options.silence ?? false, }, } diff --git a/packages/theme/src/cli/utilities/theme-environment/hot-reload/server.test.ts b/packages/theme/src/cli/utilities/theme-environment/hot-reload/server.test.ts index 6c66b4b745b..4ec1800aaaf 100644 --- a/packages/theme/src/cli/utilities/theme-environment/hot-reload/server.test.ts +++ b/packages/theme/src/cli/utilities/theme-environment/hot-reload/server.test.ts @@ -330,6 +330,7 @@ function createTestContext(options?: {files?: [string, string][]}) { liveReload: 'hot-reload', open: false, themeEditorSync: false, + silence: false, }, } diff --git a/packages/theme/src/cli/utilities/theme-environment/html.ts b/packages/theme/src/cli/utilities/theme-environment/html.ts index 8e6097da653..83cebe75a4f 100644 --- a/packages/theme/src/cli/utilities/theme-environment/html.ts +++ b/packages/theme/src/cli/utilities/theme-environment/html.ts @@ -25,7 +25,9 @@ export function getHtmlHandler(theme: Theme, ctx: DevServerContext) { replaceTemplates: getInMemoryTemplates(ctx, browserPathname, getCookie(event, 'localization')?.toLowerCase()), }) .then(async (response) => { - logRequestLine(event, response) + if (!ctx.options.silence) { + logRequestLine(event, response) + } let html = await patchRenderingResponse(ctx, event, response) diff --git a/packages/theme/src/cli/utilities/theme-environment/proxy.ts b/packages/theme/src/cli/utilities/theme-environment/proxy.ts index 9c71219f44b..f802d4f86bc 100644 --- a/packages/theme/src/cli/utilities/theme-environment/proxy.ts +++ b/packages/theme/src/cli/utilities/theme-environment/proxy.ts @@ -272,7 +272,9 @@ function proxyStorefrontRequest(event: H3Event, ctx: DevServerContext) { redirect: 'manual', }, async onResponse(event, response) { - logRequestLine(event, response) + if (!ctx.options.silence) { + logRequestLine(event, response) + } patchProxiedResponseHeaders(ctx, event, response) diff --git a/packages/theme/src/cli/utilities/theme-environment/theme-environment.test.ts b/packages/theme/src/cli/utilities/theme-environment/theme-environment.test.ts index 355665ccf1f..692c308df95 100644 --- a/packages/theme/src/cli/utilities/theme-environment/theme-environment.test.ts +++ b/packages/theme/src/cli/utilities/theme-environment/theme-environment.test.ts @@ -96,6 +96,7 @@ describe('setupDevServer', () => { liveReload: 'hot-reload', open: false, themeEditorSync: false, + silence: false, }, } diff --git a/packages/theme/src/cli/utilities/theme-environment/types.ts b/packages/theme/src/cli/utilities/theme-environment/types.ts index b9d21b0b9ee..e2d09c46a85 100644 --- a/packages/theme/src/cli/utilities/theme-environment/types.ts +++ b/packages/theme/src/cli/utilities/theme-environment/types.ts @@ -117,6 +117,11 @@ export interface DevServerContext { * Automatically open the theme preview in the default browser. */ open: boolean + + /** + * Disable request logs. + */ + silence: boolean } } diff --git a/packages/theme/src/cli/utilities/theme-ext-environment/theme-ext-server.ts b/packages/theme/src/cli/utilities/theme-ext-environment/theme-ext-server.ts index 4dea217cf48..cd9ea9c7d2f 100644 --- a/packages/theme/src/cli/utilities/theme-ext-environment/theme-ext-server.ts +++ b/packages/theme/src/cli/utilities/theme-ext-environment/theme-ext-server.ts @@ -90,6 +90,7 @@ async function contextDevServerContext( port: port.toString(), liveReload: 'hot-reload', open: false, + silence: false, }, } }