create-bubbles 0.1.25 → 0.1.27

package/template-vp-monorepo-react-nestjs/apps/web/test/router/entry.spec.ts

@@ -0,0 +1,179 @@
+import { beforeEach, describe, expect, it } from 'vite-plus/test'
+import { getBuiltinPermissionKeys } from 'shared/utils'
+import {
+  access,
+  api,
+  companyScope,
+  makeRouter,
+  projectPath,
+  projectScope,
+  resetPolicyData,
+  session,
+  setAccess,
+  setWorkspaces,
+  workspace,
+} from './config'
+
+beforeEach(resetPolicyData)
+
+describe('默认入口 middleware 分流', () => {
+  it.each(['/', '/home'])('只有一个项目时从 %s 直接进入项目', async (entry) => {
+    setWorkspaces([workspace(projectScope)])
+    const fixture = await makeRouter()
+    try {
+      await fixture.router.navigate(entry)
+      expect(fixture.router.state.location.pathname).toBe(projectPath)
+      expect(fixture.router.state.errors).toBeNull()
+      expect(fixture.access(projectScope)?.scope).toEqual(projectScope)
+    } finally {
+      fixture.dispose()
+    }
+  })
+
+  it('普通企业成员的默认权限不会阻止唯一项目直达', async () => {
+    setWorkspaces([workspace(companyScope), workspace(projectScope)])
+    setAccess([
+      access(companyScope, {
+        permissionKeys: getBuiltinPermissionKeys({ scopeType: 'company', builtin: 'member' }),
+      }),
+    ])
+    const fixture = await makeRouter()
+    try {
+      await fixture.router.navigate('/')
+      expect(fixture.router.state.location.pathname).toBe(projectPath)
+      expect(api.getAccessContext).toHaveBeenNthCalledWith(1, companyScope, {
+        workspaceKey: 'workspaces',
+        signal: expect.any(AbortSignal),
+      })
+      expect(api.getAccessContext).toHaveBeenNthCalledWith(2, projectScope, {
+        workspaceKey: 'workspaces',
+        signal: expect.any(AbortSignal),
+      })
+      expect(api.getAccessContext).toHaveBeenNthCalledWith(3, projectScope, {
+        workspaceKey: 'project:company-a:project-a',
+        signal: expect.any(AbortSignal),
+      })
+    } finally {
+      fixture.dispose()
+    }
+  })
+
+  it.each([
+    {
+      name: '平台身份',
+      entries: [workspace({ type: 'platform' }, 'platform'), workspace(projectScope)],
+    },
+    { name: '企业管理员', entries: [workspace(companyScope, 'company'), workspace(projectScope)] },
+    {
+      name: '多个项目',
+      entries: [workspace(projectScope), workspace({ ...projectScope, projectId: 'project-b' })],
+    },
+    { name: '没有项目', entries: [workspace(companyScope)] },
+    { name: '没有空间', entries: [] },
+  ])('$name 进入工作空间选择', async ({ entries }) => {
+    setWorkspaces(entries)
+    const fixture = await makeRouter()
+    try {
+      await fixture.router.navigate('/')
+      expect(fixture.router.state.location.pathname).toBe('/workspaces')
+      expect(fixture.workspaces()?.workspaces).toEqual(entries)
+      expect(api.getAccessContext).not.toHaveBeenCalled()
+    } finally {
+      fixture.dispose()
+    }
+  })
+
+  it.each([
+    {
+      name: '自定义企业管理权限',
+      context: access(companyScope, {
+        permissionKeys: ['company.home.read', 'company.members.read'],
+      }),
+    },
+    { name: '权限响应标记企业管理员', context: access(companyScope, { administrator: 'company' }) },
+  ])('$name 保留工作空间选择', async ({ context }) => {
+    setWorkspaces([workspace(companyScope), workspace(projectScope)])
+    setAccess([context])
+    const fixture = await makeRouter()
+    try {
+      await fixture.router.navigate('/')
+      expect(fixture.router.state.location.pathname).toBe('/workspaces')
+      expect(api.getAccessContext).toHaveBeenCalledTimes(1)
+    } finally {
+      fixture.dispose()
+    }
+  })
+
+  it('唯一项目首页不可见时直接进入另一个已授权页面', async () => {
+    setWorkspaces([workspace(projectScope)])
+    setAccess([access(projectScope, { permissionKeys: ['project.members.read'] })])
+    const fixture = await makeRouter()
+    try {
+      await fixture.router.navigate('/')
+      expect(fixture.router.state.location.pathname).toBe(`${projectPath}/members`)
+      expect(fixture.router.state.errors).toBeNull()
+    } finally {
+      fixture.dispose()
+    }
+  })
+
+  it('唯一项目无任何可访问页面时回到选择页', async () => {
+    setWorkspaces([workspace(projectScope)])
+    setAccess([access(projectScope, { permissionKeys: [] })])
+    const fixture = await makeRouter()
+    try {
+      await fixture.router.navigate('/')
+      expect(fixture.router.state.location.pathname).toBe('/workspaces')
+    } finally {
+      fixture.dispose()
+    }
+  })
+
+  it.each([403, 404])('自动选择期间身份失效 %s 时重新获取选择页列表', async (status) => {
+    setWorkspaces([workspace(projectScope)])
+    api.getAccessContext.mockRejectedValue(Object.assign(new Error('项目身份失效'), { status }))
+    const fixture = await makeRouter()
+    try {
+      await fixture.router.navigate('/')
+      expect(fixture.router.state.location.pathname).toBe('/workspaces')
+      expect(fixture.router.state.errors).toBeNull()
+      expect(api.getWorkspaces).toHaveBeenCalledTimes(2)
+    } finally {
+      fixture.dispose()
+    }
+  })
+
+  it.each(['/workspaces', '/companies/company-a', `${projectPath}/members`])(
+    '显式进入 %s 不触发默认分流',
+    async (destination) => {
+      setWorkspaces([workspace(companyScope), workspace(projectScope)])
+      setAccess([access(projectScope, { permissionKeys: ['project.members.read'] })])
+      const fixture = await makeRouter()
+      try {
+        await fixture.router.navigate(destination)
+        expect(fixture.router.state.location.pathname).toBe(destination)
+        expect(fixture.router.state.errors).toBeNull()
+        expect(api.getWorkspaces).toHaveBeenCalledTimes(1)
+        expect(api.getAccessContext).toHaveBeenCalledTimes(destination === '/workspaces' ? 0 : 1)
+      } finally {
+        fixture.dispose()
+      }
+    },
+  )
+
+  it.each(['/', '/home', '/workspaces', projectPath])(
+    '未登录访问 %s 时不请求工作空间数据',
+    async (destination) => {
+      session.token = null
+      const fixture = await makeRouter()
+      try {
+        await fixture.router.navigate(destination)
+        expect(fixture.router.state.location.pathname).toBe('/login')
+        expect(api.getWorkspaces).not.toHaveBeenCalled()
+        expect(api.getAccessContext).not.toHaveBeenCalled()
+      } finally {
+        fixture.dispose()
+      }
+    },
+  )
+})

