渲染顺序功能

scripts/verify-render-layer.mjs

@@ -0,0 +1,73 @@
+import { build } from 'esbuild'
+
+const bundled = await build({
+  bundle: true,
+  entryPoints: ['src/views/stage/renderLayer.ts'],
+  format: 'esm',
+  platform: 'node',
+  write: false,
+})
+const { resolveRenderTarget } = await import(
+  `data:text/javascript;base64,${Buffer.from(bundled.outputFiles[0].text).toString('base64')}`
+)
+
+const spines = [{
+  id: 7,
+  enabled: true,
+  status: 'ready',
+  slots: [
+    { name: 'slot_back', order: 0 },
+    { name: 'slot_body', order: 1 },
+    { name: 'slot_hand', order: 2 },
+  ],
+}]
+const base = {
+  renderLayerMode: 'slot',
+  renderLayerSpineId: 7,
+  renderLayerSlotName: 'slot_hand',
+  renderLayerSlotPosition: 'above',
+  renderLayerFollowAttachment: true,
+}
+
+function expect(actual, expected, label) {
+  if (JSON.stringify(actual) !== JSON.stringify(expected)) {
+    throw new Error(`${label}: expected ${JSON.stringify(expected)}, got ${JSON.stringify(actual)}`)
+  }
+}
+
+expect(resolveRenderTarget(spines, { ...base, renderLayerMode: 'top' }), null, '最上层不应挂槽位')
+expect(
+  resolveRenderTarget(spines, base),
+  { spineId: 7, slotName: 'slot_hand', targetSlotName: 'slot_hand', followAttachment: true },
+  '图片之上应挂到目标插槽',
+)
+expect(
+  resolveRenderTarget(spines, { ...base, renderLayerSlotPosition: 'below' }),
+  { spineId: 7, slotName: 'slot_body', targetSlotName: 'slot_hand', followAttachment: false },
+  '图片之下应挂到 drawOrder 前一个插槽',
+)
+expect(
+  resolveRenderTarget(spines, { ...base, renderLayerSlotPosition: 'below' }, ['slot_back', 'slot_hand', 'slot_body']),
+  { spineId: 7, slotName: 'slot_back', targetSlotName: 'slot_hand', followAttachment: false },
+  '动画 drawOrder 变化时应按当前顺序取前一个插槽',
+)
+expect(
+  resolveRenderTarget(spines, { ...base, renderLayerSlotPosition: 'below' }, ['slot_hand', 'slot_body', 'slot_back']),
+  null,
+  '当前 drawOrder 中目标位于最底层时无法放在其下方',
+)
+expect(
+  resolveRenderTarget(spines, { ...base, renderLayerSlotName: 'slot_body', renderLayerSlotPosition: 'below' }, ['slot_hand', 'slot_body', 'slot_back']),
+  { spineId: 7, slotName: 'slot_hand', targetSlotName: 'slot_body', followAttachment: false },
+  '当前 drawOrder 中应取紧邻的前一个插槽',
+)
+expect(
+  resolveRenderTarget(spines, { ...base, renderLayerSlotName: 'slot_back', renderLayerSlotPosition: 'below' }),
+  null,
+  '第一个插槽下方没有可用层级',
+)
+expect(resolveRenderTarget(spines, { ...base, renderLayerSlotName: 'missing' }), null, '插槽不存在时应回退')
+expect(resolveRenderTarget([{ ...spines[0], enabled: false }], base), null, 'Spine 停用时应回退')
+expect(resolveRenderTarget([{ ...spines[0], status: 'loading' }], base), null, 'Spine 未就绪时应回退')
+
+console.log('渲染层级解析校验通过：最上层 / 插槽之上 / 插槽之下 / 动画 drawOrder / 失效回退')