App Inspector for NativeScript #165

Open
fealebenpae opened this Issue May 14, 2015 · 14 comments

Projects

None yet
@fealebenpae
Contributor

The NativeScript framework uses the Safari Web Inspector and the Chrome DevTools to debug the JavaScript running inside a NativeScript application. However, the Web Inspector and the DevTools are capable of so much more than just plain JavaScript debugging.

I propose that the NativeScript framework debugging experience is extended to match the featureset of web debuggers. This means support for the following:

in 1.3 release

  • Profiling JavaScript
  • View app contents

in 1.6 release

  • Debugging http requests

in 1.7 release

  • Start working on the Android parity

unplanned

  • Visualizing and editing the visual tree
  • Debugging and editing CSS
  • Viewing local storage
  • Debug application events such as lifetime, timers, scrolling, layout, animations
  • Heap profiler

The interface for those and more is already present in the debugger frontends that the NativeScript runtimes rely on. Right now we want to try and extend the Web Inspector infrastructure to enable profiling JavaScript code on iOS. If this strategy proves viable, it would be a good idea to continue along this path and implement other features common to web debuggers.

I believe that work towards this goal will not only improve the debugging experience of NativeScript apps a great deal, but it would also make it easy for developers used to web debuggers to reuse their skills.

@RangerMauve

👍 This will also make NativeScript a better competitor for React-Native who have nailed the dev tools integration already.

@KristinaKoeva KristinaKoeva was unassigned by paveldk May 15, 2015
@valentinstoychev valentinstoychev added this to the 1.2.0 milestone May 19, 2015
@FlipOneDev

Hey NativeScript Team! Can you develop a NativeScript Playground similar to the React Native Playground? Please check it out at RNPLAY.ORG.

That would be a tremendous tool to "ease the pain" of learning NativeScript and promote adoption among Javascript developers.

I hope you can to this soon guys!

@ligaz
Contributor
ligaz commented Jun 11, 2015

Hey @FlipOneDev that is a pretty good idea. Thanks for sharing it with us. You can imagine we can do something similar in our dojo 😄

@valentinstoychev valentinstoychev removed this from the 1.2.0 (Under Review) milestone Jun 11, 2015
@toddanglin
Contributor

Improving the debugging experience for NativeScript is SUPER critical. Hopefully there will be a better story sooner than later. It's very hard to adopt/learn a new framework while relying on "console.log" statements. Many higher level capabilities in NativeScript are almost pointless until there is a better core debugging story.

Eagerly waiting to see what milestone this gets assigned to. :)

@valentinstoychev
Contributor

@toddanglin We are actively working on it with high priority! With the 1.2 release (coming in two weeks) we will check the first task from the list - the JS profiler.

@valentinstoychev
Contributor

@PanayotCankov @KristinaKoeva lets write spec for each item from the tasks and create a new issue with more details.

@valentinstoychev valentinstoychev changed the title from Web Inspector for NativeScript to App Inspector for NativeScript Aug 1, 2015
@sitefinitysteve
Contributor

This says it's in the 1.3 release... any details on it?

@KristinaKoeva
Contributor

Hey,

Our 1.3 release included the following improvements over the debugging experience.

  • Web Inspector Page Agent that lets you browse through all of your contents located in your app folder.
  • Pause the debugger on startup so that you could easily inspect all the initialization logic of your application

For more information please take a look at our release notes
We are actively working on the rest of the App Inspector story so stay tuned.

@toddanglin
Contributor

Any notable improvements made on this issue for the 1.5 release? Is Visual Tree debugging still planned for 1.6?

@manijak
manijak commented May 3, 2016

Is the Nativescript inspector alive at all?

@sjarrin
sjarrin commented May 26, 2016

Hello, any update on this task ? It's a must have to be able to debug views, especially when using Nativescript with Angular.

@envomer
envomer commented May 26, 2016

@sjarrin +1 same here

@hypery2k

any news on this?

@valentinstoychev
Contributor

During 2.4 we were working on parity with Android, see NativeScript/android-runtime#563.

For 2.5 we will continue working on this tooling with highest priority and will start enabling the tabs in the Chrome DevTools.

If you have any particular feedback please let me know. The goal is to enable Chrome Devtools to work in the same way in NativeScript as they work for web.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment