fix: Use [ and ] instead of ( and ) for debug transform (#68142)

### What? Use `[]` instead of `()` for call stack. ### Why? #68056 (comment) ### How?
vercel · Jul 25, 2024 · 29c23b2 · 29c23b2
1 parent d4eb89d
commit 29c23b2
Show file tree

Hide file tree

Showing 6 changed files with 21 additions and 21 deletions.
diff --git a/crates/next-custom-transforms/src/transforms/debug_fn_name.rs b/crates/next-custom-transforms/src/transforms/debug_fn_name.rs
@@ -124,7 +124,7 @@ impl VisitMut for DebugFnName {
                 if !self.path.is_empty() {
                     self.path.push('.');
                 }
-                let _ = write!(self.path, "{target}({name})");
+                let _ = write!(self.path, "{target}[{name}]");
 
                 n.visit_mut_children_with(self);
 

diff --git a/crates/next-custom-transforms/tests/fixture/debug-fn-name/anonymous-component/output.js b/crates/next-custom-transforms/tests/fixture/debug-fn-name/anonymous-component/output.js
@@ -6,9 +6,9 @@ const Component = ()=>{
         "Component.useEffect": ()=>{}
     }["Component.useEffect"]);
     const onClick = useCallback({
-        "Component.useCallback(onClick)": ()=>[]
-    }["Component.useCallback(onClick)"]);
+        "Component.useCallback[onClick]": ()=>[]
+    }["Component.useCallback[onClick]"]);
     const computed = useMemo({
-        "Component.useMemo(computed)": ()=>{}
-    }["Component.useMemo(computed)"]);
+        "Component.useMemo[computed]": ()=>{}
+    }["Component.useMemo[computed]"]);
 };
diff --git a/crates/next-custom-transforms/tests/fixture/debug-fn-name/composite-hook/output.js b/crates/next-custom-transforms/tests/fixture/debug-fn-name/composite-hook/output.js
@@ -6,9 +6,9 @@ function useSomething() {
         "useSomething.useEffect": ()=>{}
     }["useSomething.useEffect"]);
     const onClick = useCallback({
-        "useSomething.useCallback(onClick)": ()=>[]
-    }["useSomething.useCallback(onClick)"]);
+        "useSomething.useCallback[onClick]": ()=>[]
+    }["useSomething.useCallback[onClick]"]);
     const computed = useMemo({
-        "useSomething.useMemo(computed)": ()=>{}
-    }["useSomething.useMemo(computed)"]);
+        "useSomething.useMemo[computed]": ()=>{}
+    }["useSomething.useMemo[computed]"]);
 }
diff --git a/crates/next-custom-transforms/tests/fixture/debug-fn-name/export-default/output.js b/crates/next-custom-transforms/tests/fixture/debug-fn-name/export-default/output.js
@@ -6,9 +6,9 @@ export default (()=>{
         "useEffect": ()=>{}
     }["useEffect"]);
     const onClick = useCallback({
-        "useCallback(onClick)": ()=>[]
-    }["useCallback(onClick)"]);
+        "useCallback[onClick]": ()=>[]
+    }["useCallback[onClick]"]);
     const computed = useMemo({
-        "useMemo(computed)": ()=>{}
-    }["useMemo(computed)"]);
+        "useMemo[computed]": ()=>{}
+    }["useMemo[computed]"]);
 });
diff --git a/crates/next-custom-transforms/tests/fixture/debug-fn-name/hoc/output.js b/crates/next-custom-transforms/tests/fixture/debug-fn-name/hoc/output.js
@@ -6,9 +6,9 @@ const Component = someHoC(()=>{
         "Component.useEffect": ()=>{}
     }["Component.useEffect"]);
     const onClick = useCallback({
-        "Component.useCallback(onClick)": ()=>[]
-    }["Component.useCallback(onClick)"]);
+        "Component.useCallback[onClick]": ()=>[]
+    }["Component.useCallback[onClick]"]);
     const computed = useMemo({
-        "Component.useMemo(computed)": ()=>{}
-    }["Component.useMemo(computed)"]);
+        "Component.useMemo[computed]": ()=>{}
+    }["Component.useMemo[computed]"]);
 });
diff --git a/crates/next-custom-transforms/tests/fixture/debug-fn-name/normal/output.js b/crates/next-custom-transforms/tests/fixture/debug-fn-name/normal/output.js
@@ -6,9 +6,9 @@ function MyComponent() {
         "MyComponent.useEffect": ()=>{}
     }["MyComponent.useEffect"]);
     const onClick = useCallback({
-        "MyComponent.useCallback(onClick)": ()=>[]
-    }["MyComponent.useCallback(onClick)"]);
+        "MyComponent.useCallback[onClick]": ()=>[]
+    }["MyComponent.useCallback[onClick]"]);
     const computed = useMemo({
-        "MyComponent.useMemo(computed)": ()=>{}
-    }["MyComponent.useMemo(computed)"]);
+        "MyComponent.useMemo[computed]": ()=>{}
+    }["MyComponent.useMemo[computed]"]);
 }