fix(dev): only draw the startup QR code in a terminal

Author: danielroe

packages/nuxt-cli/src/dev/listen.ts

@@ -11,6 +11,7 @@ import process from 'node:process'
 
 import{styleText}from'node:util'
 import{getPort}from'get-port-please'
+import{isCI}from'std-env'
 
 import{ActionableError}from'../utils/errors'
 import{debug,logger}from'../utils/logger'
@@ -340,10 +341,11 @@ export async function createListener(bound: BoundServer, options: ListenOptions
 
 if(announce){
 if(options.showURL!==false){
-if(qrURL){
-awaitprintQRCode(qrURL)
+constshowQR=!!qrURL&&isQRCodeVisible()
+if(showQR){
+awaitprintQRCode(qrURL!)
 }
-showURLs({qr: !!qrURL})
+showURLs({qr: showQR})
 }
 
 if(options.clipboard){
@@ -529,6 +531,15 @@ function describeBindError(error: NodeJS.ErrnoException, port: number, hostname:
 returnerror
 }
 
+/**
+ * Whether block art is worth printing. A QR code is a couple of dozen lines of
+ * Unicode blocks that nothing downstream of a pipe can scan, so it is only
+ * drawn where someone is looking at a terminal.
+ */
+functionisQRCodeVisible(): boolean{
+return!!process.stdout.isTTY&&!isCI
+}
+
 exportasyncfunctionprintQRCode(url: string,{ showURL =false}: {showURL?: boolean}={}): Promise<void>{
 const{ renderUnicodeCompact }=awaitimport('uqr')
 constcaption=showURL ? `\n${centerBlock(styleText('cyan',url),url.length)}` : ''

packages/nuxt-cli/test/unit/listen.spec.ts

@@ -10,6 +10,11 @@ import { copyURL, formatDisplayURL, getNetworkAddresses, isReusePortSupported, l
 constwriteText=vi.hoisted(()=>vi.fn())
 constisolatedEnvironment=vi.hoisted(()=>({current: undefinedasstring|undefined}))
 
+vi.mock('std-env',asyncimportOriginal=>({
+ ...awaitimportOriginal<typeofimport('std-env')>(),
+isCI: false,
+}))
+
 vi.mock('tinyclip',()=>({ writeText }))
 vi.mock('../../src/dev/environment',()=>({
 detectIsolatedEnvironment: ()=>isolatedEnvironment.current,
@@ -234,6 +239,26 @@ describe('listen', () => {
 returnlistener
 }
 
+it('should not draw a QR code into output nothing can scan it from',async()=>{
+constlog=vi.spyOn(console,'log').mockImplementation(()=>{})
+constoriginalIsTTY=process.stdout.isTTY
+Object.defineProperty(process.stdout,'isTTY',{value: false,configurable: true})
+
+try{
+constlistener=awaitlisten((_req,res)=>res.end('ok'),{port: 0,hostname: '127.0.0.1',qr: true})
+listeners.push(listener)
+constprinted=log.mock.calls.map(([line])=>String(line)).join('\n')
+
+expect(printed).toContain('Local:')
+expect(printed).not.toContain('[QR code]')
+expect(printed).not.toMatch(/[\u2580-\u259F]/)
+}
+finally{
+Object.defineProperty(process.stdout,'isTTY',{value: originalIsTTY,configurable: true})
+log.mockRestore()
+}
+})
+
 it('should accept connections on both loopback addresses in an isolated environment',async()=>{
 isolatedEnvironment.current='the container'
 constlistener=awaitstart({port: 0})
@@ -356,12 +381,19 @@ describe('listener.close', () => {
 thrownewError('qr unavailable')
 },
 }))
+constoriginalIsTTY=process.stdout.isTTY
+Object.defineProperty(process.stdout,'isTTY',{value: true,configurable: true})
 
-awaitexpect(listen((_req,res)=>res.end('ok'),{port: 0,hostname: '127.0.0.1',tunnel: true,qr: true})).rejects.toThrow('qr unavailable')
+try{
+awaitexpect(listen((_req,res)=>res.end('ok'),{port: 0,hostname: '127.0.0.1',tunnel: true,qr: true})).rejects.toThrow('qr unavailable')
 
-expect(closeTunnel).toHaveBeenCalledTimes(1)
-vi.doUnmock('../../src/dev/tunnel')
-vi.doUnmock('uqr')
+expect(closeTunnel).toHaveBeenCalledTimes(1)
+}
+finally{
+Object.defineProperty(process.stdout,'isTTY',{value: originalIsTTY,configurable: true})
+vi.doUnmock('../../src/dev/tunnel')
+vi.doUnmock('uqr')
+}
 })
 
 it('should release the port when setup fails after binding',async()=>{