phillycomputerscience.com / tools

PCS Terminal

An in-page console and network viewer for Chromebooks where students can't open browser DevTools. Drop in one script tag; get a real debugging terminal on any page.

What it does

Console, mirrored

console.log/info/warn/error/debug, uncaught errors, and unhandled promise rejections all get captured and shown formatted — objects and arrays included, not [object Object].

A real command line

Type JavaScript, press Enter, see the result — evaluated in the page's own global scope. Up/Down arrows recall history. Try help for built-ins.

Network tab

Every fetch() and XMLHttpRequest the page makes is logged automatically — method, URL, status, size, timing. Click a row to expand it.

Network tools

Ping times an HTTP round-trip to any URL. Connection info reads the browser's network conditions. My public IP is a one-click lookup.

Try it live

This page has PCS Terminal loaded. Click the > terminal_ tab in the bottom-right corner, then use these buttons to generate some activity — or just open the terminal and type help.

Every button above shows up in real time in the Console or Network tab.

Add it to your own page

One line, anywhere in the page — head or body, before or after your other scripts. It's safe either way:

<script src="https://phillycomputerscience.com/tools/terminal.js"></script>

That's it. No build step, no dependencies, nothing else to configure.

Safe for student projects

Runs inside its own closure — never creates or overwrites globals a student is likely to use.
Wraps console, window.onerror, fetch, and XMLHttpRequest rather than replacing them, so a student's own logging, error handling, and networking code still runs exactly as before.
Guards against being loaded twice — no double-hooked console, no duplicate log entries.
Every DOM element, ID, and style it creates is prefixed with pcsterminal_ so it can't collide with a student's own HTML, CSS, or JS.

idempotent zero dependencies single file Chromebook-friendly