Adding keyboard shortcuts to a 24 year-old government website with userscripts | Hacker News Reader

Adding keyboard shortcuts to a 24 year-old government website with userscripts

wcedmisten.fyi

105 pointsthunderbong40 comments

Bookmarklets/userscripts are such an excellent showcase of why the web is so empowering to users and why native apps are such a depressing, user-hostile regression.

Example from literally just this morning: I'm organizing an event and the venue wanted an attendee list in Excel format. The event is organized through meetup.com, which has been "app-ifying" their site for years now, which is to say, turning it to useless crap. I went to the list of attendees for the event and tried to copy-paste the 80-ish names so I could clean it up into a usable list... but some cabbage-brained PM has apparently decided that users shouldn't be allowed to copy-paste names out of the attendees list (literally all the text on the page except attendee names was selectable). Fortunately it was trivial to whip up a tiny script to circumvent this, and made me appreciate how annoying it would be to transcribe this all by hand if all I had was a useless locked-down mobile app.

Cases like this highlight the importance of having accessible OCR tools, such as the one in Windows PowerToys which I learned to love. With just a shortcut you can extract text from any window, effectively bypassing browser or app limitations.

This is also built in to macOS and iOS now too. Such a handy feature that I find myself using a lot.

How does one do this in macos?

I thiiiiiiiiink it's technically part of Preview (you can paste it into that app after you take a screenshot): https://support.apple.com/guide/preview/interact-with-text-i...

I don't THINK there is a way to do it straight from the snipping tool, but someone correct me if I'm wrong.

Edit: Personally I use the paid Cleanshot app, which is not only great for OCR but all sorts of screenshots, videos, and annotations: https://cleanshot.com/ You just drag a box around the text, click "OCR", and it gets copied into your clipboard. I find it easier & faster than having to deal with Preview.

I think the free Shottr does the same: https://shottr.cc/

I don't THINK there is a way to do it straight from the snipping tool, but someone correct me if I'm wrong.

It can be done from the screenshot tool. Take the screenshot, and an icon will appear in the lower-right corner of the preview. Click that icon and it selects all of the text in the preview.

If you don't want all to select all of the text in the window, just select the text in the image the same way you'd select text in any other program.

I find it easier & faster than having to deal with Preview.

OCR is system-wide on macOS without Preview.

Great, thanks for the explanation!

Have a look at textgrabber in this article:

https://news.ycombinator.com/item?id=38711357

I think the parent is saying you don't need any third-party apps anymore, it's just built in to macos now.

It does say that yes, and that is correct. at least it is on my macos. Did you try textgrabber? The article refers to 2024.

On Linux, I created a little script which uses maim to capture a user selected screen region, save that to a file, run tesseract, and dump the output to stdout. Since it is all digital (minus weirdo fonts) the OCR should be perfect.

How does one do this in macos?

On recent Macs, it's automatic in most programs, including Mail, Preview, Quickview, and others. Just hover your pointer over text in an image, and if the computer recognizes it, you get a text cursor so you can select the text. No extra software needed.

If it's a language you can't read, you can often ⌥click the selected text and it will be translated into the language of your choice.

It's in the last two versions of macOS. You can grab text off of pretty much anything (with text). I've occasionally found it annoying when I'm trying to drag and drop an image that contains text but it's very useful and seamless.

Isn't the distinction instead between open source and closed source ? (With minified JavaScript counting as "closed" for most intents and purposes.)

I didn't need the source to fix the issue here, I can trivially introspect and open a console to modify the page with a single keypress.

You can usually extract text straight from the DOM (barring special efforts to obfuscate it), it doesn't matter much if there's layers of opaque JavaScript generating it.

It's not about controlling the source code (though that certainly helps), it's about controlling the device. If this was a native app on Linux or even Windows, you could attach a debugger and do the same kind of things whether or not you had the source code. An iOS app, not so much.

> If this was a native app on Linux or even Windows, you could attach a debugger and do the same kind of things whether or not you had the source code.

Notably, though: for a certain value of "you" more narrowly scoped than the "you" capable of writing a few lines of JavaScript.

Nah. Most people can't even write the JavaScript and the ones who can learn that are also generally capable of learning the desktop equivalents.

If there was any difference in difficulty it would be purely arbitrary as a result of which one currently has easier to use tools to do what you're trying to do. A lot of these kinds of things can be done in a few lines of bash or PowerShell.

If there is any fundamental difference, it's that in traditional desktop applications everything is local and the inability to run without an internet connection is something you might complain about. Whereas for a browser you might be surprised if that was even possible, and then there will be things you can't do because you'd need data which is only on the server and is never supplied to the client, or run into rate limiters or be unable to do it privately because your activity generates logs on the server etc.

How is that an example of native apps?

That is just an example of modern web, that is the depressing part.

