emberjs/ember.js

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

Fermée

#17 962 ouverte le 24 avr. 2019

 (3 commentaires) (1 réaction) (0 personne assignée)JavaScript (4 216 forks)batch import
BugDocumentationHelp Wanted

Métriques du dépôt

Stars
 (22 437 étoiles)
Métriques de merge PR
 (Merge moyen 11j 14h) (20 PRs mergées en 30 j)

Description

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);
  }


Guide contributeur