Can't patch Backbone model Of typescript app

[jklmli]

Getting this error when attempting to open up Marionette Inspector:

The model in question:

class State extends Backbone.Model implements AbstractAnalyzeQueryView.State {
  get query(): ListQuery { return this.get('query'); }
  set query(z: ListQuery) { this.set('query', z); }

  constructor(query: ListQuery = new ListQuery(BuiltInSegment.USER)) {
    super({
      query: query
    });
  }
}

When I log this inside the get query(), I get this.

This looks to be an issue with getters and setters. Does Marionette Inspector support these? Is it due to the way Typescript is compiling these?

[jasonLaster]

Honestly I'm not sure if the inspector supports typescript. There's an es6 fix on minor for example. Happy to pair tomorrow or next week and figure it out. Come to our gitter room, link is on the readme.

[gwynjudd]

How can I tell if this fix has made it into the extension I'm using? I have version 0.5.4 if that helps. I am hitting something that looks like a similar issue, but I don't really know how to tell.

[jasonLaster]

hey @gwynjudd mind running it locally and letting me know what you see https://github.com/marionettejs/marionette.inspector/blob/master/docs/developing_locally.md

[gwynjudd]

I get the same issue as I was seeing before (this is in backbone.marionette.js):

_getModule: function(parentModule, moduleName, app, def, args) {
  var options = _.extend({}, def);
  var ModuleClass = this.getClass(def);

  // Get an existing module of this name if we have one
  var module = parentModule[moduleName];

  if (!module) {
    // Create a new module if we don't have one
    module = new ModuleClass(moduleName, app, options);
    parentModule[moduleName] = module;
    // store the module on the parent
    parentModule.submodules[moduleName] = module; <---- ***
  }

  return module;
},

On the line I marked above, parentModule.submodules is undefined. parentModule is the prototype of my application class instance. The call stack shows that the extension is calling a property defined on my application class, but this is the prototype, not the actual instance:

        get sidebar(): Sidebar.SidebarController {
            return this.module("core.sidebar", null).sidebar;
        }

In the stack before this is a lot of function calls from the extension itself. Here is the top of the stack:

[gwynjudd]

After I let the debugger continue, the site loads ok. The Marionette tab in the developer tools shows this:

And then after a while this:

It never gets past the "Loading viewxx" stage when I select a view

[jasonLaster]

Application is important because that's how the views are found.

Try checking __agent to see if the views are saved.
I forgot the key that keeps all the components but there's a registry.

Thanks for the details , we'll get to the bottom of tyis

[gwynjudd]

@jasonLaster - what do I look at in __agent to see the views? Here is the top bit of __agent in the developer tools:

[jasonLaster]

Hi, sorry this was made private recently

__agent.getAppComponentsInfo('View')

[gwynjudd]

There appears to be nothing in there

[jasonLaster]

Hmm try looking at the region tree.

__agent.appObserver.regionTree()

I think.

[gwynjudd]

This appears to have the appropriate values:

It matches up with the structure of the main application region that we have