Show HN: Gitcasso – Syntax Highlighting and Draft Recovery for GitHub Comments

33•etwigg•4mo ago

I built a browser extension called Gitcasso which:

- Adds markdown syntax highlighting to GitHub textareas

- Lists every open PR/issue tab and any drafts

- (Optional, unimplemented) autosaves your comment drafts so you don’t lose work

I made it because I was impressed by https://overtype.dev/ (a markdown textarea syntax highlighter) which went big on here on HN a few weeks ago, and it seemed like a perfect fit for a GitHub browser extension. Keeping up with changes on upstream GitHub would normally be a pain, but with with Playwright and Claude Code it seemed possible for it to be nearly automatic, which has turned out to be mostly true!

This was the first time where I built a tool, gave the tool to AI, and then AI used the tool to make the thing I hoped it would be able to make. I'm pretty sold on the general technique...

GitHub repo (Apache2-licensed, open source): https://github.com/diffplug/gitcasso

Video walkthrough (2 mins of the tool, 12 mins of its development tooling): https://www.youtube.com/watch?v=wm7fVg4DWqk

And a text writeup with timestamps to the video walkthrough https://nedshed.dev/p/meet-gitcasso

Comments

dorianniemiec•4mo ago

The idea seems good - this can make Markdown in the comment editor more readable!

But when I tried your Chrome extension, I found a problem - the comment box became light mode, when GitHub is in dark mode...

I have opened a GitHub issue about this problem.

etwigg•4mo ago

Agggh! My eyesssss!!! Thanks for creating the issue and posting a screenshot, we will 100% have to fix it!

https://github.com/diffplug/gitcasso/issues/112

andreynering•4mo ago

For those that don't know, on Settings > Appeaarance there is a setting for "Use a fixed-width (monospace) font when editing Markdown". It's already a good QoL improvements (and it should be the default, honestly).

https://github.com/settings/appearance

etwigg•4mo ago

At the beginning of Gitcasso, I took a little survey of GitLab, Reddit, ChatGPT, Claude, etc. to see how they were doing their textboxes. Of those I just listed, GitHub is the only one still using a plain textarea, all of the rest have a wysiwyg richtext gizmo (with GitLab and Reddit you can opt-in to markdown).

But by using the same variable-width font that the rendered comment uses, GitHub's default gives you more of a wysiwyg experience than a monospace font does. With syntax-highlighting it's an even more wysiwyg feel, but with absolutely none of the content ambiguity that richtext normally brings with it.

I came away really impressed with GitHub. For any given decision, it's hard to tell if the market victor won because of their good taste or if they won in spite of that particular decision and there was somewhere else where the good decisions were decisive. But as the GitHub issue/PR commenting system stands today, I have a hard time finding much to gripe with (except the missing syntax highlighting, of course).

DiabloD3•3mo ago

When is this being added to the Firefox extensions repo?

etwigg•3mo ago

I was basically waiting for someone to ask: https://github.com/diffplug/gitcasso/issues/115

DiabloD3•3mo ago

Thank you.

DTrejo•3mo ago

Nice extension!

1. It'd save a lot of time if one could just click a Markdown PR description and start editing it, without entering edit mode first.

2. Thanks to the following prompt, I barely write PR descriptions these days.

> Run `gh pr view` then `gh pr edit` to fill out the PR description. Use my words verbatim as much as possible. Be brief. Use tasteful markdown formatting.

lelandfe•3mo ago

> I barely write PR descriptions

As someone who has to read a coworker's AI-generated slop PR descriptions every day, what a bummer

imiric•3mo ago

Thanks for sharing. Seeing related issues and PRs seems like a useful feature. Though it would be better if the extension could somehow determine and show the related issues and PRs to the current issue/PR, instead of listing all open tabs.

But I find the other two features to be less useful, personally. I tend to do all writing in my favorite text editor (where I'm writing this now), which is already configured with syntax highlighting, and all my editing preferences. I can save my work at any time, and always have a local copy of it. In contrast, typing in textareas is a cumbersome and risky experience no matter how friendly the UI is. One wrong click or keypress could waste minutes or hours of your time. We all have our workflow preferences, of course, but I would encourage any technical person to use their editor instead. If you don't like manually copy/pasting text back and forth, there are browser extensions that automate opening up an editor, and syncing the contents with a specific textearea.

I watched your video walkthrough, and as someone who still uses LLMs exclusively via a conversational UI, it's shocking to me that it took you 7 minutes to update the "corpus" for the LLM, and run several commands, only for the actual fix to be a single-character change in a CSS selector. Sure, the difficult thing is knowing which file and character to change, but given the issue, any developer familiar with the codebase would instinctively know where to look first, and fix the issue in a fraction of that time. Maybe even add a test case for it.

This is far from the efficiency and speed these tools were promised to deliver. Aside from the fact that you admit not having an understanding of the testing framework you vibe coded, when your entire development workflow depends on it. If this is the future of software development, as you claim, what a bleak future it is.

BTW, you have a very nice shed, Ned. :)

etwigg•3mo ago

> I tend to do all writing in my favorite text editor

