meno-core 1.0.53 → 1.1.0

package/lib/shared/tree/PathBuilder.ts

@@ -16,8 +16,8 @@ import { isComponentNode, isSlotMarker, isLocaleListNode, isCMSListNode, isListN
  * Node path data containing both logical and rendered paths
  */
 export interface NodePathData {
-  path: Path;           // Logical path in data structure
-  renderedPath: Path;   // Path adjusted for component structure wrapping
+  path: Path; // Logical path in data structure
+  renderedPath: Path; // Path adjusted for component structure wrapping
   /**
    * For slot markers being edited from inside their host component: the
    * page-absolute rendered paths of every DOM position the slot occupies
@@ -50,6 +50,9 @@ function findSlotMarkerPath(structure: any, currentPath: Path = [0]): Path | nul
   for (let i = 0; i < structure.children.length; i++) {
     const child = structure.children[i];
 
+    // Text children can't be (or contain) slot markers
+    if (typeof child === 'string') continue;
+
     if (isSlotMarker(child)) {
       return [...currentPath, i];
     }
@@ -86,7 +89,7 @@ function calculateRenderedPath(
   logicalPath: Path,
   currentNode: any,
   globalComponentRegistry: any,
-  navigationHistory?: NavigationContext[]
+  navigationHistory?: NavigationContext[],
 ): Path {
   if (!currentNode || logicalPath.length === 0) {
     return logicalPath;
@@ -107,7 +110,7 @@ function calculateRenderedPath(
     // Use the most recent (current) navigation context's instanceChildren
     // When editing nested components A > B, we need B's instanceChildren, not A's
     const currentContext = navigationHistory[navigationHistory.length - 1];
-    const instanceChildren = currentContext.instanceChildren;
+    const instanceChildren = currentContext?.instanceChildren;
     const instanceChildrenCount = Array.isArray(instanceChildren) ? instanceChildren.length : 0;
 
     if (instanceChildrenCount > 0) {
@@ -117,8 +120,8 @@ function calculateRenderedPath(
         // Check if this path is for an element AFTER the slot marker
         const markerDepth = rootSlotPath.length - 1;
         if (logicalPath.length > markerDepth) {
-          const indexAtMarkerLevel = logicalPath[markerDepth];
-          const markerIndex = rootSlotPath[markerDepth];
+          const indexAtMarkerLevel = logicalPath[markerDepth] ?? 0;
+          const markerIndex = rootSlotPath[markerDepth] ?? 0;
 
           if (indexAtMarkerLevel > markerIndex) {
             // This path is after the slot marker in the structure
@@ -135,10 +138,11 @@ function calculateRenderedPath(
   // Build rendered path incrementally by walking through the logical path
   // and checking if each parent is a component with a nested slot
   let renderedPath: Path = [0];
-  let node = currentNode;
+  let node: ComponentNode | null | undefined = currentNode;
 
   for (let i = 1; i < logicalPath.length; i++) {
-    let childIndex = logicalPath[i];
+    const originalIndex = logicalPath[i] ?? 0;
+    let childIndex = originalIndex;
 
     // Apply post-slot offset at the appropriate depth
     // This handles elements that come AFTER a slot marker in the component structure
@@ -149,7 +153,7 @@ function calculateRenderedPath(
     if (!node || !hasChildren(node)) break;
 
     const children = node.children;
-    const childNode = children[logicalPath[i]]; // Use original index for traversal
+    const childNode = children[originalIndex]; // Use original index for traversal
 
     // Check if current node (the parent) is a component
     if (isComponentNode(node)) {
@@ -164,7 +168,7 @@ function calculateRenderedPath(
           // prefix = path from component root to slot's parent container
           // For [0, 0, 0]: prefix = [0] (the middle elements, excluding root and slot index)
           const prefix = slotPath.slice(1, -1);
-          const slotIndex = slotPath[slotPath.length - 1];
+          const slotIndex = slotPath[slotPath.length - 1] ?? 0;
 
           // Child renders at: currentRenderedPath + prefix + (slotIndex + adjustedChildIndex)
           renderedPath = [...renderedPath, ...prefix, slotIndex + childIndex];
@@ -181,7 +185,9 @@ function calculateRenderedPath(
       renderedPath = [...renderedPath, childIndex];
     }
 
-    node = childNode;
+    // Text children have no children of their own — the next iteration's
+    // hasChildren() check breaks out, same as before, but keep `node` typed.
+    node = typeof childNode === 'string' ? undefined : childNode;
   }
 
   return renderedPath;
@@ -197,16 +203,16 @@ function calculateRenderedPath(
  * CMS item context for elements inside CMS List(s)
  */
 export interface CMSItemContext {
-  itemIndexPath: number[];  // e.g., [0] for single list, [0, 2] for nested
-  listPaths: Path[];        // Parallel array of list node paths
+  itemIndexPath: number[]; // e.g., [0] for single list, [0, 2] for nested
+  listPaths: Path[]; // Parallel array of list node paths
 }
 
 export interface NavigationContext {
-  file?: any;  // FileItem - optional as not all contexts have file
+  file?: any; // FileItem - optional as not all contexts have file
   componentInstancePath: Path | null;
-  componentInstanceRenderedPath?: Path | null;  // Rendered path for accurate DOM queries
-  instanceChildren?: Array<ComponentNode | string>;  // Children of the component instance (for path offset calculation)
-  cmsItemContext?: CMSItemContext | null;  // CMS context when editing component inside CMS List
+  componentInstanceRenderedPath?: Path | null; // Rendered path for accurate DOM queries
+  instanceChildren?: Array<ComponentNode | string>; // Children of the component instance (for path offset calculation)
+  cmsItemContext?: CMSItemContext | null; // CMS context when editing component inside CMS List
 }
 
 /**
@@ -218,16 +224,14 @@ export interface NavigationContext {
  * buildTreePathsWithRendered prepends, and to know how many leading elements
  * to strip when extracting a component-internal path back out.
  */
-export function computeCumulativeInstancePath(
-  navigationHistory: NavigationContext[] | undefined,
-): Path | null {
+export function computeCumulativeInstancePath(navigationHistory: NavigationContext[] | undefined): Path | null {
   if (!navigationHistory || navigationHistory.length === 0) return null;
   let cumulative: Path | null =
-    navigationHistory[0].componentInstanceRenderedPath ?? navigationHistory[0].componentInstancePath;
+    navigationHistory[0]?.componentInstanceRenderedPath ?? navigationHistory[0]?.componentInstancePath ?? null;
   if (!cumulative) return null;
   for (let i = 1; i < navigationHistory.length; i++) {
-    const next =
-      navigationHistory[i].componentInstanceRenderedPath ?? navigationHistory[i].componentInstancePath;
+    const entry = navigationHistory[i];
+    const next = entry?.componentInstanceRenderedPath ?? entry?.componentInstancePath;
     if (next) {
       cumulative = [...cumulative, ...next.slice(1)];
     }
@@ -264,7 +268,7 @@ export function computeCumulativeInstancePath(
 export function buildTreePathsWithRendered(
   pageData: PageData,
   globalComponentRegistry?: any,
-  navigationHistory?: NavigationContext[]
+  navigationHistory?: NavigationContext[],
 ): NodePathData[] {
   const rootData = getRootData(pageData);
   if (!rootData) return [];
@@ -281,9 +285,9 @@ export function buildTreePathsWithRendered(
   // post-slot offset (the LAST navigation entry's instanceChildren).
   const hostInstanceChildrenCount =
     navigationHistory && navigationHistory.length > 0
-      ? (Array.isArray(navigationHistory[navigationHistory.length - 1].instanceChildren)
-          ? navigationHistory[navigationHistory.length - 1].instanceChildren!.length
-          : 0)
+      ? Array.isArray(navigationHistory[navigationHistory.length - 1]?.instanceChildren)
+        ? navigationHistory[navigationHistory.length - 1]!.instanceChildren!.length
+        : 0
       : 0;
 
   function traverse(node: ComponentNode, currentPath: Path = [0]): void {
@@ -308,8 +312,8 @@ export function buildTreePathsWithRendered(
         : undefined;
 
     result.push({
-      path: currentPath,  // Keep logical path component-relative
-      renderedPath: adjustedRenderedPath,  // Adjust rendered path for page-relative queries
+      path: currentPath, // Keep logical path component-relative
+      renderedPath: adjustedRenderedPath, // Adjust rendered path for page-relative queries
       ...(slotRenderedPaths ? { slotRenderedPaths } : {}),
     });
 
@@ -321,7 +325,15 @@ export function buildTreePathsWithRendered(
         if (
           typeof child === 'object' &&
           child !== null &&
-          ('tag' in child || 'component' in child || 'html' in child || 'src' in child || 'href' in child || isLocaleListNode(child) || isCMSListNode(child) || isListNode(child) || (cumulativeInstancePath && isSlotMarker(child)))
+          ('tag' in child ||
+            'component' in child ||
+            'html' in child ||
+            'src' in child ||
+            'href' in child ||
+            isLocaleListNode(child) ||
+            isCMSListNode(child) ||
+            isListNode(child) ||
+            (cumulativeInstancePath && isSlotMarker(child)))
         ) {
           const childPath = [...currentPath, index];
           traverse(child as ComponentNode, childPath);
@@ -343,7 +355,7 @@ export function buildTreePathsWithRendered(
 function expandSlotRenderedPaths(slotRenderedPath: Path, instanceChildrenCount: number): Path[] {
   if (instanceChildrenCount <= 0 || slotRenderedPath.length === 0) return [];
   const prefix = slotRenderedPath.slice(0, -1);
-  const slotIdx = slotRenderedPath[slotRenderedPath.length - 1];
+  const slotIdx = slotRenderedPath[slotRenderedPath.length - 1] ?? 0;
   const out: Path[] = [];
   for (let i = 0; i < instanceChildrenCount; i++) {
     out.push([...prefix, slotIdx + i]);
@@ -365,7 +377,7 @@ function expandSlotRenderedPaths(slotRenderedPath: Path, instanceChildrenCount:
 export function buildComponentTreePaths(
   componentStructure: ComponentNode,
   globalComponentRegistry?: any,
-  navigationHistory?: NavigationContext[]
+  navigationHistory?: NavigationContext[],
 ): NodePathData[] {
   const result: NodePathData[] = [];
 
@@ -374,9 +386,9 @@ export function buildComponentTreePaths(
 
   const hostInstanceChildrenCount =
     navigationHistory && navigationHistory.length > 0
-      ? (Array.isArray(navigationHistory[navigationHistory.length - 1].instanceChildren)
-          ? navigationHistory[navigationHistory.length - 1].instanceChildren!.length
-          : 0)
+      ? Array.isArray(navigationHistory[navigationHistory.length - 1]?.instanceChildren)
+        ? navigationHistory[navigationHistory.length - 1]!.instanceChildren!.length
+        : 0
       : 0;
 
   function traverse(node: ComponentNode, currentPath: Path = [0]): void {
@@ -409,7 +421,15 @@ export function buildComponentTreePaths(
         if (
           typeof child === 'object' &&
           child !== null &&
-          ('tag' in child || 'component' in child || 'html' in child || 'src' in child || 'href' in child || isLocaleListNode(child) || isCMSListNode(child) || isListNode(child) || isSlotMarker(child))
+          ('tag' in child ||
+            'component' in child ||
+            'html' in child ||
+            'src' in child ||
+            'href' in child ||
+            isLocaleListNode(child) ||
+            isCMSListNode(child) ||
+            isListNode(child) ||
+            isSlotMarker(child))
         ) {
           const childPath = [...currentPath, index];
           traverse(child as ComponentNode, childPath);
@@ -425,24 +445,16 @@ export function buildComponentTreePaths(
 /**
  * Find NodePathData by logical path
  */
-export function findPathData(
-  pathsData: NodePathData[],
-  searchPath: Path
-): NodePathData | undefined {
+export function findPathData(pathsData: NodePathData[], searchPath: Path): NodePathData | undefined {
   return pathsData.find(
-    (item) =>
-      item.path.length === searchPath.length &&
-      item.path.every((val, idx) => val === searchPath[idx])
+    (item) => item.path.length === searchPath.length && item.path.every((val, idx) => val === searchPath[idx]),
   );
 }
 
 /**
  * Get all ancestors for a path (including the path itself)
  */
-export function getPathAncestors(
-  pathsData: NodePathData[],
-  searchPath: Path
-): NodePathData[] {
+export function getPathAncestors(pathsData: NodePathData[], searchPath: Path): NodePathData[] {
   const ancestors: NodePathData[] = [];
 
   for (let i = 1; i <= searchPath.length; i++) {

package/lib/shared/treePathUtils.test.ts

@@ -16,6 +16,7 @@ import {
   isComponentNodeParent,
   getParentChildren,
   setParentChildren,
+  findPathToNodeByReference,
 } from './treePathUtils';
 import type { ComponentNode, PageData, JSONPage, PageDataWithComponent, HtmlNode } from './types';
 import { NODE_TYPE } from './constants';
@@ -243,11 +244,7 @@ describe('extractStructureWithoutStyles', () => {
 });
 
 describe('calculateInsertionIndex', () => {
-  const mockChildren = [
-    createNode({ tag: 'p' }),
-    createNode({ tag: 'span' }),
-    createNode({ tag: 'div' }),
-  ];
+  const mockChildren = [createNode({ tag: 'p' }), createNode({ tag: 'span' }), createNode({ tag: 'div' })];
   const emptyNodeDataMap = new Map<string, ComponentNode | string>();
 
   test('should use childIndex when provided', () => {
@@ -280,7 +277,7 @@ describe('calculateInsertionIndex', () => {
 
   test('should handle childAfterItem with nodeDataMap', () => {
     const nodeDataMap = new Map<string, ComponentNode | string>();
-    nodeDataMap.set('path_0', mockChildren[0]);
+    nodeDataMap.set('path_0', mockChildren[0]!);
 
     const target = { childAfterItem: { index: 'path_0' } };
     expect(calculateInsertionIndex(target, mockChildren, nodeDataMap)).toBe(1);
@@ -288,7 +285,7 @@ describe('calculateInsertionIndex', () => {
 
   test('should handle childBeforeItem with nodeDataMap', () => {
     const nodeDataMap = new Map<string, ComponentNode | string>();
-    nodeDataMap.set('path_1', mockChildren[1]);
+    nodeDataMap.set('path_1', mockChildren[1]!);
 
     const target = { childBeforeItem: { index: 'path_1' } };
     expect(calculateInsertionIndex(target, mockChildren, nodeDataMap)).toBe(1);
@@ -411,6 +408,16 @@ describe('isComponentNodeParent', () => {
     expect(isComponentNodeParent(node)).toBe(true);
   });
 
+  test('should return true for CustomNode', () => {
+    const node = { type: NODE_TYPE.CUSTOM, src: 'Callout.astro' } as ComponentNode;
+    expect(isComponentNodeParent(node)).toBe(true);
+  });
+
+  test('should return true for IslandNode', () => {
+    const node = { type: NODE_TYPE.ISLAND, src: 'Chart.tsx' } as ComponentNode;
+    expect(isComponentNodeParent(node)).toBe(true);
+  });
+
   test('should return false for PageData', () => {
     const pageData = createPageData();
     expect(isComponentNodeParent(pageData)).toBe(false);
@@ -521,11 +528,7 @@ describe('edge cases', () => {
 
   test('should handle mixed children (nodes and strings)', () => {
     const pageData = createPageData({
-      children: [
-        'text before',
-        createNode({ tag: 'span' }),
-        'text after',
-      ],
+      children: ['text before', createNode({ tag: 'span' }), 'text after'],
     });
 
     // Path to span should work
@@ -537,3 +540,39 @@ describe('edge cases', () => {
     expect(textResult).toBeNull();
   });
 });
+
+describe('findPathToNodeByReference', () => {
+  test('finds a nested node by reference and returns its [0, ...] path', () => {
+    const target: ComponentNode = { type: NODE_TYPE.NODE, tag: 'section', children: ['Nav'] };
+    const pageData: PageData = {
+      root: {
+        type: NODE_TYPE.NODE,
+        tag: 'div',
+        children: [
+          { type: NODE_TYPE.NODE, tag: 'header', children: ['Promo'] },
+          { type: NODE_TYPE.NODE, tag: 'main', children: [target] },
+        ],
+      },
+    };
+
+    expect(findPathToNodeByReference(pageData, target)).toEqual([0, 1, 0]);
+  });
+
+  test('returns [0] when the target is the root node', () => {
+    const root: ComponentNode = { type: NODE_TYPE.NODE, tag: 'div', children: [] };
+    expect(findPathToNodeByReference({ root }, root)).toEqual([0]);
+  });
+
+  test('returns null for a structurally-equal but non-identical node', () => {
+    const pageData: PageData = {
+      root: { type: NODE_TYPE.NODE, tag: 'div', children: [{ type: NODE_TYPE.NODE, tag: 'p', children: ['hi'] }] },
+    };
+    // Same shape, different reference -> not found (reference identity only).
+    const lookalike: ComponentNode = { type: NODE_TYPE.NODE, tag: 'p', children: ['hi'] };
+    expect(findPathToNodeByReference(pageData, lookalike)).toBeNull();
+  });
+
+  test('returns null when there is no root', () => {
+    expect(findPathToNodeByReference({} as PageData, { type: NODE_TYPE.NODE, tag: 'div' })).toBeNull();
+  });
+});