create-mercato-app 0.5.1-develop.2965.38737e655d → 0.5.1-develop.2972.6c5cd4a1c3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-mercato-app",
-  "version": "0.5.1-develop.2965.38737e655d",
+  "version": "0.5.1-develop.2972.6c5cd4a1c3",
   "type": "module",
   "description": "Create a new Open Mercato application",
   "main": "./dist/index.js",

package/template/scripts/dev-splash-url.mjs

@@ -0,0 +1,192 @@
+// Reusable URL helpers for dev splash variants (monorepo dev orchestrator,
+// ephemeral dev runtime, and the standalone create-app template). Pure ESM,
+// dependency-free so the dev scripts can use it before `yarn install` runs.
+//
+// All splash variants share the same problem: they used to hardcode
+// `http://localhost:<port>` / `http://127.0.0.1:<port>` for both the
+// splash URL and the printed app URL. When a developer runs the dev
+// runtime behind a reverse proxy (for example on
+// `https://devsandbox.openmercato.com`), the printed URLs and any
+// redirects must follow the configured public base URL, drop standard
+// ports for the scheme (80 for `http:`, 443 for `https:`), and only
+// fall back to the actually-bound port when the configured port was
+// taken and the runtime had to randomize.
+
+const STANDARD_PORT_BY_SCHEME = Object.freeze({
+  'http:': 80,
+  'https:': 443,
+})
+
+const LOOPBACK_HOSTS = new Set(['localhost', '127.0.0.1', '::1', '0.0.0.0'])
+
+export function parsePortNumber(value) {
+  if (typeof value !== 'string' && typeof value !== 'number') return null
+  const parsed = Number.parseInt(String(value).trim(), 10)
+  if (!Number.isInteger(parsed) || parsed < 1 || parsed > 65535) {
+    return null
+  }
+  return parsed
+}
+
+export function isStandardPort(scheme, port) {
+  if (port === null || port === undefined) return false
+  const normalized = typeof scheme === 'string' && !scheme.endsWith(':') ? `${scheme}:` : scheme
+  const expected = STANDARD_PORT_BY_SCHEME[normalized]
+  return expected !== undefined && Number(port) === expected
+}
+
+export function parseConfiguredBaseUrl(value) {
+  if (typeof value !== 'string') return null
+  const trimmed = value.trim()
+  if (!trimmed) return null
+  let parsed
+  try {
+    parsed = new URL(trimmed)
+  } catch {
+    return null
+  }
+  if (parsed.protocol !== 'http:' && parsed.protocol !== 'https:') return null
+  const explicitPort = parsed.port ? Number.parseInt(parsed.port, 10) : null
+  return {
+    protocol: parsed.protocol,
+    hostname: parsed.hostname,
+    port: Number.isInteger(explicitPort) ? explicitPort : null,
+  }
+}
+
+export function formatBaseUrl({ protocol, hostname, port } = {}, options = {}) {
+  if (typeof protocol !== 'string' || !protocol || typeof hostname !== 'string' || !hostname) {
+    throw new TypeError('formatBaseUrl requires a protocol and hostname')
+  }
+  const normalizedScheme = protocol.endsWith(':') ? protocol : `${protocol}:`
+  const includeStandardPort = options.includeStandardPort === true
+  const formattedHost = hostname.includes(':') && !hostname.startsWith('[')
+    ? `[${hostname}]`
+    : hostname
+  if (port === null || port === undefined) {
+    return `${normalizedScheme}//${formattedHost}`
+  }
+  if (!includeStandardPort && isStandardPort(normalizedScheme, port)) {
+    return `${normalizedScheme}//${formattedHost}`
+  }
+  return `${normalizedScheme}//${formattedHost}:${port}`
+}
+
+function pickConfiguredFromEnv(env) {
+  return parseConfiguredBaseUrl(env?.APP_URL) ?? parseConfiguredBaseUrl(env?.NEXT_PUBLIC_APP_URL)
+}
+
+// Resolve the developer-facing app base URL.
+//
+// Inputs:
+//   env: process.env-like object. Reads APP_URL, NEXT_PUBLIC_APP_URL, PORT.
+//   options.actualPort: the port the dev server actually bound to. When the
+//     configured port was already in use, this differs from the configured
+//     value -- in that case we treat the run as randomized and surface the
+//     actually-bound port so the printed URL is reachable.
+//   options.defaultPort: the port to assume when nothing else is configured
+//     (defaults to 3000, matching Next.js dev defaults).
+//   options.defaultHostname: fallback hostname when no APP_URL is configured
+//     (defaults to 'localhost').
+//
+// Returns:
+//   { url, protocol, hostname, port, hasConfiguredBaseUrl, portWasRandomized }
+//   `port` is null when the URL omits an explicit port.
+export function resolveDevBaseUrl(env = {}, options = {}) {
+  const actualPort = Number.isInteger(options.actualPort) ? options.actualPort : null
+  const defaultPort = Number.isInteger(options.defaultPort) ? options.defaultPort : 3000
+  const defaultHostname = typeof options.defaultHostname === 'string' && options.defaultHostname
+    ? options.defaultHostname
+    : 'localhost'
+
+  const configured = pickConfiguredFromEnv(env)
+  const envPort = parsePortNumber(env?.PORT)
+
+  let protocol
+  let hostname
+  let configuredPort
+
+  if (configured) {
+    protocol = configured.protocol
+    hostname = configured.hostname
+    configuredPort = configured.port ?? envPort
+  } else {
+    protocol = 'http:'
+    hostname = defaultHostname
+    configuredPort = envPort
+  }
+
+  let resolvedPort
+  let portWasRandomized = false
+  const isLoopbackHost = LOOPBACK_HOSTS.has(hostname.toLowerCase())
+
+  if (actualPort !== null) {
+    if (configured && !isLoopbackHost) {
+      // Proxy-fronted dev: the developer reaches the app via the configured
+      // public URL. `actualPort` is the internal port the local dev server
+      // bound to, which is hidden behind the proxy and must never leak into
+      // the printed URL -- regardless of whether the configured URL declared
+      // an explicit port or not.
+      resolvedPort = configuredPort
+    } else if (configuredPort !== null && configuredPort !== actualPort) {
+      // Loopback dev: the configured port was taken and the runtime fell back
+      // to a free one. The printed URL must reflect what the developer can
+      // actually open.
+      resolvedPort = actualPort
+      portWasRandomized = true
+    } else if (configuredPort !== null) {
+      resolvedPort = configuredPort
+    } else {
+      resolvedPort = actualPort
+    }
+  } else if (configuredPort !== null) {
+    resolvedPort = configuredPort
+  } else if (configured) {
+    resolvedPort = null
+  } else {
+    resolvedPort = defaultPort
+  }
+
+  if (resolvedPort !== null && isStandardPort(protocol, resolvedPort)) {
+    resolvedPort = null
+  }
+
+  const url = formatBaseUrl({ protocol, hostname, port: resolvedPort })
+
+  return {
+    url,
+    protocol,
+    hostname,
+    port: resolvedPort,
+    hasConfiguredBaseUrl: configured !== null,
+    portWasRandomized,
+  }
+}
+
+// Resolve the URL where the dev splash itself can be reached. The splash
+// process always binds locally, but the developer's browser may live on
+// the configured public host (proxy-fronted dev sandboxes). We keep the
+// scheme + hostname from the configured public URL when it exists so the
+// splash link the developer sees uses the same origin as the rest of the
+// app, and we always attach the actually-bound splash port so the link
+// resolves regardless of what the configured port was.
+export function resolveSplashUrl(env = {}, splashPort, options = {}) {
+  const port = Number.isInteger(splashPort) ? splashPort : null
+  const configured = pickConfiguredFromEnv(env)
+  const defaultHostname = typeof options.defaultHostname === 'string' && options.defaultHostname
+    ? options.defaultHostname
+    : 'localhost'
+
+  if (!configured) {
+    if (port === null) {
+      return formatBaseUrl({ protocol: 'http:', hostname: defaultHostname, port: null })
+    }
+    return formatBaseUrl({ protocol: 'http:', hostname: defaultHostname, port })
+  }
+
+  if (port === null) {
+    return formatBaseUrl({ protocol: configured.protocol, hostname: configured.hostname, port: null })
+  }
+
+  return formatBaseUrl({ protocol: configured.protocol, hostname: configured.hostname, port })
+}

