$('.css_selector') shadowed by `$.get` and similar in svelte.js classes

[midzelis]

Describe the bug

In chrome dev tools, $('.css_selector') and $$('.selector') are common shorthand for document.querySelector[All] - when using .svelte.js files, the svelte compiler generates a $ variable which shadows the browsers $ shortcut, making these very useful shortcuts fail when stepping through functions in a svelte.js file.

Reproduction

Create a .svelte.js|ts file.
Place a debugger somewhere in that file
Go to devtools, console and execute $('html') -- error logged

Logs

System Info

System:
    OS: Linux 6.8 Debian GNU/Linux 12 (bookworm) 12 (bookworm)
    CPU: (32) x64 AMD Ryzen 9 5950X 16-Core Processor
    Memory: 21.70 GB / 30.27 GB
    Container: Yes
    Shell: 5.2.15 - /bin/bash
  Binaries:
    Node: 22.14.0 - ~/.volta/tools/image/node/22.14.0/bin/node
    npm: 10.9.2 - ~/.volta/tools/image/node/22.14.0/bin/npm
  npmPackages:
    svelte: ^5.17.4 => 5.20.5

Severity

annoyance

[Ocean-OS]

Is there a reason you can't use document.querySelector/document.querySelectorAll instead of $ and $$?
You could also use $$('.css_selector')[0] as a $ equivalent.