package/template-vp-monorepo-react-nestjs/apps/web/test/router/workspace-data.spec.ts

@@ -0,0 +1,112 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vite-plus/test'
+import type { AccessContext } from 'shared/types'
+import {
+  access,
+  api,
+  makeRouter,
+  projectPath,
+  projectScope,
+  resetPolicyData,
+  session,
+  setWorkspaces,
+  workspace,
+} from './config'
+
+let fixture: Awaited<ReturnType<typeof makeRouter>>
+beforeEach(async () => {
+  resetPolicyData()
+  setWorkspaces([workspace(projectScope)])
+  fixture = await makeRouter()
+})
+afterEach(() => fixture?.dispose())
+
+describe('工作空间数据交接', () => {
+  it('切换项目等待期间保留原项目权限，完成后按新项目读取且无需 loader', async () => {
+    await fixture.router.navigate(projectPath)
+    api.getAccessContext.mockClear()
+    api.getWorkspaces.mockClear()
+    const nextScope = { ...projectScope, projectId: 'project-b' }
+    const nextWorkspaceKey = 'project:company-a:project-b'
+    let resolve!: (value: AccessContext) => void
+    api.getAccessContext.mockImplementationOnce(
+      () =>
+        new Promise<AccessContext>((done) => {
+          resolve = done
+        }),
+    )
+    const navigation = fixture.router.navigate('/companies/company-a/projects/project-b')
+    await vi.waitFor(() => expect(resolve).toBeDefined())
+    expect(api.getAccessContext).toHaveBeenCalledWith(nextScope, {
+      workspaceKey: nextWorkspaceKey,
+      signal: expect.any(AbortSignal),
+    })
+    expect(api.getWorkspaces).toHaveBeenCalledWith({
+      workspaceKey: nextWorkspaceKey,
+      signal: expect.any(AbortSignal),
+    })
+    expect(fixture.access(projectScope)?.scope).toEqual(projectScope)
+    expect(fixture.access(nextScope)).toBeUndefined()
+    resolve(access(nextScope))
+    await navigation
+    expect(fixture.access(projectScope)?.scope).toEqual(projectScope)
+    expect(fixture.access(nextScope)?.scope).toEqual(nextScope)
+    expect(fixture.router.state.errors).toBeNull()
+    expect(fixture.router.state.loaderData).toEqual({})
+  })
+
+  it('同位置撤销空间身份后清除权限，重新校验成功可以恢复', async () => {
+    await fixture.router.navigate(projectPath)
+    const key = fixture.router.state.location.key
+    api.getAccessContext.mockRejectedValueOnce(
+      Object.assign(new Error('身份已撤销'), { status: 403 }),
+    )
+    await fixture.router.revalidate()
+    expect(fixture.access(projectScope)).toBeUndefined()
+    expect(Object.values(fixture.router.state.errors ?? {})).toEqual([
+      expect.objectContaining({ status: 403 }),
+    ])
+    await fixture.router.revalidate()
+    expect(fixture.router.state.location.key).toBe(key)
+    expect(fixture.router.state.errors).toBeNull()
+    expect(fixture.access(projectScope)?.scope).toEqual(projectScope)
+  })
+
+  it('取消刷新不会清掉已经验证的空间权限', async () => {
+    await fixture.router.navigate(projectPath)
+    api.getAccessContext.mockRejectedValueOnce(new DOMException('请求已取消', 'AbortError'))
+    await fixture.router.revalidate()
+    expect(fixture.access(projectScope)?.scope).toEqual(projectScope)
+  })
+
+  it('更换账号后不再读取原账号的列表与空间权限', async () => {
+    await fixture.router.navigate('/workspaces')
+    await fixture.router.navigate(projectPath)
+    session.token = 'another-account'
+    expect(fixture.workspaces()).toBeUndefined()
+    expect(fixture.access(projectScope)).toBeUndefined()
+    await fixture.router.revalidate()
+    expect(fixture.access(projectScope)?.scope).toEqual(projectScope)
+  })
+
+  it('Hash 导航仍可读取当前空间，查询参数变化重新取权限', async () => {
+    await fixture.router.navigate(projectPath)
+    await fixture.router.navigate(`${projectPath}#section`)
+    expect(api.getAccessContext).toHaveBeenCalledTimes(1)
+    expect(fixture.access(projectScope)?.scope).toEqual(projectScope)
+    await fixture.router.navigate(`${projectPath}?view=details#section`)
+    expect(api.getAccessContext).toHaveBeenCalledTimes(2)
+    expect(fixture.access(projectScope)?.scope).toEqual(projectScope)
+  })
+
+  it('列表刷新失败不保留旧列表，重试后可显示最新空列表', async () => {
+    await fixture.router.navigate('/workspaces')
+    expect(fixture.workspaces()?.workspaces).toHaveLength(1)
+    api.getWorkspaces.mockRejectedValueOnce(new Error('列表获取失败'))
+    await fixture.router.revalidate()
+    expect(fixture.workspaces()).toBeUndefined()
+    setWorkspaces([])
+    await fixture.router.revalidate()
+    expect(fixture.router.state.errors).toBeNull()
+    expect(fixture.workspaces()?.workspaces).toEqual([])
+  })
+})

