/*
 * Tencent is pleased to support the open source community by making TMagicEditor available.
 *
 * Copyright (C) 2025 Tencent.  All rights reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *   http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
import { describe, expect, test, vi } from 'vitest';

import type { MApp, MContainer, MNode } from '@tmagic/core';
import { NodeType } from '@tmagic/core';

import type { EditorNodeInfo } from '@editor/type';
import { LayerOffset, Layout } from '@editor/type';
import * as editor from '@editor/utils/editor';

describe('util form', () => {
  test('getPageList', () => {
    const pageList = editor.getPageList({
      id: 'app_1',
      type: NodeType.ROOT,
      items: [
        {
          id: 'page_1',
          name: 'index',
          type: NodeType.PAGE,
          items: [],
        },
      ],
    });

    expect(pageList[0].name).toBe('index');
  });

  test('getPageNameList', () => {
    const pageList = editor.getPageNameList([
      {
        id: 'page_1',
        name: 'index',
        type: NodeType.PAGE,
        items: [],
      },
    ]);

    expect(pageList[0]).toBe('index');
  });

  test('generatePageName', () => {
    // 已有一个页面了，再生成出来的name格式为page_${index}
    const name = editor.generatePageName(['index', 'page_2'], NodeType.PAGE);
    // 第二个页面
    expect(name).toBe('page_3');
  });
});

describe('getNodeIndex', () => {
  test('能获取到', () => {
    const index = editor.getNodeIndex(1, {
      id: 2,
      type: NodeType.PAGE,
      items: [
        {
          type: 'text',
          id: 1,
        },
      ],
    });
    expect(index).toBe(0);
  });

  test('不能能获取到', () => {
    // id为1不在查找数据中
    const index = editor.getNodeIndex(1, {
      id: 2,
      type: NodeType.PAGE,
      items: [
        {
          type: 'text',
          id: 3,
        },
      ],
    });
    expect(index).toBe(-1);
  });
});

describe('getRelativeStyle', () => {
  test('正常', () => {
    const style = editor.getRelativeStyle({
      color: 'red',
    });
    expect(style?.position).toBe('relative');
    expect(style?.top).toBe(0);
    expect(style?.left).toBe(0);
    expect(style?.color).toBe('red');
  });
});

describe('moveItemsInContainer', () => {
  test('向下移动', () => {
    const container = { id: 1, type: NodeType.CONTAINER, items: [{ id: 2 }, { id: 3 }, { id: 4 }] };
    editor.moveItemsInContainer([0], container, 0);
    expect(container.items[0].id).toBe(2);
    editor.moveItemsInContainer([0], container, 1);
    expect(container.items[0].id).toBe(2);
    editor.moveItemsInContainer([0], container, 2);
    expect(container.items[0].id).toBe(3);
    expect(container.items[1].id).toBe(2);
    expect(container.items[2].id).toBe(4);
  });
  test('向下移动到最后', () => {
    const container = { id: 1, type: NodeType.CONTAINER, items: [{ id: 2 }, { id: 3 }, { id: 4 }] };
    editor.moveItemsInContainer([0], container, 3);
    expect(container.items[0].id).toBe(3);
    expect(container.items[1].id).toBe(4);
    expect(container.items[2].id).toBe(2);
  });

  test('向上移动', () => {
    const container = { id: 1, type: NodeType.CONTAINER, items: [{ id: 2 }, { id: 3 }, { id: 4 }] };
    editor.moveItemsInContainer([2], container, 3);
    expect(container.items[2].id).toBe(4);
    editor.moveItemsInContainer([2], container, 2);
    expect(container.items[2].id).toBe(4);
    editor.moveItemsInContainer([2], container, 1);
    expect(container.items[0].id).toBe(2);
    expect(container.items[1].id).toBe(4);
    expect(container.items[2].id).toBe(3);
  });
  test('向上移动到最后', () => {
    const container = { id: 1, type: NodeType.CONTAINER, items: [{ id: 2 }, { id: 3 }, { id: 4 }] };
    editor.moveItemsInContainer([2], container, 0);
    expect(container.items[0].id).toBe(4);
    expect(container.items[1].id).toBe(2);
    expect(container.items[2].id).toBe(3);
  });

  test('移动多个', () => {
    const container = {
      id: 1,
      type: NodeType.CONTAINER,
      items: [{ id: 2 }, { id: 3 }, { id: 4 }, { id: 5 }, { id: 6 }, { id: 7 }],
    };
    editor.moveItemsInContainer([0, 5], container, 0);
    expect(container.items[0].id).toBe(2);
    expect(container.items[1].id).toBe(7);
    expect(container.items[2].id).toBe(3);
  });
});

describe('buildChangeRecords', () => {
  test('基础类型值', () => {
    const value = {
      name: 'test',
      age: 25,
      active: true,
    };
    const result = editor.buildChangeRecords(value, '');

    expect(result).toEqual([
      { propPath: 'name', value: 'test' },
      { propPath: 'age', value: 25 },
      { propPath: 'active', value: true },
    ]);
  });

  test('嵌套对象', () => {
    const value = {
      user: {
        name: 'John',
        profile: {
          age: 30,
          city: 'Beijing',
        },
      },
      settings: {
        theme: 'dark',
      },
    };
    const result = editor.buildChangeRecords(value, '');

    expect(result).toEqual([
      { propPath: 'user.name', value: 'John' },
      { propPath: 'user.profile.age', value: 30 },
      { propPath: 'user.profile.city', value: 'Beijing' },
      { propPath: 'settings.theme', value: 'dark' },
    ]);
  });

  test('带有basePath', () => {
    const value = {
      style: {
        width: 100,
        height: 200,
      },
    };
    const result = editor.buildChangeRecords(value, 'node');

    expect(result).toEqual([
      { propPath: 'node.style.width', value: 100 },
      { propPath: 'node.style.height', value: 200 },
    ]);
  });

  test('包含数组', () => {
    const value = {
      items: [1, 2, 3],
      config: {
        list: ['a', 'b'],
      },
    };
    const result = editor.buildChangeRecords(value, '');

    expect(result).toEqual([
      { propPath: 'items', value: [1, 2, 3] },
      { propPath: 'config.list', value: ['a', 'b'] },
    ]);
  });

  test('包含null值', () => {
    const value = {
      data: null,
      info: {
        value: null,
        name: 'test',
      },
    };
    const result = editor.buildChangeRecords(value, '');

    expect(result).toEqual([
      { propPath: 'data', value: null },
      { propPath: 'info.value', value: null },
      { propPath: 'info.name', value: 'test' },
    ]);
  });

  test('跳过undefined值', () => {
    const value = {
      name: 'test',
      age: undefined,
      info: {
        city: 'Beijing',
        country: undefined,
      },
    };
    const result = editor.buildChangeRecords(value, '');

    expect(result).toEqual([
      { propPath: 'name', value: 'test' },
      { propPath: 'info.city', value: 'Beijing' },
    ]);
  });

  test('空对象', () => {
    const value = {};
    const result = editor.buildChangeRecords(value, '');

    expect(result).toEqual([]);
  });

  test('深层嵌套', () => {
    const value = {
      level1: {
        level2: {
          level3: {
            level4: {
              value: 'deep',
            },
          },
        },
      },
    };
    const result = editor.buildChangeRecords(value, 'root');

    expect(result).toEqual([{ propPath: 'root.level1.level2.level3.level4.value', value: 'deep' }]);
  });

  test('混合类型', () => {
    const value = {
      string: 'text',
      number: 42,
      boolean: false,
      array: [1, 2],
      object: {
        nested: 'value',
      },
      nullValue: null,
    };
    const result = editor.buildChangeRecords(value, 'mixed');

    expect(result).toEqual([
      { propPath: 'mixed.string', value: 'text' },
      { propPath: 'mixed.number', value: 42 },
      { propPath: 'mixed.boolean', value: false },
      { propPath: 'mixed.array', value: [1, 2] },
      { propPath: 'mixed.object.nested', value: 'value' },
      { propPath: 'mixed.nullValue', value: null },
    ]);
  });
});

// ===== 以下为新提取的工具函数测试 =====

const mockRoot: MApp = {
  id: 'app_1',
  type: NodeType.ROOT,
  items: [
    {
      id: 'page_1',
      type: NodeType.PAGE,
      name: 'index',
      style: { position: 'relative', width: 375 },
      items: [
        {
          id: 'node_1',
          type: 'text',
          style: { position: 'absolute', top: 10, left: 20, width: 100 },
        },
        {
          id: 'node_2',
          type: 'button',
          style: { position: 'absolute', bottom: 50, right: 30 },
        },
        {
          id: 'node_3',
          type: 'image',
          style: { position: 'relative', top: 0, left: 0 },
        },
      ],
    },
  ],
};

const mockGetNodeInfo = (id: string | number): EditorNodeInfo => {
  const page = mockRoot.items[0];
  if (`${id}` === `${mockRoot.id}`) {
    return { node: mockRoot as unknown as MNode, parent: null, page: null };
  }
  if (`${id}` === `${page.id}`) {
    return { node: page, parent: mockRoot as unknown as MContainer, page: page as any };
  }
  const items = (page as MContainer).items || [];
  const node = items.find((n: MNode) => `${n.id}` === `${id}`);
  if (node) {
    return { node, parent: page as MContainer, page: page as any };
  }
  return { node: null, parent: null, page: null };
};

describe('resolveSelectedNode', () => {
  test('传入数字ID，正常返回节点信息', () => {
    const result = editor.resolveSelectedNode('node_1', mockGetNodeInfo, mockRoot.id);
    expect(result.node?.id).toBe('node_1');
    expect(result.parent?.id).toBe('page_1');
    expect(result.page?.id).toBe('page_1');
  });

  test('传入节点配置对象，正常返回节点信息', () => {
    const config: MNode = { id: 'node_2', type: 'button' };
    const result = editor.resolveSelectedNode(config, mockGetNodeInfo, mockRoot.id);
    expect(result.node?.id).toBe('node_2');
  });

  test('传入页面ID，正常返回页面信息', () => {
    const result = editor.resolveSelectedNode('page_1', mockGetNodeInfo, mockRoot.id);
    expect(result.node?.id).toBe('page_1');
  });

  test('传入空ID，抛出错误', () => {
    expect(() => editor.resolveSelectedNode({ id: '', type: 'text' }, mockGetNodeInfo)).toThrow('没有ID，无法选中');
  });

  test('传入不存在的ID，抛出错误', () => {
    expect(() => editor.resolveSelectedNode('not_exist', mockGetNodeInfo)).toThrow('获取不到组件信息');
  });

  test('传入根节点ID，抛出错误', () => {
    expect(() => editor.resolveSelectedNode('app_1', mockGetNodeInfo, mockRoot.id)).toThrow('不能选根节点');
  });

  test('不传rootId时，不校验根节点', () => {
    const result = editor.resolveSelectedNode('app_1', mockGetNodeInfo);
    expect(result.node?.id).toBe('app_1');
  });
});

describe('toggleFixedPosition', () => {
  const getLayoutFn = async () => Layout.ABSOLUTE;

  test('非fixed变为fixed，调用change2Fixed', async () => {
    const src: MNode = { id: 'node_1', type: 'text', style: { position: 'absolute', top: 10, left: 20 } };
    const dist: MNode = { id: 'node_1', type: 'text', style: { position: 'fixed', top: 10, left: 20 } };

    const result = await editor.toggleFixedPosition(dist, src, mockRoot, getLayoutFn);
    expect(result.style?.position).toBe('fixed');
    expect(result).not.toBe(dist);
  });

  test('fixed变为非fixed，调用Fixed2Other', async () => {
    const src: MNode = { id: 'node_1', type: 'text', style: { position: 'fixed', top: 10, left: 20 } };
    const dist: MNode = { id: 'node_1', type: 'text', style: { position: 'absolute', top: 10, left: 20 } };

    const result = await editor.toggleFixedPosition(dist, src, mockRoot, getLayoutFn);
    expect(result.style?.position).toBe('absolute');
  });

  test('定位未变化，不修改样式', async () => {
    const src: MNode = { id: 'node_1', type: 'text', style: { position: 'absolute', top: 10, left: 20 } };
    const dist: MNode = { id: 'node_1', type: 'text', style: { position: 'absolute', top: 30, left: 40 } };

    const result = await editor.toggleFixedPosition(dist, src, mockRoot, getLayoutFn);
    expect(result.style?.top).toBe(30);
    expect(result.style?.left).toBe(40);
  });

  test('pop类型节点不做处理', async () => {
    const src: MNode = {
      id: 'node_1',
      type: 'pop',
      style: { position: 'absolute', top: 10, left: 20 },
      name: 'pop',
    };
    const dist: MNode = { id: 'node_1', type: 'pop', style: { position: 'fixed', top: 10, left: 20 }, name: 'pop' };

    const result = await editor.toggleFixedPosition(dist, src, mockRoot, getLayoutFn);
    expect(result.style?.position).toBe('fixed');
  });

  test('目标节点无position属性，不做处理', async () => {
    const src: MNode = { id: 'node_1', type: 'text', style: { position: 'absolute' } };
    const dist: MNode = { id: 'node_1', type: 'text', style: { width: 100 } };

    const result = await editor.toggleFixedPosition(dist, src, mockRoot, getLayoutFn);
    expect(result.style?.position).toBeUndefined();
  });

  test('返回深拷贝，不修改原对象', async () => {
    const src: MNode = { id: 'node_1', type: 'text', style: { position: 'absolute', top: 10 } };
    const dist: MNode = { id: 'node_1', type: 'text', style: { position: 'absolute', top: 20 } };

    const result = await editor.toggleFixedPosition(dist, src, mockRoot, getLayoutFn);
    expect(result).not.toBe(dist);
    expect(dist.style?.top).toBe(20);
  });
});

describe('calcMoveStyle', () => {
  test('absolute定位，向下移动', () => {
    const style = { position: 'absolute', top: 10, left: 20 };
    const result = editor.calcMoveStyle(style, 0, 5);
    expect(result).toEqual({ position: 'absolute', top: 15, left: 20, bottom: '' });
  });

  test('absolute定位，向右移动', () => {
    const style = { position: 'absolute', top: 10, left: 20 };
    const result = editor.calcMoveStyle(style, 5, 0);
    expect(result).toEqual({ position: 'absolute', top: 10, left: 25, right: '' });
  });

  test('absolute定位，同时向下和向右移动', () => {
    const style = { position: 'absolute', top: 10, left: 20 };
    const result = editor.calcMoveStyle(style, 3, 7);
    expect(result).toEqual({ position: 'absolute', top: 17, left: 23, bottom: '', right: '' });
  });

  test('fixed定位，正常移动', () => {
    const style = { position: 'fixed', top: 100, left: 200 };
    const result = editor.calcMoveStyle(style, -10, -20);
    expect(result).toEqual({ position: 'fixed', top: 80, left: 190, bottom: '', right: '' });
  });

  test('使用bottom定位时，向下移动减小bottom', () => {
    const style = { position: 'absolute', bottom: 50, left: 20 };
    const result = editor.calcMoveStyle(style, 0, 10);
    expect(result?.bottom).toBe(40);
    expect(result?.top).toBe('');
  });

  test('使用right定位时，向右移动减小right', () => {
    const style = { position: 'absolute', top: 10, right: 30 };
    const result = editor.calcMoveStyle(style, 10, 0);
    expect(result?.right).toBe(20);
    expect(result?.left).toBe('');
  });

  test('relative定位，返回null', () => {
    const style = { position: 'relative', top: 0, left: 0 };
    const result = editor.calcMoveStyle(style, 10, 10);
    expect(result).toBeNull();
  });

  test('无position属性，返回null', () => {
    const style = { width: 100 };
    const result = editor.calcMoveStyle(style, 10, 10);
    expect(result).toBeNull();
  });

  test('空样式对象，返回null', () => {
    const result = editor.calcMoveStyle({}, 10, 10);
    expect(result).toBeNull();
  });

  test('偏移量为0，不修改样式', () => {
    const style = { position: 'absolute', top: 10, left: 20 };
    const result = editor.calcMoveStyle(style, 0, 0);
    expect(result).toEqual({ position: 'absolute', top: 10, left: 20 });
  });

  test('不修改原对象', () => {
    const style = { position: 'absolute', top: 10, left: 20 };
    editor.calcMoveStyle(style, 5, 5);
    expect(style.top).toBe(10);
    expect(style.left).toBe(20);
  });
});

describe('calcAlignCenterStyle', () => {
  test('absolute布局，通过配置中的width计算居中', () => {
    const node: MNode = { id: 'n1', type: 'text', style: { width: 100, left: 0 } };
    const parent = { id: 'p1', type: NodeType.PAGE, style: { width: 375 }, items: [] } as unknown as MContainer;
    const result = editor.calcAlignCenterStyle(node, parent, Layout.ABSOLUTE);
    expect(result?.left).toBe(137.5);
    expect(result?.right).toBe('');
  });

  test('relative布局，返回null', () => {
    const node: MNode = { id: 'n1', type: 'text', style: { width: 100 } };
    const parent = { id: 'p1', type: NodeType.PAGE, style: { width: 375 }, items: [] } as unknown as MContainer;
    const result = editor.calcAlignCenterStyle(node, parent, Layout.RELATIVE);
    expect(result).toBeNull();
  });

  test('节点无style，返回null', () => {
    const node: MNode = { id: 'n1', type: 'text' };
    const parent = { id: 'p1', type: NodeType.PAGE, style: { width: 375 }, items: [] } as unknown as MContainer;
    const result = editor.calcAlignCenterStyle(node, parent, Layout.ABSOLUTE);
    expect(result).toBeNull();
  });

  test('父节点无style，不修改', () => {
    const node: MNode = { id: 'n1', type: 'text', style: { width: 100, left: 10 } };
    const parent = { id: 'p1', type: NodeType.PAGE, items: [] } as unknown as MContainer;
    const result = editor.calcAlignCenterStyle(node, parent, Layout.ABSOLUTE);
    expect(result?.left).toBe(10);
  });

  test('父节点width非数字，不修改left', () => {
    const node: MNode = { id: 'n1', type: 'text', style: { width: 100, left: 10 } };
    const parent = {
      id: 'p1',
      type: NodeType.PAGE,
      style: { width: '100%' },
      items: [],
    } as unknown as MContainer;
    const result = editor.calcAlignCenterStyle(node, parent, Layout.ABSOLUTE);
    expect(result?.left).toBe(10);
  });

  test('不修改原节点style', () => {
    const node: MNode = { id: 'n1', type: 'text', style: { width: 100, left: 0 } };
    const parent = { id: 'p1', type: NodeType.PAGE, style: { width: 375 }, items: [] } as unknown as MContainer;
    editor.calcAlignCenterStyle(node, parent, Layout.ABSOLUTE);
    expect(node.style?.left).toBe(0);
  });
});

describe('calcLayerTargetIndex', () => {
  test('绝对定位，向上移动1层', () => {
    const result = editor.calcLayerTargetIndex(2, 1, 5, false);
    expect(result).toBe(3);
  });

  test('绝对定位，向下移动1层', () => {
    const result = editor.calcLayerTargetIndex(2, -1, 5, false);
    expect(result).toBe(1);
  });

  test('流式布局，向上移动1层（索引减小）', () => {
    const result = editor.calcLayerTargetIndex(2, 1, 5, true);
    expect(result).toBe(1);
  });

  test('流式布局，向下移动1层（索引增大）', () => {
    const result = editor.calcLayerTargetIndex(2, -1, 5, true);
    expect(result).toBe(3);
  });

  test('绝对定位，置顶', () => {
    const result = editor.calcLayerTargetIndex(2, LayerOffset.TOP, 5, false);
    expect(result).toBe(5);
  });

  test('绝对定位，置底', () => {
    const result = editor.calcLayerTargetIndex(2, LayerOffset.BOTTOM, 5, false);
    expect(result).toBe(0);
  });

  test('流式布局，置顶（索引最小）', () => {
    const result = editor.calcLayerTargetIndex(3, LayerOffset.TOP, 5, true);
    expect(result).toBe(0);
  });

  test('流式布局，置底（索引最大）', () => {
    const result = editor.calcLayerTargetIndex(1, LayerOffset.BOTTOM, 5, true);
    expect(result).toBe(5);
  });

  test('偏移量为0，索引不变', () => {
    const result = editor.calcLayerTargetIndex(2, 0, 5, false);
    expect(result).toBe(2);
  });
});

describe('editorNodeMergeCustomizer', () => {
  test('undefined 且 source 拥有该 key 时返回空字符串', () => {
    const source = { name: undefined };
    const result = editor.editorNodeMergeCustomizer('old', undefined, 'name', {}, source);
    expect(result).toBe('');
  });

  test('source 不拥有该 key 时返回 undefined（使用默认合并）', () => {
    const result = editor.editorNodeMergeCustomizer('old', undefined, 'name', {}, {});
    expect(result).toBeUndefined();
  });

  test('原来是数组，新值是对象，使用新值', () => {
    const srcValue = { a: 1 };
    const result = editor.editorNodeMergeCustomizer([1, 2], srcValue, 'key', {}, {});
    expect(result).toBe(srcValue);
  });

  test('新值是数组，直接替换', () => {
    const srcValue = [3, 4];
    const result = editor.editorNodeMergeCustomizer([1, 2], srcValue, 'key', {}, {});
    expect(result).toBe(srcValue);
  });

  test('都是普通值，返回 undefined（使用默认合并）', () => {
    const result = editor.editorNodeMergeCustomizer('old', 'new', 'key', {}, {});
    expect(result).toBeUndefined();
  });
});

describe('classifyDragSources', () => {
  const makeTree = (): { root: MApp; getNodeInfo: (id: any, raw?: boolean) => EditorNodeInfo } => {
    const child1: MNode = { id: 'c1', type: 'text' };
    const child2: MNode = { id: 'c2', type: 'text' };
    const child3: MNode = { id: 'c3', type: 'text' };
    const container1: MContainer = {
      id: 'cont1',
      type: NodeType.CONTAINER,
      items: [child1, child2],
    };
    const container2: MContainer = {
      id: 'cont2',
      type: NodeType.CONTAINER,
      items: [child3],
    };
    const page: any = {
      id: 'page_1',
      type: NodeType.PAGE,
      items: [container1, container2],
    };
    const root: MApp = { id: 'app', type: NodeType.ROOT, items: [page] };

    const getNodeInfo = (id: any): EditorNodeInfo => {
      if (`${id}` === 'c1' || `${id}` === 'c2') {
        return {
          node: container1.items.find((n) => `${n.id}` === `${id}`) ?? null,
          parent: container1,
          page,
        };
      }
      if (`${id}` === 'c3') {
        return { node: child3, parent: container2, page };
      }
      if (`${id}` === 'cont1') {
        return { node: container1, parent: page, page };
      }
      if (`${id}` === 'cont2') {
        return { node: container2, parent: page, page };
      }
      return { node: null, parent: null, page: null };
    };

    return { root, getNodeInfo };
  };

  test('同父容器内拖拽，返回 sameParentIndices', () => {
    const { getNodeInfo } = makeTree();
    const targetParent = getNodeInfo('cont1').node as MContainer;
    const result = editor.classifyDragSources([{ id: 'c1', type: 'text' }], targetParent, getNodeInfo);
    expect(result.aborted).toBe(false);
    expect(result.sameParentIndices).toEqual([0]);
    expect(result.crossParentConfigs).toHaveLength(0);
  });

  test('跨容器拖拽，返回 crossParentConfigs', () => {
    const { getNodeInfo } = makeTree();
    const targetParent = getNodeInfo('cont1').node as MContainer;
    const result = editor.classifyDragSources([{ id: 'c3', type: 'text' }], targetParent, getNodeInfo);
    expect(result.aborted).toBe(false);
    expect(result.sameParentIndices).toHaveLength(0);
    expect(result.crossParentConfigs).toHaveLength(1);
    expect(result.crossParentConfigs[0].config.id).toBe('c3');
  });

  test('混合拖拽：同容器+跨容器', () => {
    const { getNodeInfo } = makeTree();
    const targetParent = getNodeInfo('cont1').node as MContainer;
    const result = editor.classifyDragSources(
      [
        { id: 'c1', type: 'text' },
        { id: 'c3', type: 'text' },
      ],
      targetParent,
      getNodeInfo,
    );
    expect(result.aborted).toBe(false);
    expect(result.sameParentIndices).toEqual([0]);
    expect(result.crossParentConfigs).toHaveLength(1);
  });

  test('节点不存在时跳过', () => {
    const { getNodeInfo } = makeTree();
    const targetParent = getNodeInfo('cont1').node as MContainer;
    const result = editor.classifyDragSources([{ id: 'nonexistent', type: 'text' }], targetParent, getNodeInfo);
    expect(result.aborted).toBe(false);
    expect(result.sameParentIndices).toHaveLength(0);
    expect(result.crossParentConfigs).toHaveLength(0);
  });

  test('目标容器在节点路径上时跳过（防止循环嵌套）', () => {
    const { getNodeInfo } = makeTree();
    const targetParent = getNodeInfo('cont1').node as MContainer;
    const result = editor.classifyDragSources([{ id: 'c1', type: 'text' }], targetParent, (id: any) => {
      if (`${id}` === 'c1') {
        return {
          node: { id: 'c1', type: 'text' },
          parent: targetParent,
          page: { id: 'page_1', type: NodeType.PAGE, items: [] } as any,
        };
      }
      return { node: null, parent: null, page: null };
    });
    expect(result.sameParentIndices).toEqual([0]);
    expect(result.crossParentConfigs).toHaveLength(0);
  });
});

describe('calcMoveStyle', () => {
  test('非 absolute/fixed 返回 null', () => {
    expect(editor.calcMoveStyle({ position: 'relative' }, 1, 1)).toBeNull();
    expect(editor.calcMoveStyle(null as any, 1, 1)).toBeNull();
  });

  test('absolute + top/left', () => {
    const result = editor.calcMoveStyle({ position: 'absolute', top: 10, left: 5 }, 3, 4)!;
    expect(result.top).toBe(14);
    expect(result.left).toBe(8);
  });

  test('absolute + bottom/right (left/top 未定义)', () => {
    const result = editor.calcMoveStyle({ position: 'absolute', bottom: 10, right: 5 }, 3, 4)!;
    expect(result.bottom).toBe(6);
    expect(result.right).toBe(2);
  });
});

describe('calcAlignCenterStyle', () => {
  test('relative 布局返回 null', () => {
    const result = editor.calcAlignCenterStyle(
      { id: 'a', style: { width: 100 } } as any,
      { style: { width: 200 } } as any,
      Layout.RELATIVE,
    );
    expect(result).toBeNull();
  });

  test('无 doc 时按 parent.style 与 node.style 计算 left', () => {
    const result = editor.calcAlignCenterStyle(
      { id: 'a', style: { width: 100, position: 'absolute' } } as any,
      { style: { width: 300 } } as any,
      Layout.ABSOLUTE,
    );
    expect(result?.left).toBe(100);
    expect(result?.right).toBe('');
  });

  test('node 没有 style 返回 null', () => {
    const result = editor.calcAlignCenterStyle({ id: 'a' } as any, { style: { width: 100 } } as any, Layout.ABSOLUTE);
    expect(result).toBeNull();
  });
});

describe('calcLayerTargetIndex', () => {
  test('LayerOffset.TOP / BOTTOM', () => {
    expect(editor.calcLayerTargetIndex(2, LayerOffset.TOP, 5, false)).toBeGreaterThanOrEqual(0);
    expect(editor.calcLayerTargetIndex(2, LayerOffset.BOTTOM, 5, false)).toBeGreaterThanOrEqual(0);
  });

  test('数字 offset 走偏移逻辑', () => {
    const r1 = editor.calcLayerTargetIndex(2, 1, 5, true);
    const r2 = editor.calcLayerTargetIndex(2, 1, 5, false);
    expect(typeof r1).toBe('number');
    expect(typeof r2).toBe('number');
  });
});

describe('getGuideLineFromCache', () => {
  test('key 为空返回 []', () => {
    expect(editor.getGuideLineFromCache('')).toEqual([]);
  });

  test('返回缓存中的数组', () => {
    globalThis.localStorage.setItem('gl_test', JSON.stringify([1, 2, 3]));
    expect(editor.getGuideLineFromCache('gl_test')).toEqual([1, 2, 3]);
    globalThis.localStorage.removeItem('gl_test');
  });

  test('JSON 解析失败时返回 []', () => {
    globalThis.localStorage.setItem('gl_bad', 'not-json');
    const errSpy = vi.spyOn(console, 'error').mockImplementation(() => undefined);
    expect(editor.getGuideLineFromCache('gl_bad')).toEqual([]);
    errSpy.mockRestore();
    globalThis.localStorage.removeItem('gl_bad');
  });
});

describe('change2Fixed / Fixed2Other', () => {
  const root: MApp = {
    id: 'app',
    type: NodeType.ROOT,
    items: [
      {
        id: 'p1',
        type: NodeType.PAGE,
        style: { left: 10, top: 20 },
        items: [
          {
            id: 'btn',
            type: 'text',
            style: { position: 'absolute', left: 5, top: 5 },
          },
        ],
      } as any,
    ],
  };

  test('change2Fixed 累加路径上的 left/top', () => {
    const node = root.items[0]!.items![0] as MNode;
    const style = editor.change2Fixed(node, root);
    expect(style.left).toBeGreaterThan(0);
    expect(style.top).toBeGreaterThan(0);
  });

  test('Fixed2Other 转回 absolute', async () => {
    const node = root.items[0]!.items![0] as MNode;
    const style = await editor.Fixed2Other(node, root, async () => Layout.ABSOLUTE);
    expect(style.position).toBe('absolute');
  });

  test('Fixed2Other 转回 relative 时 right/top 重置', async () => {
    const node = root.items[0]!.items![0] as MNode;
    const style = await editor.Fixed2Other(node, root, async () => Layout.RELATIVE);
    expect(style.position).toBe('relative');
  });
});

describe('补充：getPageList / getPageFragmentList / generatePageNameByApp 等基础工具', () => {
  test('getPageList - root 为 null/items 不是数组时返回空数组', () => {
    expect(editor.getPageList(null as any)).toEqual([]);
    expect(editor.getPageList(undefined as any)).toEqual([]);
    expect(editor.getPageList({ id: 'x', type: NodeType.ROOT } as any)).toEqual([]);
  });

  test('getPageFragmentList - root 为 null/items 不是数组时返回空数组', () => {
    expect(editor.getPageFragmentList(null as any)).toEqual([]);
    expect(editor.getPageFragmentList({ id: 'x', type: NodeType.ROOT } as any)).toEqual([]);
  });

  test('getPageFragmentList - 仅返回 page-fragment 节点', () => {
    const root: MApp = {
      id: 'a',
      type: NodeType.ROOT,
      items: [
        { id: 'pf1', type: NodeType.PAGE_FRAGMENT, items: [] } as any,
        { id: 'p1', type: NodeType.PAGE, items: [] } as any,
      ],
    };
    expect(editor.getPageFragmentList(root)).toHaveLength(1);
  });

  test('getPageNameList - 缺少 name 时使用 index 兜底', () => {
    const list = editor.getPageNameList([{ id: 'a', type: NodeType.PAGE, items: [] } as any]);
    expect(list[0]).toBe('index');
  });

  test('generatePageName - 列表为空时返回 index', () => {
    expect(editor.generatePageName([], NodeType.PAGE)).toBe('page_index');
  });

  test('generatePageName - 重名时累加索引', () => {
    expect(editor.generatePageName(['page_1', 'page_2'], NodeType.PAGE)).toBe('page_3');
  });

  test('generatePageNameByApp - PAGE / PAGE_FRAGMENT 两种类型', () => {
    const app: MApp = {
      id: 'a',
      type: NodeType.ROOT,
      items: [
        { id: 'p1', type: NodeType.PAGE, name: 'page_1', items: [] } as any,
        { id: 'pf', type: NodeType.PAGE_FRAGMENT, name: 'page-fragment_1', items: [] } as any,
      ],
    };
    expect(editor.generatePageNameByApp(app, NodeType.PAGE)).toBe('page_2');
    expect(editor.generatePageNameByApp(app, NodeType.PAGE_FRAGMENT)).toBe('page-fragment_2');
  });
});

describe('补充：getInitPositionStyle / setLayout / setChildrenLayout', () => {
  test('Layout.ABSOLUTE - 已有 right 时不会被填 left=0', () => {
    const style = editor.getInitPositionStyle({ right: 0 }, Layout.ABSOLUTE);
    expect(style.position).toBe('absolute');
    expect(style.left).toBeUndefined();
  });

  test('Layout.ABSOLUTE - 没有 left/right 时默认 left=0', () => {
    const style = editor.getInitPositionStyle({}, Layout.ABSOLUTE);
    expect(style.left).toBe(0);
  });

  test('Layout.RELATIVE - 走 getRelativeStyle', () => {
    const style = editor.getInitPositionStyle({ color: 'red' }, Layout.RELATIVE);
    expect(style.position).toBe('relative');
  });

  test('Layout.FIXED - 直接返回原 style', () => {
    const style = { color: 'red' };
    expect(editor.getInitPositionStyle(style, Layout.FIXED)).toBe(style);
  });

  test('setLayout - pop 类型不处理', () => {
    const node = { id: 'p', type: 'pop' } as any;
    expect(editor.setLayout(node, Layout.ABSOLUTE)).toBeUndefined();
  });

  test('setLayout - position fixed 不处理', () => {
    const node = { id: 'n', type: 'text', style: { position: 'fixed' } } as any;
    expect(editor.setLayout(node, Layout.ABSOLUTE)).toBeUndefined();
  });

  test('setLayout - RELATIVE 时使用 getRelativeStyle', () => {
    const node = { id: 'n', type: 'text', style: { left: 10 } } as any;
    editor.setLayout(node, Layout.RELATIVE);
    expect(node.style.position).toBe('relative');
    expect(node.style.right).toBe('auto');
    expect(node.style.bottom).toBe('auto');
  });

  test('setLayout - 其他 layout 时设置 position absolute', () => {
    const node = { id: 'n', type: 'text', style: {} } as any;
    editor.setLayout(node, Layout.ABSOLUTE);
    expect(node.style.position).toBe('absolute');
  });

  test('setLayout - 节点没有 style 时也能赋值', () => {
    const node = { id: 'n', type: 'text' } as any;
    editor.setLayout(node, Layout.ABSOLUTE);
  });

  test('setChildrenLayout - 遍历所有 child', () => {
    const container: MContainer = {
      id: 'c',
      type: NodeType.CONTAINER,
      items: [{ id: 'a', type: 'text', style: {} } as any, { id: 'b', type: 'text', style: {} } as any],
    };
    const result = editor.setChildrenLayout(container, Layout.ABSOLUTE);
    expect(result.items[0].style?.position).toBe('absolute');
    expect(result.items[1].style?.position).toBe('absolute');
  });
});

describe('补充：fixNodeLeft / fixNodePosition / serializeConfig', () => {
  test('fixNodeLeft - 缺少 doc 直接返回 style.left', () => {
    expect(editor.fixNodeLeft({ id: 'a', style: { left: 5 } } as any, { id: 'p' } as any)).toBe(5);
  });

  test('fixNodeLeft - left 不是数字直接返回', () => {
    expect(editor.fixNodeLeft({ id: 'a', style: { left: '5%' } } as any, { id: 'p' } as any, document)).toBe('5%');
  });

  test('fixNodeLeft - 元素 + 父元素 + 超出宽度时修正', () => {
    const doc = document.implementation.createHTMLDocument();
    const parent = doc.createElement('div');
    parent.dataset.tmagicId = 'p';
    Object.defineProperty(parent, 'offsetWidth', { value: 100 });
    const child = doc.createElement('div');
    child.dataset.tmagicId = 'a';
    Object.defineProperty(child, 'offsetWidth', { value: 80 });
    parent.appendChild(child);
    doc.body.appendChild(parent);

    expect(editor.fixNodeLeft({ id: 'a', style: { left: 50 } } as any, { id: 'p' } as any, doc)).toBe(20);
  });

  test('fixNodeLeft - 未超出宽度时返回原 left', () => {
    const doc = document.implementation.createHTMLDocument();
    const parent = doc.createElement('div');
    parent.dataset.tmagicId = 'p2';
    Object.defineProperty(parent, 'offsetWidth', { value: 200 });
    const child = doc.createElement('div');
    child.dataset.tmagicId = 'a2';
    Object.defineProperty(child, 'offsetWidth', { value: 50 });
    parent.appendChild(child);
    doc.body.appendChild(parent);

    expect(editor.fixNodeLeft({ id: 'a2', style: { left: 30 } } as any, { id: 'p2' } as any, doc)).toBe(30);
  });

  test('fixNodePosition - 非 absolute 时直接返回 style', () => {
    const style = { position: 'relative' } as any;
    expect(editor.fixNodePosition({ id: 'a', style } as any, { id: 'p', items: [] } as any, null)).toBe(style);
  });

  test('fixNodePosition - absolute 节点未传 stage 时也能得到 top/left', () => {
    const result = editor.fixNodePosition(
      { id: 'a', style: { position: 'absolute', height: 50 } } as any,
      { id: 'p', items: [], style: { height: 200 } } as any,
      null,
    );
    expect(result).toBeDefined();
  });

  test('serializeConfig - 输出去掉了 key 引号', () => {
    const out = editor.serializeConfig({ a: 1 });
    expect(out).toContain('a:');
  });
});

describe('补充：isIncludeDataSource', () => {
  test('updated 中包含模板字符串触发 true', () => {
    const oldNode = { id: '1', type: 't', text: 'foo' } as any;
    const newNode = { id: '1', type: 't', text: '${ds.bar}' } as any;
    expect(editor.isIncludeDataSource(newNode, oldNode)).toBe(true);
  });

  test('added 中包含模板字符串触发 true', () => {
    const oldNode = { id: '1', type: 't' } as any;
    const newNode = { id: '1', type: 't', text: '${ds.bar}' } as any;
    expect(editor.isIncludeDataSource(newNode, oldNode)).toBe(true);
  });

  test('NODE_CONDS_KEY 修改触发 true', async () => {
    const { NODE_CONDS_KEY } = await import('@tmagic/core');
    const oldNode = { id: '1', type: 't', [NODE_CONDS_KEY]: [] } as any;
    const newNode = { id: '1', type: 't', [NODE_CONDS_KEY]: [{ field: '${ds.x}', op: '=', value: '1' }] } as any;
    expect(editor.isIncludeDataSource(newNode, oldNode)).toBe(true);
  });

  test('NODE_CONDS_KEY 删除分支会被触发', async () => {
    const { NODE_CONDS_KEY } = await import('@tmagic/core');
    const oldNode = { id: '1', type: 't', [NODE_CONDS_KEY]: [{ field: 'a' }] } as any;
    const newNode = { id: '1', type: 't' } as any;
    // 期望函数能正常返回布尔值（覆盖 deleted 检查路径）
    expect(typeof editor.isIncludeDataSource(newNode, oldNode)).toBe('boolean');
  });

  test('删除带模板字符串字段会触发 deleted 检查路径', () => {
    const oldNode = { id: '1', type: 't', extra: '${ds.x}' } as any;
    const newNode = { id: '1', type: 't' } as any;
    expect(typeof editor.isIncludeDataSource(newNode, oldNode)).toBe('boolean');
  });

  test('完全无变更时返回 false', () => {
    const node = { id: '1', type: 't' } as any;
    expect(editor.isIncludeDataSource(node, node)).toBe(false);
  });

  test('updated 嵌套对象中查找数据源', () => {
    const oldNode = { id: '1', type: 't', data: { foo: { bar: 'a' } } } as any;
    const newNode = { id: '1', type: 't', data: { foo: { bar: '${ds.x}' } } } as any;
    expect(editor.isIncludeDataSource(newNode, oldNode)).toBe(true);
  });
});

describe('补充：collectRelatedNodes', () => {
  test('被复制节点引用了其他节点时把引用也加入 copyNodes', () => {
    const source: any = { id: 'src', type: 'text', binding: '${other_node.x}' };
    const other: any = { id: 'other_node', type: 'text' };
    const copyNodes: MNode[] = [source];
    editor.collectRelatedNodes(
      copyNodes,
      { type: 'related', isTarget: () => false, initialDeps: {} } as any,
      (id: any) => (id === 'other_node' ? other : null),
    );
    expect(Array.isArray(copyNodes)).toBe(true);
  });
});

describe('补充：calcAlignCenterStyle 通过 DOM 计算', () => {
  test('提供 doc 时通过 element 实际宽度计算 left', () => {
    const doc = document.implementation.createHTMLDocument();
    const parent = doc.createElement('div');
    Object.defineProperty(parent, 'clientWidth', { value: 300 });
    const child = doc.createElement('div');
    child.dataset.tmagicId = 'aa';
    Object.defineProperty(child, 'clientWidth', { value: 100 });
    Object.defineProperty(child, 'offsetParent', { value: parent });
    parent.appendChild(child);
    doc.body.appendChild(parent);

    const result = editor.calcAlignCenterStyle(
      { id: 'aa', style: { width: 100, position: 'absolute' } } as any,
      { id: 'p', style: { width: 300 } } as any,
      Layout.ABSOLUTE,
      doc,
    );
    expect(result?.left).toBe(100);
    expect(result?.right).toBe('');
  });

  test('提供 doc + Layout.FIXED 用 doc.body 作为 parent', () => {
    const doc = document.implementation.createHTMLDocument();
    Object.defineProperty(doc.body, 'clientWidth', { value: 500, configurable: true });
    const child = doc.createElement('div');
    child.dataset.tmagicId = 'bb';
    Object.defineProperty(child, 'clientWidth', { value: 100 });
    doc.body.appendChild(child);
    const result = editor.calcAlignCenterStyle(
      { id: 'bb', style: { width: 100, position: 'fixed' } } as any,
      { id: 'p', style: { width: 500 } } as any,
      Layout.FIXED,
      doc,
    );
    expect(result?.left).toBe(200);
  });
});

describe('补充：change2Fixed 边界', () => {
  test('遇到祖先有 right/非数字 left 时 offset 重置为 0', () => {
    const root: MApp = {
      id: 'app',
      type: NodeType.ROOT,
      items: [
        {
          id: 'p1',
          type: NodeType.PAGE,
          style: { right: 10 },
          items: [{ id: 'b', type: 'text', style: { position: 'absolute', left: 5, top: 5 } }],
        } as any,
      ],
    };
    const node = root.items[0]!.items![0] as MNode;
    const style = editor.change2Fixed(node, root);
    expect(style.left).toBe(5);
  });

  test('节点本身有 right 时不累加 left', () => {
    const root: MApp = {
      id: 'app',
      type: NodeType.ROOT,
      items: [
        {
          id: 'p1',
          type: NodeType.PAGE,
          style: { left: 10, top: 20 },
          items: [{ id: 'b', type: 'text', style: { position: 'absolute', right: 5 } }],
        } as any,
      ],
    };
    const node = root.items[0]!.items![0] as MNode;
    const style = editor.change2Fixed(node, root);
    expect(style.left).toBeUndefined();
  });
});

describe('补充：classifyDragSources 同父容器索引异常', () => {
  test('当 getNodeIndex 返回 -1 时 aborted=true', () => {
    const targetParent: MContainer = { id: 't', type: NodeType.CONTAINER, items: [] };
    const result = editor.classifyDragSources([{ id: 'x', type: 'text' }], targetParent, ((id: any) => ({
      node: { id, type: 'text' },
      parent: targetParent,
      page: null,
    })) as any);
    expect(result.aborted).toBe(true);
  });
});

describe('toggleFixedPosition', () => {
  test('fixed -> 非 fixed 触发 Fixed2Other', async () => {
    const root: MApp = {
      id: 'app',
      type: NodeType.ROOT,
      items: [{ id: 'p1', type: NodeType.PAGE, items: [] } as any],
    };
    const result = await editor.toggleFixedPosition(
      { id: 'a', type: 'text', style: { position: 'absolute', top: 0, left: 0 } } as any,
      { id: 'a', type: 'text', style: { position: 'fixed' } } as any,
      root,
      async () => Layout.ABSOLUTE,
    );
    expect(result.style?.position).toBeDefined();
  });

  test('非 fixed -> fixed 触发 change2Fixed', async () => {
    const root: MApp = {
      id: 'app',
      type: NodeType.ROOT,
      items: [
        {
          id: 'p1',
          type: NodeType.PAGE,
          style: { left: 0, top: 0 },
          items: [{ id: 'a', type: 'text', style: { position: 'fixed', left: 0, top: 0 } }],
        } as any,
      ],
    };
    const result = await editor.toggleFixedPosition(
      { id: 'a', type: 'text', style: { position: 'fixed', left: 0, top: 0 } } as any,
      { id: 'a', type: 'text', style: { position: 'absolute' } } as any,
      root,
      async () => Layout.ABSOLUTE,
    );
    expect(result.style?.position).toBe('fixed');
  });
});