[utility script] functionally replace Devtools 'Copy JS path' with 'Copy jQuery path'

Dr. House — Mon, 23 Nov 2020 06:20:02 +0000

When working with jQuery on webpages, I regularly use the Devtools context menu option 'Copy JS path', this produces something like:

document.querySelector('element1 > element2')

then I always need to replace 'document.querySelector' with a '$' for jQuery to work... so tedious!

I wrote a small Autohotkey utility script which detects 'document.querySelector' when in the clipboard and automatically replaces it with a '$' - it's very simple and effective.

install Authotkey, save as 'clippie.ahk' (for example):

#Persistent
OnClipboardChange("ClipChanged")
return

ClipChanged(Type) {
StringReplace, clipboard, clipboard, document.querySelector, $, All
}

(minor note: if you ever need to copy/paste 'document.querySelector', just copy/paste 'document.querySelecto' and then manually add 'r' at the end)

Or, if you're brave, I compiled the script into an .exe you can download:
clippie - Copy jQuery path

DEV Community: Dr. House

[utility script] functionally replace Devtools 'Copy JS path' with 'Copy jQuery path'