Basic questions regarding extension development

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

Moderators: jiri, drakinite, Addon Administrators

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

Basic questions regarding extension development

Post by djdd »

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
Ludek
Posts: 4958
Joined: Fri Mar 09, 2007 9:00 am

Re: Basic questions regarding extension development

Post by Ludek »

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.
jiri
Posts: 5417
Joined: Tue Aug 14, 2001 7:00 pm
Location: Czech Republic
Contact:

Re: Basic questions regarding extension development

Post by jiri »

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
djdd
Posts: 40
Joined: Mon Dec 26, 2016 3:36 pm
Location: Switzerland, Breitenbach

Re: Basic questions regarding extension development

Post by djdd »

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/sn90d0mkx ... tDJDD.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
jiri
Posts: 5417
Joined: Tue Aug 14, 2001 7:00 pm
Location: Czech Republic
Contact:

Re: Basic questions regarding extension development

Post by jiri »

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
djdd
Posts: 40
Joined: Mon Dec 26, 2016 3:36 pm
Location: Switzerland, Breitenbach

Re: Basic questions regarding extension development

Post by djdd »

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
PetrCBR
Posts: 1763
Joined: Tue Mar 07, 2006 5:31 pm
Location: Czech
Contact:

Re: Basic questions regarding extension development

Post by PetrCBR »

Code: Select all

function init(params) {
  setTimeout(function () { 
    alert("to late"); 
    assert(params.tracks, 'dlgUpdateFromLastFm - tracks must not be empty!');
  }, 10000);
}
How to make a debuglog - step 4b: viewtopic.php?f=30&t=86643
djdd
Posts: 40
Joined: Mon Dec 26, 2016 3:36 pm
Location: Switzerland, Breitenbach

Re: Basic questions regarding extension development

Post by djdd »

Hi Petr,

Thanks, you made my day ;-)

Regards,
Dieter
Post Reply