Python
/
ruff
mirror of https://github.com/astral-sh/ruff
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity
ruff/playground
History
Micha Reiser a4ba10ff0a
[red-knot] Add basic on-hover to playground and LSP (#17057) 
## Summary

Implement a very basic hover in the playground and LSP.

It's basic, because it only shows the type on-hover. Most other LSPs
also show:

* The signature of the symbol beneath the cursor. E.g. `class
Test(a:int, b:int)` (we want something like
54f7da25f9/packages/pyright-internal/src/analyzer/typeEvaluator.ts (L21929-L22129))
* The symbols' documentation
* Do more fancy markdown rendering

I decided to defer these features for now because it requires new
semantic APIs (similar to *goto definition*), and investing in fancy
rendering only makes sense once we have the relevant data.

Closes [#16826](https://github.com/astral-sh/ruff/issues/16826)

## Test Plan



https://github.com/user-attachments/assets/044aeee4-58ad-4d4e-9e26-ac2a712026be


https://github.com/user-attachments/assets/4a1f4004-2982-4cf2-9dfd-cb8b84ff2ecb
 		2025-04-04 08:13:43 +02:00
..
api [playground] Use cursor for clickable elements (#16833) 2025-03-18 18:06:00 +01:00
knot [red-knot] Add basic on-hover to playground and LSP (#17057) 2025-04-04 08:13:43 +02:00
ruff [playground] Allow selecting the diagnostic message (#17051) 2025-03-28 20:58:05 +00:00
shared [red-knot] Incorporate recent ruff server improvements into red knot's LSP (#17044) 2025-03-28 18:39:18 +00:00
.gitignore Remove all `useEffect` usages (#12659) 2024-08-08 13:16:38 +02:00
.prettierignore Red Knot Playground (#12681) 2025-03-18 17:17:11 +01:00
README.md Red Knot Playground (#12681) 2025-03-18 17:17:11 +01:00
eslint.config.mjs Red Knot Playground (#12681) 2025-03-18 17:17:11 +01:00
package-lock.json Update dependency vite to v6.2.4 (#17104) 2025-04-01 08:29:59 +02:00
package.json Red Knot Playground (#12681) 2025-03-18 17:17:11 +01:00
tsconfig.json Red Knot Playground (#12681) 2025-03-18 17:17:11 +01:00
tsconfig.node.json Red Knot Playground (#12681) 2025-03-18 17:17:11 +01:00

README.md

playground

In-browser playground for Ruff. Available https://play.ruff.rs/.

Getting started

Install the NPM dependencies with npm install, and run, and run the development server with npm start --workspace ruff-playground or npm start --workspace knot-playground. You may need to restart the server after making changes to Ruff or Red Knot to re-build the WASM module.

To run the datastore, which is based on Workers KV, install the Wrangler CLI, then run npx wrangler dev --local from the ./playground/api directory. Note that the datastore is only required to generate shareable URLs for code snippets. The development datastore does not require Cloudflare authentication or login, but in turn only persists data locally.

Architecture

The playground is implemented as a single-page React application powered by Vite, with the editor experience itself powered by Monaco.

The playground stores state in localStorage, but supports persisting code snippets to a persistent datastore based on Workers KV and exposed via a Cloudflare Worker.

The playground design is originally based on Tailwind Play, with additional inspiration from the Biome Playground.

Known issues

Stack overflows

If you see stack overflows in the playground, build the WASM module in release mode: npm run --workspace knot-playground build:wasm.