timstuyckens/chromeextensions-knockoutjs

Incompatible with knockout repeating binding

Closed this issue · 1 comments

Hi,

Great tool - I've started exploring its use but ran into an issue. The knockout repeat binding handler (https://github.com/mbest/knockout-repeat) doesn't play nice with this extension. It's not either side's fault - just a tricky corner case :)

I've done a bit of digging in the code and found the issue.
https://github.com/timstuyckens/chromeextensions-knockoutjs/blob/master/pages/js/devtools.js#L53

On line 53 there's a check to see if the property being read is called $index. The repeat binding handler, by default, creates a variable in knockout's binding context called $index to indicate what index you're up to when repeating. However it's not a function so the following line
https://github.com/timstuyckens/chromeextensions-knockoutjs/blob/master/pages/js/devtools.js#L54
crashes.

I fixed it temporarily in the Chrome debugger by amending the if statement to also check to see if $index is a function.

Another fix can be made in my own code using the repeat binding.
Instead of

That means it will no longer create a variable in the binding context called $index.

As an aside, when the display is working properly using either of the fixes above it's then tricky to explore the contents of $arrayItem since it's just displayed as a function. The only way I've found to explore its contents is to right-click it and put it in the console as a variable (which will be a function) and then execute that variable/function in the console. Is this the best approach? Is there some way this extension could invoke such functions and display them reliably?

Hi,

Thanks for the clear issue, I pushed a new version (can take 60 minutes for you to see it) that should improve compatibility with the repeat binding.

I also added some extra unwrapping so hopefully you shouldn't need to right click so much.
The complete model kan be viewed in vm_toJS (last property in the window), if you have checked the serialization option.
In large and nested apps there is a great performance hit when serializing every property. Some users also have dom elements in their viewmodels (bad practice) so you cannot serialize it.