~alcinnz/argonaut-constellation.org

ref: 8e7de1da671287e75061bbbfd71c3f2489d4a5a3 argonaut-constellation.org/_posts/2021-12-24-amphiarao.md -rw-r--r-- 4.7 KiB
8e7de1da — Adrian Cochrane Fix styling of emphasis within blockquote. 1 year, 10 months ago

#layout: post title: Introducing Amphiarao! author: Adrian Cochrane date: 2021-12-23 20:55:52 +1300

I've now implemented the core featureset of (save for a HURL crash which badly needs addressing) a Rhapsode bug-compatible webpage debugger, compatible with Selenium & whatever your favourite web browser is. Even Rhapsode, once I've implemented forms for it (coming soon)! All the features Selenium expects are implemented, though where they're not supported by Rhapsode I wrote noops.

Amphiarao is implemented as a Happstack locally-run non-persistant webservice exposing a JSON (using the aeson module, named for the father of Jason from Jason & The Argonauts) API "WebDriver" expected by Selenium & an HTML UI resembling the Chrome, Firefox, or especially Safari WebInspectors you're familiar with. And loosely resembling the elementary OS "Pantheon" desktop with the Solarized syntax-highlighting theme, though feel free to contribue alternate CSS themes! It builds upon the exact same modules (plus selectors & hxt-xpath for searching elements) serverside Rhapsode would use clientside to render the HTML Amphiarao outputs to it.

To ensure Amphiarao will sound good in Rhapsode (again, once forms are implemented in it) Amphiarao takes care to use semantic markup, uses no JavaScript, & applies auditory styles to it's syntax highlighting. These auditory styles ensure source code doesn't sound monotonous (in other words: syntax highlighting may be useful visually, but it's crucial auditorally) when read aloud. Since I already have the HTML & CSS parsed, I found it easy enough to have the code manually add the additional markup without pulling in a dedicated syntax highlighter. Though I probably will utilize skylighting later when I expand the UI featureset beyond what's expected by Selenium...

#Why?

I doubt Amphiarao will get much use by web developers wanting to ensure their pages work well in my efforts, though I'd love & welcome to be proven wrong!

I do know that I'd use it, to aid my own testing of my browser engine stack as I extend it to tackle even more ambitious projects (Something visual?)! And just like existing WebInspectors are implemented in a way which showcases their browsers' capabilities, so does Amphiarao. Notably the universiality where I can target multiple differing mediums with the exact same markup.

#Visual Design

I don't claim to be a strong visual designer, but I know what I like. I find borders to be visual noise I wish to avoid. I prefer communicating via typography & (which I largely implemented via CSS Grid) layout, though when not overused differing backgrounds can be nice and useful too.

I copied (rigorously-choosen) colour schemes from elementary & Solarized because:

  1. I use them everyday & love them
  2. I don't know how to choose my own

Hey, if WebKit's WebInspector can look like Mac OS X everywhere, Amphiarao can look like elementary everywhere! And yes, there is a darkmode.

But if you have different visual-design tastes than mine, all it'd take is swapping out the CSS. Which I'll ensure is trivial for readers to do in any of my browser engines.

span {voice-volume: soft}