diff --git a/.changeset/orange-boxes-unite.md b/.changeset/orange-boxes-unite.md new file mode 100644 index 00000000000..041a2e84d67 --- /dev/null +++ b/.changeset/orange-boxes-unite.md @@ -0,0 +1,5 @@ +--- +'@shopify/app': patch +--- + +Add --host flag to shopify app dev command for Docker container development diff --git a/docs-shopify.dev/commands/interfaces/app-dev.interface.ts b/docs-shopify.dev/commands/interfaces/app-dev.interface.ts index c06ef81e1c0..a0f665fc38e 100644 --- a/docs-shopify.dev/commands/interfaces/app-dev.interface.ts +++ b/docs-shopify.dev/commands/interfaces/app-dev.interface.ts @@ -18,6 +18,12 @@ export interface appdev { */ '-c, --config '?: string + /** + * Set which network interface the web server listens on. The default value is 127.0.0.1. + * @environment SHOPIFY_FLAG_HOST + */ + '--host '?: string + /** * Port to use for localhost. * @environment SHOPIFY_FLAG_LOCALHOST_PORT diff --git a/packages/app/src/cli/commands/app/dev.ts b/packages/app/src/cli/commands/app/dev.ts index 72a46c3b07e..148cac7addb 100644 --- a/packages/app/src/cli/commands/app/dev.ts +++ b/packages/app/src/cli/commands/app/dev.ts @@ -88,9 +88,9 @@ If you're using the Ruby app template, then you need to complete the following s exclusive: ['tunnel-url'], }), host: Flags.string({ - description: 'Set which network interface the web server listens on. The default value is localhost.', + description: 'Set which network interface the web server listens on. The default value is 127.0.0.1.', env: 'SHOPIFY_FLAG_HOST', - default: 'localhost', + default: '127.0.0.1', }), 'localhost-port': Flags.integer({ description: 'Port to use for localhost.', diff --git a/packages/app/src/cli/services/dev/processes/setup-dev-processes.test.ts b/packages/app/src/cli/services/dev/processes/setup-dev-processes.test.ts index eb1d0dd8ca1..35b4197e54a 100644 --- a/packages/app/src/cli/services/dev/processes/setup-dev-processes.test.ts +++ b/packages/app/src/cli/services/dev/processes/setup-dev-processes.test.ts @@ -95,7 +95,7 @@ describe('setup-dev-processes', () => { commandConfig: new Config({root: ''}), skipDependenciesInstallation: false, tunnel: {mode: 'auto'}, - host: 'localhost', + host: '127.0.0.1', } const network: DevConfig['network'] = { proxyUrl: 'https://example.com/proxy', @@ -289,7 +289,7 @@ describe('setup-dev-processes', () => { cert: 'cert', key: 'key', }, - host: 'localhost', + host: '127.0.0.1', rules: { '/extensions': `http://localhost:${previewExtensionPort}`, '/ping': `http://localhost:${hmrPort}`, @@ -301,7 +301,7 @@ describe('setup-dev-processes', () => { }) test('proxy server process includes host parameter when configured for Docker', async () => { - // Given + // Given const developerPlatformClient: DeveloperPlatformClient = testDeveloperPlatformClient({supportsDevSessions: false}) const storeFqdn = 'store.myshopify.io' const storeId = '123456789' @@ -331,23 +331,25 @@ describe('setup-dev-processes', () => { certPath: 'path', }, } - + // Create simple app without theme extensions to avoid the theme API calls const localApp = testAppWithConfig({ config: {}, app: testAppLinked({ allExtensions: [await testUIExtension({type: 'web_pixel_extension'})], - webs: [{ - directory: 'web', - configuration: { - roles: [WebType.Backend, WebType.Frontend], - commands: {dev: 'npm exec remix dev'}, - webhooks_path: '/webhooks', - hmr_server: { - http_paths: ['/ping'], + webs: [ + { + directory: 'web', + configuration: { + roles: [WebType.Backend, WebType.Frontend], + commands: {dev: 'npm exec remix dev'}, + webhooks_path: '/webhooks', + hmr_server: { + http_paths: ['/ping'], + }, }, }, - }], + ], }), }) vi.spyOn(loader, 'reloadApp').mockResolvedValue(localApp) @@ -384,7 +386,7 @@ describe('setup-dev-processes', () => { commandConfig: new Config({root: ''}), skipDependenciesInstallation: false, tunnel: {mode: 'auto'}, - host: 'localhost', + host: '127.0.0.1', } const network: DevConfig['network'] = { proxyUrl: 'https://example.com/proxy', @@ -458,7 +460,7 @@ describe('setup-dev-processes', () => { commandConfig: new Config({root: ''}), skipDependenciesInstallation: false, tunnel: {mode: 'auto'}, - host: 'localhost', + host: '127.0.0.1', } const network: DevConfig['network'] = { proxyUrl: 'https://example.com/proxy', @@ -555,7 +557,7 @@ describe('setup-dev-processes', () => { commandConfig: new Config({root: ''}), skipDependenciesInstallation: false, tunnel: {mode: 'auto'}, - host: 'localhost', + host: '127.0.0.1', } const network: DevConfig['network'] = { proxyUrl: 'https://example.com/proxy', @@ -642,7 +644,7 @@ describe('setup-dev-processes', () => { commandConfig: new Config({root: ''}), skipDependenciesInstallation: false, tunnel: {mode: 'auto'}, - host: 'localhost', + host: '127.0.0.1', } const network: DevConfig['network'] = { proxyUrl: 'https://example.com/proxy', diff --git a/packages/app/src/cli/services/dev/processes/setup-dev-processes.ts b/packages/app/src/cli/services/dev/processes/setup-dev-processes.ts index 6c105b94975..c4ca4e44562 100644 --- a/packages/app/src/cli/services/dev/processes/setup-dev-processes.ts +++ b/packages/app/src/cli/services/dev/processes/setup-dev-processes.ts @@ -202,7 +202,12 @@ export async function setupDevProcesses({ ].filter(stripUndefineds) // Add http server proxy & configure ports, for processes that need it - const processesWithProxy = await setPortsAndAddProxyProcess(processes, network.proxyPort, network.reverseProxyCert, commandOptions) + const processesWithProxy = await setPortsAndAddProxyProcess( + processes, + network.proxyPort, + network.reverseProxyCert, + commandOptions, + ) return { processes: processesWithProxy, diff --git a/packages/cli/README.md b/packages/cli/README.md index b1c62d46e46..79cfada3540 100644 --- a/packages/cli/README.md +++ b/packages/cli/README.md @@ -224,8 +224,8 @@ FLAGS --checkout-cart-url= Resource URL for checkout UI extension. Format: "/cart/{productVariantID}:{productQuantity}" --client-id= The Client ID of your app. - --host= [default: localhost] Set which network interface the web server listens on. - The default value is localhost. + --host= [default: 127.0.0.1] Set which network interface the web server listens on. + The default value is 127.0.0.1. --localhost-port= Port to use for localhost. --no-color Disable color output. --no-update Skips the Partners Dashboard URL update step. diff --git a/packages/cli/oclif.manifest.json b/packages/cli/oclif.manifest.json index 971f4be6ace..cafbd0884b4 100644 --- a/packages/cli/oclif.manifest.json +++ b/packages/cli/oclif.manifest.json @@ -460,8 +460,8 @@ "type": "option" }, "host": { - "default": "localhost", - "description": "Set which network interface the web server listens on. The default value is localhost.", + "default": "127.0.0.1", + "description": "Set which network interface the web server listens on. The default value is 127.0.0.1.", "env": "SHOPIFY_FLAG_HOST", "hasDynamicHelp": false, "multiple": false,