lukehaas / RunJS

RunJS is a JavaScript playground for macOS, Windows and Linux. Write code with instant feedback and access to Node.js and browser APIs.
https://runjs.app
2.05k stars 44 forks source link

[Feature]: In top-level await mode, allow toggling lines that will be wrapped with `console.log(inspect(LINE))` in evaluation #631

Closed iki closed 1 month ago

lukehaas commented 5 months ago

So, for example, transform this:

const example = 5;

into this:

console.log(inspect(const example = 5;));

Is this what you mean? @iki

iki commented 5 months ago

@lukehaas yes, the goal is to make evaluating easy in top-level await mode

lukehaas commented 5 months ago

I was kind of joking in my previous comment. console.log(inspect(const example = 5;)) is not valid code.

It may be more helpful to describe the issue you want to solve rather than provide the solution.

iki commented 5 months ago

the goal is to make evaluating expressions easy in top-level await mode

Currently, in top-level await mode, I always have to put this piece code at start

import { inspect } from 'node:util'
const I = (...data: unknown[]) => console.log(inspect(data))

and then wrap each evaluated line with I(...).

The proposed idea is to make it simpler by providing easy way to toggle lines that should be inspected and logged. Maybe with a left bullet like debugger in VSCode.

As for the constraint, if it's not a valid code, then it will give SyntaxError, that's fine.

lukehaas commented 5 months ago

Ok, thanks for clarifying. So this would be a button in the gutter by each line that wraps the line in console.log(inspect(.

Regarding the inspect call what do you gain by adding that here?

iki commented 5 months ago

Yes. And you're right, I use inspect with logging libs, but here it does not make sense,console.log` itself displays the data even better, highlighted and with expandable class props

const test = [{a: 1}, new Map([[1, 1]]), Symbol('a'), new Set([1])]

I(test)
// '[ [ { a: 1 }, Map(1) { 1 => 1 }, Symbol(a), Set(1) { 1 } ] ]'  

console.log(test)
// [
//   { a: 1 },
//   Map(1) {
//     1 => 1,
//     __proto__: {...}
//   },
//   Symbol(a),
//   Set(1) {
//     1,
//     __proto__: {...}
//   }
// ]
lukehaas commented 1 month ago

@iki the latest release no longer needs a setting for top-level await. Are you happy for this to be closed?

iki commented 1 month ago

@lukehaas yes, I saw it, that's awesome 👍