Black screen

[r3zi3lr]

Hi,

I’ve managed to install the Module but I’m getting just a black screen for the module.

Have I forgotten to install something?

Code for my config.js below:

module: "MMM-TomTomTrafficIncidents",
			position: "center",
			config: {
			key: "",
			lng: -123.1139529,
			lat:  49.2608724,
			zoom: 11,
			height: "500px",
			width: "800px"

Thank you.

[sdetweil]

@r3zi3lr said in Black screen:

MMM-TomTomTrafficIncidents

open the developers window, ctrl-shift-i on the keyboard, select the tab labled ‘console’ and scroll up to see any errors… u can also filter by module, by placing some part of the module name in the filter field, like ‘tom’

please use code block markers for config items… select the text, and push the </> button above the editor

[r3zi3lr]

@sdetweil

Thank you for the quick response.

I got this:

loader.js:182 Load script: modules/default/alert/modernizr.custom.js
/home/pi/MagicMirror/node_modules/electron/dist/resources/electron.asar/renderer/security-warnings.js:128 Electron Security Warning (Insecure Resources) This renderer process loads resources using insecure protocols. This exposes users of this app to unnecessary security risks. Consider loading the following resources over HTTPS or FTPS.

• http://localhost:8080/css/main.css
• http://localhost:8080/fonts/roboto.css
• http://localhost:8080/socket.io/socket.io.js
• http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js
• http://localhost:8080/js/defaults.js
• http://localhost:8080/config/config.js
• http://localhost:8080/vendor/vendor.js
• http://localhost:8080/modules/default/defaultmodules.js
• http://localhost:8080/js/logger.js
• http://localhost:8080/translations/translations.js
• http://localhost:8080/js/translator.js
• http://localhost:8080/js/class.js
• http://localhost:8080/js/module.js
• http://localhost:8080/js/loader.js
• http://localhost:8080/js/socketclient.js
• http://localhost:8080/js/main.js
• http://localhost:8080/fonts/node_modules/roboto-fontface/fonts/roboto-condensed/Roboto-Condensed-Regular.woff2
• http://localhost:8080/translations/en.json
• http://localhost:8080/translations/en.json
• http://localhost:8080/modules/default/alert//alert.js
• http://localhost:8080/modules/default/alert/classie.js
• http://localhost:8080/modules/default/alert/modernizr.custom.js
• http://localhost:8080/modules/default/alert/notificationFx.js
• http://localhost:8080/modules/default/alert/ns-default.css

For more information and help, consult https://electronjs.org/docs/tutorial/security.
This warning will not show up once the app is packaged.
warnAboutInsecureResources @ /home/pi/MagicMirror/node_modules/electron/dist/resources/electron.asar/renderer/security-warnings.js:128
loader.js:182 Load script: modules/MMM-TomTomTrafficIncidents//MMM-TomTomTrafficIncidents.js
module.js:477 Module registered: MMM-TomTomTrafficIncidents
loader.js:152 Bootstrapping module: MMM-TomTomTrafficIncidents
loader.js:157 Scripts loaded for: MMM-TomTomTrafficIncidents
loader.js:197 Load stylesheet: modules/MMM-TomTomTrafficIncidents/tomtom-international-web-sdk-maps/maps.css
loader.js:197 Load stylesheet: modules/MMM-TomTomTrafficIncidents/tomtom-international-web-sdk-maps/traffic-incidents.css
loader.js:159 Styles loaded for: MMM-TomTomTrafficIncidents
loader.js:161 Translations loaded for: MMM-TomTomTrafficIncidents
loader.js:197 Load stylesheet: css/custom.css
MMM-TomTomTrafficIncidents.js:35 Starting module: MMM-TomTomTrafficIncidents
MMM-TomTomTrafficIncidents.js:44 MMM-TomTomTrafficIncidents: Using JS & CSS from local source.
module.js:156 MMM-TomTomTrafficIncidents received a system notification: ALL_MODULES_STARTED
module.js:156 MMM-TomTomTrafficIncidents received a system notification: MODULE_DOM_CREATED
module.js:156 MMM-TomTomTrafficIncidents received a system notification: DOM_OBJECTS_CREATED
module.js:154 MMM-TomTomTrafficIncidents received a module notification: CURRENTWEATHER_DATA from sender: currentweather
maps-web.min.js:1 Error: Failed to initialize WebGL
at A._setupPainter (maps-web.min.js:1)
at new A (maps-web.min.js:1)
at e.mapboxMapFactory (maps-web.min.js:1)
at t.createMap (maps-web.min.js:1)
at new map (maps-web.min.js:1)
at HTMLScriptElement.script.onload (MMM-TomTomTrafficIncidents.js:70)
wt.fire @ maps-web.min.js:1
maps-web.min.js:1 Uncaught Error: Failed to initialize WebGL.
at new A (maps-web.min.js:1)
at e.mapboxMapFactory (maps-web.min.js:1)
at t.createMap (maps-web.min.js:1)
at new map (maps-web.min.js:1)
at HTMLScriptElement.script.onload (MMM-TomTomTrafficIncidents.js:70)
module.js:154 MMM-TomTomTrafficIncidents received a module notification: CALENDAR_EVENTS from sender: calendar

[sdetweil]

@r3zi3lr said in Black screen:

maps-web.min.js:1 Error: Failed to initialize WebGL

to test do this

cd ~/MagicMirror
node node_modules/.bin/electron https://webglreport.com/?v=1

it may be a hardware config issue for the display driver (I don’t know how to fix it myself), google may help, other users too…

[r3zi3lr]

@sdetweil

Managed to fix it myself using the below:

Console: sudo raspi-config Under “7 Advanced Options” / “A7 GL Driver” pick “G2 GL (Fake KMS)”

Desktop: Preferences / Add Remove Software search for “Chrome” and pick “WebDriver driver for the Chromium Browser”, click “OK”

[sdetweil]

@r3zi3lr awesome!

[Travelbacon]

Nice work. I will also add in my documentation that Fake KMS must be set. :)

Btw: Did you check the Pi settings on:
https://github.com/MichMich/MagicMirror/wiki/Configuring-the-Raspberry-Pi ?
There might be a change that you can have other options.

@MichMich The FAQ seems to be outdated. In the newest Raspberry Pi OS (Raspbian) the whole raspi-config has changed for the driver settings.