emberjs/ember.js

`{{debugger}}` in template-only glimmer components has a misleading DX

Chiusa

#17.962 aperta il 24 apr 2019

 (3 commenti) (1 reazione) (0 assegnatari)JavaScript (4216 fork)batch import
BugDocumentationHelp Wanted

Metriche repository

Star
 (22.437 stelle)
Metriche merge PR
 (Merge medio 11g 14h) (20 PR mergiate in 30 g)

Descrizione

When using {{debugger}} in template-only glimmer components, context is understandably null because there's no backing object (by design).

The user will see the following upon arriving at a breakpoint

The following DX issues need a little cleanup

  1. context no longer applies in this situation
  2. the "For example... context === get('this');" no longer applies in this situation

We may want to add something about get('@foo') to indicate the productive path for debugging these kinds of templates.

It might even be worth splitting this debugging path up (i.e., you'll end up in a template-only-specific debugger, or the standard debugger ) since, with the introduction of these components, the debugging mechanisms have diverged

  function templateWithBackingObjectDebugCallback(context, get) {
    console.info('Use `context`, and `get(<path>)` to debug this template.'); // for example...

    context === get('this');
    debugger;
  }

  function templateOnlyDebugCallback(get) {
    console.info('Use `get(<@path>)` to debug this template.'); 
    // for example... `get('@foo');`
    debugger;
  }

  function debugCallback(context, get) {
      if (context) templateWithBackingObjectDebugCallback(context, get);
      else templateOnlyDebugCallback(get);
  }


Guida contributor