hopding / js-visualizer-9000-client Goto Github PK

Based on current behaviour, console.log() is visualized using showSnackbar() in the client side.

Currently only user-defined function will get instrumented via Tracer.EnterFunc and Tracer.ExitFunc.

As console.log() is a function call, perhaps we should make visualizing call stack more complete. This can be implemented from server-side or client-side.

However, my opinion skew towards the client-side as this is merely a presentation issue and we do not need to support much function call anyway.

We could simply update this to the supported call expression. The timeout of 500 is picked according to the puase value adopted in the autoPlayEvents()
App.js

 playNextEvent = () => {
// other code
  if (type === 'ConsoleLog') {
        this.pushCallStackFrame(type);
        this.showSnackbar('info', message);
        setTimeout(() => {
          this.popCallStackFrame();
        }, 500);
      }
// other code
}

Let me know what you think!

when visualizing javaScript code, their should be button to go back the step

when i select one one of the code templates and click run button - nothing happens, RUN button is loading and still loading permanentl

y

its a feature request, could we add setImmediate, process.nextTick

thanks

When I copy the code to the page, the website is clean and the console displays the following error message:

"react-dom.production.min.js:2857 Uncaught DOMException: Failed to execute 'btoa' on 'Window': The string to be encoded contains characters outside of the Latin1 range."

I searched from the internet,The reason seems to be this：

This error indicates that a string that does not conform to the Latin1 character set range was passed while using the btoa function. The Latin1 character set (also known as ISO-8859-1) contains most commonly used Latin letters and numbers, but excludes Chinese characters and some other common non-Latin characters.

To solve this problem, you need to transcode the strings so that they conform to the range of the Latin1 character set. This can be done using JavaScript's encodeURIComponent function, for example:

var str = "这是一个包含中文字符的字符串";
var encodedStr = encodeURIComponent(str);

// now you can use btoa safely
var base64Str = btoa(encodedStr);

could you please fix this problem?thank you very much!

Your website(https://www.jsv9000.app/) is very good!

Task queue is not extrictly FIFO, as this code demonstrate.

const promise1 = new Promise((resolve, reject) => {
  setTimeout(resolve, 3000, 'one');
});

const promise2 = new Promise((resolve, reject) => {
  setTimeout(resolve, 0, 'two');
});

Promise.race([promise1, promise2]).then(function race(value) {
  console.log(value);
  // Both resolve, but promise2 is faster
});
// expected output: "two"

Heroku just recently killed their free plan and it seems that your app is affected.

Console error: WebSocket connection to 'wss://js-visualizer-9000-server.herokuapp.com/' failed: Invalid frame header

Hi,
first off, this project is really cool. it's a great idea!

It's not really that important, but i thought it would be cool if the program highlighted currently executed line while stepping through code.

Keep in mind this is only a proposition, so maybe the visualizer doesn't actually need it.

Thanks for great job and keep it up!

Don't support async、await key words.

microtask queue workd correctly on the following picture
https://github.com/Hopding/js-visualizer-9000-client/blob/master/demo.gif

but when i download the client and the server,same running code the result is different,the 'logC' is not in the microtask!!!
i try to refund the source code ,but it still not work correctly!

Hey, thank you for this tool, it's really nice, but currently is not working :(

This is what I in crhome's dev console:

WebSocket connection to 'wss://js-visualizer-9000-server.herokuapp.com/' failed:

Bug

The links in repo page/README ref to: https://jsv9000.app/

Doesn't get through:

Fix

Adjust DNS or web server config might be the right fix, but for a patch, this ref will work: https://www.jsv9000.app/

PostData

Awesome job with this, I work as an instructor at a web engineering school, and I have used it so much as a resource to talk about the event loop. Respect!

Thank you for great work!

Bug

1. Open https://jsv9000.app/
2. Input #code-editor with Japanese mode (or paste あ)
3. Failed to execute btoa

Fix

The toBinary function may be helpful.

https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/btoa#unicode_strings

The website breaks when I add any Cyrillic character to the text field, for example: а б в г д е