Eruda - Access a web developer console to debug your website

VGMoose

Eruda is a javascript tool that displays a web developer console directly in the website itself. This allows it to be used to debug errors on other devices, such as the Switch, WiiU, 3DS, etc.

To use it, embed it on the page like this:

<script src="https://cdn.jsdelivr.net/npm/eruda"></script>
<script>eruda.init();</script>

And then click the gear icon in the bottom right of the page. This is really useful if investigating errors that only occur on the device, and no web console is available.

Docs / more info:
https://eruda.liriliri.io/docs/

Screenshot:
eruda console

Andyboi

Looking on the website, you could also create a bookmark with the url set as javascript:(function () { var script = document.createElement('script'); script.src="https://cdn.jsdelivr.net/npm/eruda"; document.body.append(script); script.onload = function () { eruda.init(); } })();, and then click on the bookmark on the page you want to inspect.

LarryFire

why would u want t=o do this

VGMoose

@Larryfire85 This is for web developers! For example, I used this the other day for troubleshooting forum issues on Switch, where there's no browser console.

VGMoose

@TheAndyboi That's really cool! Reminds me of the firebug lite bookmarklet, which used to be one of the only reliable ways to debug mobile websites: https://css-tricks.com/snippets/html/use-firebug-in-any-browser/

BloodVineCC

Hey quick question bout this... is it possible to customize the frontend for using eruda? using smth like CSS? or SCSS? along with html and vanilla js?