package/template-vp-monorepo-react-nestjs/apps/web/test/selector/global-account-select.spec.ts

@@ -0,0 +1,311 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vite-plus/test'
+import type { GlobalAccountOption, GlobalAccountSelectProps } from '../../src/components/Selector'
+
+const hookRuntime = vi.hoisted(() => {
+  type Cleanup = (() => void) | void
+  interface EffectSlot {
+    callback?: () => Cleanup
+    cleanup?: () => void
+    dependencies?: readonly unknown[]
+    nextDependencies?: readonly unknown[]
+    pending: boolean
+  }
+
+  const states: unknown[] = []
+  const refs: Array<{ current: unknown }> = []
+  const effects: EffectSlot[] = []
+  let stateIndex = 0
+  let refIndex = 0
+  let effectIndex = 0
+
+  /** 判断依赖数组是否发生 React effect 语义下的变化。 */
+  function dependenciesChanged(
+    previous: readonly unknown[] | undefined,
+    next: readonly unknown[] | undefined,
+  ) {
+    if (!previous || !next || previous.length !== next.length) return true
+    return next.some((item, index) => !Object.is(item, previous[index]))
+  }
+
+  return {
+    /** 开始一次组件函数渲染，并重置各类 Hook 的读取位置。 */
+    beginRender() {
+      stateIndex = 0
+      refIndex = 0
+      effectIndex = 0
+    },
+    /** 执行本轮发生依赖变化的 effect，并先清理上一轮副作用。 */
+    flushEffects() {
+      for (const slot of effects) {
+        if (!slot.pending || !slot.callback) continue
+        slot.cleanup?.()
+        const cleanup = slot.callback()
+        slot.cleanup = typeof cleanup === 'function' ? cleanup : undefined
+        slot.dependencies = slot.nextDependencies
+        slot.pending = false
+      }
+    },
+    /** 卸载当前测试组件并清空 Hook 状态。 */
+    reset() {
+      for (const slot of effects) slot.cleanup?.()
+      states.length = 0
+      refs.length = 0
+      effects.length = 0
+      stateIndex = 0
+      refIndex = 0
+      effectIndex = 0
+    },
+    useEffect(this: void, callback: () => Cleanup, dependencies?: readonly unknown[]) {
+      const index = effectIndex++
+      const slot = effects[index] ?? { pending: false }
+      effects[index] = slot
+      if (!dependenciesChanged(slot.dependencies, dependencies)) return
+      slot.callback = callback
+      slot.nextDependencies = dependencies
+      slot.pending = true
+    },
+    useRef<T>(this: void, initialValue?: T) {
+      const index = refIndex++
+      if (!refs[index]) refs[index] = { current: initialValue }
+      return refs[index] as { current: T }
+    },
+    useState<T>(this: void, initialValue: T | (() => T)) {
+      const index = stateIndex++
+      if (!(index in states)) {
+        states[index] =
+          typeof initialValue === 'function' ? (initialValue as () => T)() : initialValue
+      }
+      const setValue = (nextValue: T | ((current: T) => T)) => {
+        const current = states[index] as T
+        states[index] =
+          typeof nextValue === 'function' ? (nextValue as (value: T) => T)(current) : nextValue
+      }
+      return [states[index] as T, setValue] as const
+    },
+  }
+})
+
+vi.mock('react', async (importOriginal) => {
+  const react = await importOriginal<Record<string, unknown>>()
+  return {
+    ...react,
+    useEffect: hookRuntime.useEffect,
+    useRef: hookRuntime.useRef,
+    useState: hookRuntime.useState,
+  }
+})
+
+vi.mock('@bubblesjs/i18n-react', () => ({
+  useI18n: () => ({ tr: (message: string) => message }),
+}))
+
+vi.mock('antd', () => ({
+  Flex: 'div',
+  Select: 'select',
+  Spin: 'span',
+  Tag: 'span',
+  Typography: { Text: 'span' },
+}))
+
+import GlobalAccountSelect from '../../src/components/Selector/GlobalAccountSelect'
+
+interface SelectElement {
+  props: {
+    labelRender: (input: { value?: string }) => unknown
+    loading: boolean
+    options: Array<{ value: string; label: string }>
+    showSearch: { onSearch: (query: string) => void }
+  }
+}
+
+interface Deferred<T> {
+  promise: Promise<T>
+  resolve: (value: T) => void
+}
+
+/** 创建可由测试显式完成的 Promise。 */
+function deferred<T>(): Deferred<T> {
+  let complete: (value: T) => void = () => undefined
+  const promise = new Promise<T>((resolve) => {
+    complete = resolve
+  })
+  return { promise, resolve: complete }
+}
+
+/** 创建满足选择器契约的启用账号候选。 */
+function account(userId: string, name: string): GlobalAccountOption {
+  return {
+    userId,
+    name,
+    account: `${name.toLowerCase()}@example.com`,
+    status: 'active',
+    disabled: false,
+    disabledReason: null,
+  }
+}
+
+/** 使用轻量 Hook 运行时执行一次组件渲染并返回 Select 属性。 */
+function renderSelect(props: GlobalAccountSelectProps) {
+  hookRuntime.beginRender()
+  return GlobalAccountSelect(props) as unknown as SelectElement
+}
+
+/** 等待 resolve/search Promise 的 then、catch 与 finally 链全部完成。 */
+async function flushMicrotasks() {
+  await Promise.resolve()
+  await Promise.resolve()
+  await Promise.resolve()
+}
+
+const emptySearch: GlobalAccountSelectProps['request'] = async () => ({ items: [], total: 0 })
+
+describe('GlobalAccountSelect 的 userId 回显补查', () => {
+  beforeEach(() => {
+    hookRuntime.reset()
+    vi.useFakeTimers()
+    vi.stubGlobal('window', {
+      clearTimeout: globalThis.clearTimeout,
+      setTimeout: globalThis.setTimeout,
+    })
+  })
+
+  afterEach(() => {
+    hookRuntime.reset()
+    vi.clearAllTimers()
+    vi.useRealTimers()
+    vi.unstubAllGlobals()
+  })
+
+  it('初始 userId 通过 resolve 回显姓名和完整账号', async () => {
+    const alice = account('user-alice', 'Alice')
+    const resolve = vi.fn(async () => [alice])
+
+    renderSelect({ value: alice.userId, request: emptySearch, resolve })
+    hookRuntime.flushEffects()
+    await flushMicrotasks()
+    const select = renderSelect({ value: alice.userId, request: emptySearch, resolve })
+
+    expect(resolve).toHaveBeenCalledExactlyOnceWith([alice.userId], expect.any(AbortSignal))
+    expect(select.props.labelRender({ value: alice.userId })).toBe('Alice · alice@example.com')
+  })
+
+  it('初始搜索状态更新不会取消正在进行的账号回显补查', async () => {
+    const alice = account('user-alice', 'Alice')
+    const pendingResolve = deferred<readonly GlobalAccountOption[]>()
+    const signals: AbortSignal[] = []
+    const resolve = vi.fn((_userIds: readonly string[], signal: AbortSignal) => {
+      signals.push(signal)
+      return pendingResolve.promise
+    })
+    const props = { value: alice.userId, request: emptySearch, resolve }
+
+    renderSelect(props)
+    hookRuntime.flushEffects()
+
+    // 模拟 effect 内 setAccounts([]) 与 setResolving(true) 触发的真实 React 重渲染。
+    renderSelect(props)
+    hookRuntime.flushEffects()
+    expect(signals[0]?.aborted).toBe(false)
+
+    pendingResolve.resolve([alice])
+    await flushMicrotasks()
+    const select = renderSelect(props)
+
+    expect(resolve).toHaveBeenCalledTimes(1)
+    expect(select.props.labelRender({ value: alice.userId })).toBe('Alice · alice@example.com')
+  })
+
+  it('value 切换时取消旧补查并忽略过期结果', async () => {
+    const alice = account('user-alice', 'Alice')
+    const bob = account('user-bob', 'Bob')
+    const aliceRequest = deferred<readonly GlobalAccountOption[]>()
+    const bobRequest = deferred<readonly GlobalAccountOption[]>()
+    const signals: AbortSignal[] = []
+    const resolve = vi.fn((userIds: readonly string[], signal: AbortSignal) => {
+      signals.push(signal)
+      return userIds[0] === alice.userId ? aliceRequest.promise : bobRequest.promise
+    })
+
+    renderSelect({ value: alice.userId, request: emptySearch, resolve })
+    hookRuntime.flushEffects()
+    renderSelect({ value: bob.userId, request: emptySearch, resolve })
+    hookRuntime.flushEffects()
+    expect(signals[0]?.aborted).toBe(true)
+
+    bobRequest.resolve([bob])
+    aliceRequest.resolve([alice])
+    await flushMicrotasks()
+    const select = renderSelect({ value: bob.userId, request: emptySearch, resolve })
+
+    expect(resolve).toHaveBeenCalledTimes(2)
+    expect(select.props.labelRender({ value: bob.userId })).toBe('Bob · bob@example.com')
+  })
+
+  it('空补查结果不伪造账号，也不会在重渲染时重复请求', async () => {
+    const resolve = vi.fn(async () => [])
+    const props = { value: 'missing-user', request: emptySearch, resolve }
+
+    renderSelect(props)
+    hookRuntime.flushEffects()
+    await flushMicrotasks()
+    renderSelect(props)
+    hookRuntime.flushEffects()
+    const select = renderSelect(props)
+    hookRuntime.flushEffects()
+
+    expect(resolve).toHaveBeenCalledTimes(1)
+    expect(select.props.labelRender({ value: 'missing-user' })).toBe('账号信息不可用')
+  })
+
+  it('补查失败被消费且不阻断后续关键词搜索', async () => {
+    const alice = account('user-alice', 'Alice')
+    const unhandledRejection = vi.fn()
+    process.on('unhandledRejection', unhandledRejection)
+    const resolve = vi.fn(async () => {
+      throw new Error('resolve failed')
+    })
+    const request = vi.fn(async () => ({ items: [alice], total: 1 }))
+    const props = { value: 'missing-user', request, resolve, debounceMs: 0 }
+
+    try {
+      renderSelect(props)
+      hookRuntime.flushEffects()
+      await flushMicrotasks()
+      const failedSelect = renderSelect(props)
+      hookRuntime.flushEffects()
+      failedSelect.props.showSearch.onSearch('alice')
+
+      renderSelect(props)
+      hookRuntime.flushEffects()
+      await vi.runAllTimersAsync()
+      await flushMicrotasks()
+      const searchedSelect = renderSelect(props)
+
+      expect(unhandledRejection).not.toHaveBeenCalled()
+      expect(resolve).toHaveBeenCalledTimes(1)
+      expect(request).toHaveBeenCalledExactlyOnceWith(
+        expect.objectContaining({ query: 'alice', signal: expect.any(AbortSignal) }),
+      )
+      expect(searchedSelect.props.options).toEqual([
+        expect.objectContaining({ value: alice.userId, label: 'Alice · alice@example.com' }),
+      ])
+    } finally {
+      process.off('unhandledRejection', unhandledRejection)
+    }
+  })
+
+  it('已提供账号快照时直接回显且不发起补查', () => {
+    const alice = account('user-alice', 'Alice')
+    const resolve = vi.fn(async () => [alice])
+    const select = renderSelect({
+      value: alice.userId,
+      selectedAccount: alice,
+      request: emptySearch,
+      resolve,
+    })
+    hookRuntime.flushEffects()
+
+    expect(resolve).not.toHaveBeenCalled()
+    expect(select.props.labelRender({ value: alice.userId })).toBe('Alice · alice@example.com')
+  })
+})