diff --git a/packages/@glimmer-workspace/integration-tests/lib/suites/debugger.ts b/packages/@glimmer-workspace/integration-tests/lib/suites/debugger.ts index 466d19a5755..87fb7debc5d 100644 --- a/packages/@glimmer-workspace/integration-tests/lib/suites/debugger.ts +++ b/packages/@glimmer-workspace/integration-tests/lib/suites/debugger.ts @@ -87,6 +87,61 @@ export class DebuggerSuite extends RenderTest { this.assertStableNodes(); } + @test({ kind: 'templateOnly' }) + 'debugger in template-only component logs template-only message'() { + let originalInfo = console.info; + let messages: string[] = []; + + console.info = (...args: unknown[]) => { + messages.push(args.join(' ')); + }; + + try { + resetDebuggerCallback(); + + this.registerComponent('TemplateOnly', 'DebugTest', '{{debugger}}'); + + this.render('', {}); + + this.assert.deepEqual(messages, [ + "Use `get()` to debug this template. For named arguments, use `get('@argName')`.", + ]); + } finally { + console.info = originalInfo; + resetDebuggerCallback(); + } + } + + @test + 'debugger in class-backed component logs context message with named argument hint'() { + let originalInfo = console.info; + let messages: string[] = []; + + console.info = (...args: unknown[]) => { + messages.push(args.join(' ')); + }; + + try { + resetDebuggerCallback(); + + this.registerComponent( + 'Glimmer', + 'DebugTest', + '{{debugger}}', + class extends GlimmerishComponent {} + ); + + this.render('', {}); + + this.assert.deepEqual(messages, [ + "Use `context`, and `get()` to debug this template. For named arguments, use `get('@argName')`.", + ]); + } finally { + console.info = originalInfo; + resetDebuggerCallback(); + } + } + @test 'can get locals'() { let expectedContext = { diff --git a/packages/@glimmer/runtime/lib/compiled/opcodes/debugger.ts b/packages/@glimmer/runtime/lib/compiled/opcodes/debugger.ts index 7d1c46ce3c6..3a264f4ba6d 100644 --- a/packages/@glimmer/runtime/lib/compiled/opcodes/debugger.ts +++ b/packages/@glimmer/runtime/lib/compiled/opcodes/debugger.ts @@ -14,11 +14,20 @@ export type DebugGet = (path: string) => unknown; export type DebugCallback = (context: unknown, get: DebugGet) => void; function debugCallback(context: unknown, get: DebugGet): void { - // eslint-disable-next-line no-console - console.info('Use `context`, and `get()` to debug this template.'); - - // for example... - context === get('this'); + if (context !== null && context !== undefined) { + // eslint-disable-next-line no-console + console.info( + "Use `context`, and `get()` to debug this template. For named arguments, use `get('@argName')`." + ); + + // for example... + context === get('this'); + } else { + // eslint-disable-next-line no-console + console.info( + "Use `get()` to debug this template. For named arguments, use `get('@argName')`." + ); + } // eslint-disable-next-line no-debugger debugger;