package/template/scripts/dev.mjs

@@ -26,6 +26,10 @@ import { resolveSpawnCommand } from './dev-spawn-utils.mjs'
 import { createDevSplashCodingFlow } from './dev-splash-coding-flow.mjs'
 import { createDevSplashGitRepoFlow } from './dev-splash-git-repo-flow.mjs'
 import { normalizeSplashDisplayState } from './dev-splash-state.mjs'
+import {
+  resolveDevBaseUrl,
+  resolveSplashUrl as resolveSplashAccessUrl,
+} from './dev-splash-url.mjs'
 
 function detectDevRuntimeMode() {
   const cwd = process.cwd()
@@ -155,20 +159,6 @@ function shouldRetrySplashServerWithRandomPort(error) {
   return error.code === 'EADDRINUSE'
 }
 
-function normalizePublicBaseUrl(value) {
-  if (typeof value !== 'string' || value.trim().length === 0) return null
-
-  try {
-    const parsed = new URL(value)
-    parsed.pathname = ''
-    parsed.search = ''
-    parsed.hash = ''
-    return parsed.toString().replace(/\/$/, '')
-  } catch {
-    return null
-  }
-}
-
 function isEnabledEnvFlag(value) {
   if (typeof value !== 'string') return false
   return ['1', 'true', 'yes', 'on'].includes(value.trim().toLowerCase())
@@ -303,9 +293,7 @@ function formatProgressLine(label, current, total, percent) {
 }
 
 function resolveExpectedAppBaseUrl() {
-  return normalizePublicBaseUrl(process.env.APP_URL)
-    ?? normalizePublicBaseUrl(process.env.NEXT_PUBLIC_APP_URL)
-    ?? `http://localhost:${parsePortNumber(process.env.PORT) ?? 3000}`
+  return resolveDevBaseUrl(process.env).url
 }
 
 function resolveExpectedBackendUrl() {
@@ -924,7 +912,7 @@ async function startSplashServer() {
 
   const address = splashServer.address()
   if (!address || typeof address === 'string') return
-  splashUrl = `http://localhost:${address.port}`
+  splashUrl = resolveSplashAccessUrl(process.env, address.port)
   if (splashPortConfig.port !== 0 && address.port !== splashPortConfig.port) {
     console.log(`🪟 Dev splash moved to ${splashUrl}`)
   }