Basic questions regarding extension development

To discuss development of addons / skins / customization of MediaMonkey.

Moderator: jiri

Basic questions regarding extension development

Postby djdd » Mon Mar 13, 2017 2:17 pm

I’m new to JavaScript and have some basic questions
  1. Can you recommend an editor or an IDE
  2. “Show Dev Tools” does not work for me (if I click the context menu entry, nothing happens), are I’m doing something wrong?
  3. I’m not able to use the chrome dev-tools
    • When I click the context menu entry “Inspect Element” I can open the dev tools
    • If I then select tab “Source” and open my jr file I can set a breakpoint
    • When I then open my extension, execution does not stop on the break point
    • When I first open my extension and then set a break point, the execution stops
    • But, in dev tool I then cannot use any thing (e.g. switching to console, change break points)
    • “Resume script execution” only works with the small bar shown over MM screen

I think I’m doing something wrong, but I don’t know what

Thanks for your help,
Dieter
djdd
 
Posts: 40
Joined: Mon Dec 26, 2016 3:36 pm
Location: Switzerland, Breitenbach

Re: Basic questions regarding extension development

Postby Ludek » Mon Mar 13, 2017 4:07 pm

1) For JS+HTML we use Brackets editor ( http://brackets.io/ ) and some of its extensions (like Beautify for code formatting)
2&3) I guess you need to install Chrome browser, DevTools opens in Chrome and breakpoints work fine for me. Also the Timeline tab and its recording is very useful for debugging performance issues etc.
Ludek
 
Posts: 2236
Joined: Fri Mar 09, 2007 9:00 am

Re: Basic questions regarding extension development

Postby jiri » Tue Mar 14, 2017 3:25 am

3) As Ludek noted, while 'Inspect Element' shows Chrome-like UI, it's in MM5 process and somehow debugging doesn't work well there (but it's great for element inspection, etc.). Debugging works great from an external Chrome instance though, which you can also open by Ctrl+Alt+Shift.

Jiri
jiri
 
Posts: 5290
Joined: Tue Aug 14, 2001 7:00 pm
Location: Czech Republic

Re: Basic questions regarding extension development

Postby djdd » Sun Mar 19, 2017 4:34 pm

Ok, I’m getting closer, but still have some problems.

After installing Chrome I can open Developer Tools with Ctrl+Alt+Shift and set break points, but...
(see Extension for my explanations/questions: http://www.mediafire.com/file/sn90d0mkx4c5uqc/WebRequestDJDD.mmip)

Break point in local.js, line 45 works fine
Break point in webrequestdjdd/dialogs/dlgUpdateFromLastFm.js, any line (e.g. 182) does not work

If I first open the dialog and then press Ctrl+Alt+Shift, I can set a break point at line 369 (function chbEmptyFieldsOnlyChanged()) that works.

But what I need is a working break point in function updateResults()
How can I set a break point there, if I set the breakpoint before opening the dialog, it does not work, if I set the break point after opening the dialog it is to late ;-)

Thanks,
Dieter
djdd
 
Posts: 40
Joined: Mon Dec 26, 2016 3:36 pm
Location: Switzerland, Breitenbach

Re: Basic questions regarding extension development

Postby jiri » Mon Mar 20, 2017 10:38 am

We are looking into some improvements, but right now you can add some setTimeout() in the dialog init code, so that you have time to show devtools. Not very friendly, but works... :-)

Jiri
jiri
 
Posts: 5290
Joined: Tue Aug 14, 2001 7:00 pm
Location: Czech Republic

Re: Basic questions regarding extension development

Postby djdd » Mon Mar 20, 2017 3:05 pm

Thanks for the advice…
But…
First attempt
Code: Select all
function init(params) {
    setTimeout(function () { alert("to late"); }, 10000);
    assert(params.tracks, 'dlgUpdateFromLastFm - tracks must not be empty!');
that of course did not work, because “setTimeout”, waits 10 seconds with calling the “alert”, but continues immediately with executing the line after “setTimeout”

second attempt
Code: Select all
function init(params) {
    setTimeout(function(){ init2(params), 10000});
};
function init2(params) {
    // setTimeout(function () { alert("to late"); }, 10000);
    assert(params.tracks, 'dlgUpdateFromLastFm - tracks must not be empty!');
this also did not work and I don’t understand why. My expectation would be, that execution of “init2” should be delayed by 10 seconds, but this is not the case.

Again, what are I’m doing wrong?

Thanks,
Dieter
djdd
 
Posts: 40
Joined: Mon Dec 26, 2016 3:36 pm
Location: Switzerland, Breitenbach

Re: Basic questions regarding extension development

Postby PetrCBR » Mon Mar 20, 2017 4:33 pm

Code: Select all
function init(params) {
  setTimeout(function () {
    alert("to late");
    assert(params.tracks, 'dlgUpdateFromLastFm - tracks must not be empty!');
  }, 10000);
}
PetrCBR
 
Posts: 1337
Joined: Tue Mar 07, 2006 5:31 pm
Location: Czech

Re: Basic questions regarding extension development

Postby djdd » Tue Mar 21, 2017 12:06 pm

Hi Petr,

Thanks, you made my day ;-)

Regards,
Dieter
djdd
 
Posts: 40
Joined: Mon Dec 26, 2016 3:36 pm
Location: Switzerland, Breitenbach


Return to MediaMonkey 5 developer forum

Who is online

Users browsing this forum: No registered users and 2 guests