Have you tried https://ghosttext.fregante.com/

> typing in textareas is a cumbersome and risky experience

Exactly! Forget syntax highlighting, that's the real problem to be solved! (gitcasso is very far from achieving that rn)

> any developer familiar with the codebase ... fix the issue in a fraction of that time

Fair point. I published an example which was easy to follow rather than an example which showed off the tooling at its "max strength". I recorded a different take where I added support for issues being opened within a GitHub Project. The scraping there is a lot more complex, fixing one case tends to break another, and the AI can solve it in pretty much the same time, but the video felt too confusing to bundle with the launch.

> any developer familiar with the codebase

Refined GitHub (a popular github browser extension) has long rejected syntax highlighting for being too hard to maintain. So part of the goal here is to automate that maintenance - hopefully there won't even be a developer who is currently familiar with the codebase pretty soon. The slowest part by far is capturing the snapshots in the first place, which could/ought be automated.

> you have a very nice shed

Thanks imiric! And thanks for sharing your thoughts :)

westurner•3mo ago

refined-github > Highlights > Adding comments, Conversations: https://github.com/refined-github/refined-github#writing-com...

etwigg•3mo ago

yeah, refined-github is definitely the legend here, GitHub has incorporated so many of their ideas. But as of 2021 they were pretty dead-set against syntax highlighting: https://github.com/refined-github/refined-github/issues/5075

> We are not going to mess around with the comment box with syntax highlighting, which numerous people tried and failed due to GitHub updates or edge cases that are not so edgy.

smcleod•3mo ago

Nice but is it possible to limit which websites the extension has access to? It's requesting access to read and modify content on all websites!

Free Trial: AI Interviewer

FDA Intends to Take Action Against Non-FDA-Approved GLP-1 Drugs

Supernote e-ink devices for writing like paper

We are QA Engineers now

Show HN: Measuring how AI agent teams improve issue resolution on SWE-Verified

Adversarial Reasoning: Multiagent World Models for Closing the Simulation Gap

Show HN: Poddley.com – Follow people, not podcasts

Layoffs Surge 118% in January – The Highest Since 2009

Papyrus 114: Homer's Iliad

DicePit – Real-time multiplayer Knucklebones in the browser

Turn-Based Structural Triggers: Prompt-Free Backdoors in Multi-Turn LLMs

Show HN: AI Agent Tool That Keeps You in the Loop

Why Every R Package Wrapping External Tools Needs a Sitrep() Function

Achieving Ultra-Fast AI Chat Widgets

Show HN: Runtime Fence – Kill switch for AI agents

Researchers surprised by the brain benefits of cannabis usage in adults over 40

Peter Thiel warns the Antichrist, apocalypse linked to the 'end of modernity'

USS Preble Used Helios Laser to Zap Four Drones in Expanding Testing

Show HN: Animated beach scene, made with CSS

An update on unredacting select Epstein files – DBC12.pdf liberated

Was going to share my work

Pitchfork: A devilishly good process manager for developers

You Are Here

Why social apps need to become proactive, not reactive

How patient are AI scrapers, anyway? – Random Thoughts

Vouch: A contributor trust management system

I built a terminal monitoring app and custom firmware for a clock with Claude

Tiny C Compiler

Y Combinator Founder Organizes 'March for Billionaires'

Ask HN: Need feedback on the idea I'm working on

Free Trial: AI Interviewer

FDA Intends to Take Action Against Non-FDA-Approved GLP-1 Drugs

Supernote e-ink devices for writing like paper

We are QA Engineers now

Show HN: Measuring how AI agent teams improve issue resolution on SWE-Verified

Adversarial Reasoning: Multiagent World Models for Closing the Simulation Gap

Show HN: Poddley.com – Follow people, not podcasts

Layoffs Surge 118% in January – The Highest Since 2009

Papyrus 114: Homer's Iliad

DicePit – Real-time multiplayer Knucklebones in the browser

Turn-Based Structural Triggers: Prompt-Free Backdoors in Multi-Turn LLMs

Show HN: AI Agent Tool That Keeps You in the Loop

Why Every R Package Wrapping External Tools Needs a Sitrep() Function

Achieving Ultra-Fast AI Chat Widgets

Show HN: Runtime Fence – Kill switch for AI agents

Researchers surprised by the brain benefits of cannabis usage in adults over 40

Peter Thiel warns the Antichrist, apocalypse linked to the 'end of modernity'

USS Preble Used Helios Laser to Zap Four Drones in Expanding Testing

Show HN: Animated beach scene, made with CSS

An update on unredacting select Epstein files – DBC12.pdf liberated

Was going to share my work

Pitchfork: A devilishly good process manager for developers

You Are Here

Why social apps need to become proactive, not reactive

How patient are AI scrapers, anyway? – Random Thoughts

Vouch: A contributor trust management system

I built a terminal monitoring app and custom firmware for a clock with Claude

Tiny C Compiler

Y Combinator Founder Organizes 'March for Billionaires'

Ask HN: Need feedback on the idea I'm working on

Show HN: Gitcasso – Syntax Highlighting and Draft Recovery for GitHub Comments

Comments