improve debug

excalidraw-app/components/FreedrawDebugSliders.tsx

@@ -1,6 +1,11 @@
-import { DRAWING_CONFIGS } from "@excalidraw/element";
+import { DRAWING_CONFIGS, isFreeDrawElement } from "@excalidraw/element";
 import { useState, useEffect } from "react";
 
+import { useUIAppState } from "@excalidraw/excalidraw/context/ui-appState";
+import { useExcalidrawElements } from "@excalidraw/excalidraw/components/App";
+
+import { round } from "../../packages/math/src";
+
 export const FreedrawDebugSliders = () => {
   const [streamline, setStreamline] = useState<number>(
     DRAWING_CONFIGS.default.variable.streamline,
@@ -14,7 +19,10 @@ export const FreedrawDebugSliders = () => {
       window.h = {} as any;
     }
     if (!window.h.debugFreedraw) {
-      window.h.debugFreedraw = DRAWING_CONFIGS.default.variable;
+      window.h.debugFreedraw = {
+        enabled: true,
+        ...DRAWING_CONFIGS.default.variable,
+      };
     }
 
     setStreamline(window.h.debugFreedraw.streamline);
@@ -35,6 +43,29 @@ export const FreedrawDebugSliders = () => {
     }
   };
 
+  const [enabled, setEnabled] = useState<boolean>(
+    window.h?.debugFreedraw?.enabled ?? true,
+  );
+
+  // counter incrasing each 50ms
+  const [, setCounter] = useState<number>(0);
+  useEffect(() => {
+    const interval = setInterval(() => {
+      setCounter((prev) => prev + 1);
+    }, 50);
+
+    return () => clearInterval(interval);
+  }, []);
+
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  const elements = useExcalidrawElements();
+  const appState = useUIAppState();
+
+  const newFreedrawElement =
+    appState.newElement && isFreeDrawElement(appState.newElement)
+      ? appState.newElement
+      : null;
+
   return (
     <div
       style={{
@@ -53,6 +84,37 @@ export const FreedrawDebugSliders = () => {
         fontFamily: "monospace",
       }}
     >
+      {newFreedrawElement && (
+        <div>
+          pressures:{" "}
+          {newFreedrawElement.simulatePressure
+            ? "simulated"
+            : JSON.stringify(
+                newFreedrawElement.pressures
+                  .slice(-4)
+                  .map((x) => round(x, 2))
+                  .join(" ") || [],
+              )}{" "}
+          ({round(window.__lastPressure__ || 0, 2) || "?"})
+        </div>
+      )}
+      <div>
+        <label>
+          {" "}
+          enabled
+          <br />
+          <input
+            type="checkbox"
+            checked={enabled}
+            onChange={(e) => {
+              if (window.h.debugFreedraw) {
+                window.h.debugFreedraw.enabled = e.target.checked;
+                setEnabled(e.target.checked);
+              }
+            }}
+          />
+        </label>
+      </div>
       <div>
         <label>
           Streamline: {streamline.toFixed(2)}

packages/excalidraw/components/App.tsx

@@ -7474,7 +7474,10 @@ class App extends React.Component<AppProps, AppState> {
       y: gridY,
     });
 
-    const simulatePressure = event.pressure === 0.5 || event.pressure === 0;
+    const simulatePressure =
+      event.pressure === 0.5 || event.pressure === 0 || event.pressure === 1;
+
+    window.__lastPressure__ = event.pressure;
 
     const freedrawConfig = getFreedrawConfig(
       event.pointerType,
@@ -7497,8 +7500,13 @@ class App extends React.Component<AppProps, AppState> {
       drawingConfigs: {
         fixedStrokeWidth: this.state.currentItemFixedStrokeWidth,
         streamline:
-          window.h?.debugFreedraw?.streamline ?? freedrawConfig.streamline,
-        simplify: window.h?.debugFreedraw?.simplify ?? freedrawConfig.simplify,
+          (window.h?.debugFreedraw?.enabled
+            ? window.h?.debugFreedraw?.streamline
+            : null) ?? freedrawConfig.streamline,
+        simplify:
+          (window.h?.debugFreedraw?.enabled
+            ? window.h?.debugFreedraw?.simplify
+            : null) ?? freedrawConfig.simplify,
       },
       locked: false,
       frameId: topLayerFrame ? topLayerFrame.id : null,
@@ -11141,6 +11149,7 @@ class App extends React.Component<AppProps, AppState> {
 // -----------------------------------------------------------------------------
 declare global {
   interface Window {
+    __lastPressure__?: number;
     h: {
       scene: Scene;
       elements: readonly ExcalidrawElement[];
@@ -11152,6 +11161,7 @@ declare global {
       debugFreedraw?: {
         streamline: number;
         simplify: number;
+        enabled: boolean;
       };
     };
   }
@@ -11162,8 +11172,10 @@ export const createTestHook = () => {
     window.h = window.h || ({} as Window["h"]);
 
     // Initialize debug freedraw parameters
-    window.h.debugFreedraw =
-      window.h.debugFreedraw || DRAWING_CONFIGS.default.variable;
+    window.h.debugFreedraw = {
+      enabled: true,
+      ...(window.h.debugFreedraw || DRAWING_CONFIGS.default.variable),
+    };
 
     Object.defineProperties(window.h, {
       elements: {