feat: Visual debugger #8344
feat: Visual debugger #8344
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
1 Skipped Deployment
|
|
i get the menus in the footer but they do nothing. can you send a short video of its process and application? |
|
It is only available in DEV mode and only in the excalidraw-app. The app menu now contain a new menu item called Visual Debug. It toggles the functionality at your discretion. You will see if it's activated when you see a gray X on the scene coordinates 0,0. In order to take advantage of it's capabilities, you have to use a debug function from packages/excalidraw/visualdebug.ts. There are options to have frame-by-frame clearing and persistent paint, depending on your use-case. A very useful improvement I was able to add are "pages", where you can turn the page from your code and start debug drawing on a new page in permanent painting mode, then when you get back to the app, you can see it frame-by-frame. |
Add visual debugger to the Excalidraw app (only).
Motivation: In order to efficiently debug vector math, geometric calculations and similar situations we need a way to visualize concepts, like lines, points, boxes and such.
The feature should only work in DEV mode, should not be included in production builds as much as possible and the rendering should only be in the excalidraw-app package, avoiding pollution of the main excalidraw package.
Feature can be activated in the main menu (hamburger menu) via the "Visual debug" menu item. The setting is preserved until deactivated.
Available debug commands (imported from
packages/excalidraw/visualdebug.ts:All debug functions allow receiving an optional options object, which let's you set the color and permanence of the debug object. Points get a "fuzzy" option, which adds a small random bias to the point in order to distinguish multiple points drawn over each other.