Actually been giving an excel file would have been liberating.

"Produce any arbitrary file from any arbitrary page, Pandoc-style" would be a nifty feature, but not one that I expect sites to provide. Instead, just give me access to the data, that's all I need and expect, and what used to be standard before mobile apps caused our standards to fall.

I think there is a far more effective method in this situation: the FDA has mercifully made this data available for download as plain text files: https://www.fda.gov/medical-devices/510k-clearances/download...

So I would download all 6 files, then write a script/app to fuzzy search/filter/transform those files as needed. No need to manually scrape using the web form!

For example, here is line 65457 from PMNLSTMN.ZIP. It seems the OP is interested in searching the last column and outputting the first column:

    K202167|Cordis Corporation|...|N||Brite Tip Radianz Guiding Sheath

Author here!

That's true, and I actually used that dump[1] and OCR to automate about 80% of this project. The manual data entry was only required for the 20% that couldn't be found automatically.

Since this was just to fill in the gaps, I figured there would be diminishing returns on re-implementing fuzzy search on the data, but adding shortcuts to my manual workflow took less time for a reasonable speedup.

[1] I also used the JSON dump of this data that the FDA provides here: https://open.fda.gov/apis/device/510k/download/

Thank goodness~ I imagined the author doing nothing but manually scraping data from this web form for an entire year.

why be fuzzy like Google when you can be exact?

It was a limitation of the web form the author mentioned[1]:

> The device and company names are not standardized, and may have abbreviations, acronyms, or plain old typos. The website's search functionality does not provide fuzzy string matching, so finding a device often takes some trial and error.

[1]: https://wcedmisten.fyi/post/keyboard-shortcuts-userscripts/#....

I use this website for work. That search page is certainly dated, but may I suggest there is actually the very similar Devices@FDA: https://www.accessdata.fda.gov/SCRIPTS/cdrh/devicesatfda/ind...

The Devices@FDA is a single search box, while the one the author used breaks out by field, more useful if you know exactly what company name, etc. you're looking for. Also, Devices@FDA searches both 510(k) and PMA's (the other 1%).

As a side note, for a while the Devices@FDA page was not linked from the "databases" root https://www.fda.gov/medical-devices/device-advice-comprehens.... I emailed them at the comments and feedback link, and they added it within days!

Author here! I didn't know about that Devices@FDA search, thanks for the tip!

My goal for this project is to create a free/open source website that enhances this 510k data based on the public data dumps. I'd be very interested in hearing about how you use the current website for work, and what improvements would be useful for you! My email is in my about page.

The major enhancement is to show predicate device information as a first-class property of each 510k, since right now the data is buried inside various PDFs.

I do this sort of thing a lot, for a bunch of websites I need to use for work. I make tables sortable with DataTables, add buttons, add important info, fix formatting, make things clickable, move things around, sometimes I add whole new UIs. I mainly use TamperMonkey, as I like the built-in editing more than ViolentMonkey (though it still has its problems).

I'd probably reach for playwright to do something like this. The form seems structured enough that you could easily hack something together.

"... it seems to be built from a 1995 tool called Adobe ColdFusion"

As an old guy I have to say the "here be dragons" tone of this phrase made me laugh. I never used it myself but there was a time when ColdFusion was huge.

In 1995, it wasn't an Adobe product. Macromedia was a thing.

I used to code ColdFusion, it was great! Really easy to understand and easy to build custom web sites. I saw it more as a framework than a launguage and it tried to push what a framework could do, making it's own browser widgets. Being Macromedia/Adobe they weren't very good and there were other limitations but you could also make use of it being Java under the hood. It was very popular with the US government and there are still a few (but decreasing) number of developers maintaining these old CF sites.

Don't know VM has a shortcut helper, good to know.

Also I highly recommend VM as your main userscript runner.

It's fully open-source unlike TM, its development is rapid despite having basically only two developers (use the beta version, if needed), and in my very rudimentary tests it runs faster than other competitors (which only makes a difference when you have 100+ scripts or very heavy ones, of course.)

Website keyboard “shortcuts” are the worst, they always break other things to give a very non standard means to mutate state.

Looking at all of the sites who have taken over Ctrl-K which is the browser shortcut to jump to the search bar.

This gets me every day, so annoying. Workaround is ctrl+L (or alt+d) then ctrl+k.

A new one I just encountered is a site where both spacebar and shift+spacebar made the page scroll downwards.

Archive Link: https://archive.is/wzMK3

Nice work and thanks for sharing, it's a good source of inspiration for similarly antiquated government web sites.

i think there are some situations where this is a brilliant and perfect answer and none other answer will be better.

in a lot of cases, a job that restricts you from using industry standard web automation tools like puppeteer or playwright or whatever is also going to restrict you from installing browser extensions.

Reply on news.ycombinator.com