• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
MagicMirror Forum
  • Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
A New Chapter for MagicMirror: The Community Takes the Lead
Read the statement by Michael Teeuw here.

How to Debug with Visual Studio Code

Scheduled Pinned Locked Moved Forum
7 Posts 2 Posters 1.3k Views 2 Watching
Loading More Posts
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • V Offline
    ViDiBi
    last edited by Aug 5, 2020, 2:06 PM

    Hi everybody!

    I’m very new to the MagicMirror Project but wanted to develop my own Module, since I got everything running on my Pi :-)

    Now I’d like to use Visual Studio Code to debug existing Modules and then develop my own module. Therefore I need a bit of assistance:

    I copied the MagicMirror Files to a folder and was able to run “npm install” with Power Shell and used this launch.json which I found in the forum to get it run in electron brwoser:

    {
        // Use IntelliSense to learn about possible Node.js debug attributes.
        // Hover to view descriptions of existing attributes.
        // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
        "version": "0.2.0",
        "configurations": [
            {
                "name": "Launch",
                "type": "node",
                "request": "launch",
                "program": "${workspaceRoot}\\js\\electron.js",
                "stopOnEntry": false,
                "args": [],
                "cwd": "${workspaceRoot}",
                "runtimeExecutable": "${workspaceRoot}\\node_modules\\.bin\\electron",
                "runtimeArgs": [
                    ".",
                    "--enable-logging"
                ],
                "env": {},
                "console": "integratedTerminal",
                "sourceMaps": false,
                "outDir": null
            },
            {
                "name": "Attach",
                "type": "node",
                "request": "attach",
                "port": 5858,
                "sourceMaps": false,
                "outDir": null
            }
        ]
    }
    

    Do I need do do anything else because if I add only the clock module it says that the node helper is missing for that module…

    No helper found for module: clock.
    

    Can anyone give me some kind of how to do this?

    Thank you so much!

    Victor

    S 1 Reply Last reply Aug 5, 2020, 2:09 PM Reply Quote 0
    • S Offline
      sdetweil @ViDiBi
      last edited by sdetweil Aug 5, 2020, 2:12 PM Aug 5, 2020, 2:09 PM

      @ViDiBi clock module doesn’t use a node_helper. not required.

      I haven’t been able to use vscode to debug mm modules myself. the browser side still has to use the browser debugger (ctrl-shift-i toggle on/off)

      see my sample module, https://github.com/sdetweil/SampleModule, which implements the mm module spec.
      and uses the module/helper communications, config, timers, and selective display of content

      Sam

      How to add modules

      learning how to use browser developers window for css changes

      1 Reply Last reply Reply Quote 0
      • V Offline
        ViDiBi
        last edited by Aug 5, 2020, 2:17 PM

        @sdetweil Thank you for your help :-) I’ll have a look at your module :-)

        There’s one more thing I was trying: I made a breakpoint in the getDom area of a module and if won’t stop in debugging at that point :-( Is this a bug or just not possible?

        S 1 Reply Last reply Aug 5, 2020, 2:24 PM Reply Quote 0
        • S Offline
          sdetweil @ViDiBi
          last edited by sdetweil Aug 5, 2020, 2:27 PM Aug 5, 2020, 2:24 PM

          @ViDiBi if you use the browser debugger it will. I have never been able to get the vscode debugger to work on this app

          I REALLY want to be able to debug from my desktop system to the mm system, as I usually don’t have keyboard/mouse on mm system.

          so far, the ability to use another browser to open mm webpage on my desktop chrome and use browser debugger has worked. but not all apps provide that remoting browser capability.

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          1 Reply Last reply Reply Quote 0
          • S Offline
            sdetweil
            last edited by Aug 5, 2020, 2:28 PM

            but the browser debugger doesn’t work on node_helpers, as they don’t run in browser of course

            Sam

            How to add modules

            learning how to use browser developers window for css changes

            1 Reply Last reply Reply Quote 0
            • V Offline
              ViDiBi
              last edited by Aug 5, 2020, 2:49 PM

              But the funny thing is, that within the node_helpers the breakpoint works but in the MMM-ModuleName.ja it doesn’t :-(

              S 1 Reply Last reply Aug 5, 2020, 3:59 PM Reply Quote 0
              • S Offline
                sdetweil @ViDiBi
                last edited by Aug 5, 2020, 3:59 PM

                @ViDiBi yeh, you are debugging in process for the node_helper, and not for the browser…

                Sam

                How to add modules

                learning how to use browser developers window for css changes

                1 Reply Last reply Reply Quote 0
                • 1 / 1
                1 / 1
                • First post
                  1/7
                  Last post
                Enjoying MagicMirror? Please consider a donation!
                MagicMirror created by Michael Teeuw.
                Forum managed by Sam, technical setup by Karsten.
                This forum is using NodeBB as its core | Contributors
                Contact | Privacy Policy