shanxia2.0/web-admin/scripts/test-mp-crm-customer.mjs

import { chromium } from 'playwright'
import assert from 'node:assert/strict'
import { mkdir } from 'node:fs/promises'

// 本地 H5 交互回归：所有 API 均由 fixture 拦截，不写真实业务库。
const origin = process.env.CUSTOMER_TEST_ORIGIN || 'http://localhost:3006'
const artifacts = '/tmp/shanxia-customer-e2e'
await mkdir(artifacts, { recursive: true })
const browser = await chromium.launch({ headless: true, channel: 'chrome' })
const context = await browser.newContext({
  viewport: { width: 375, height: 812 },
  isMobile: true,
  deviceScaleFactor: 1
})
const page = await context.newPage()
const pageErrors = []
page.on('pageerror', (error) => pageErrors.push(error.message))
const calls = []
const customers = [
  {
    id: '90071992547409931',
    customerNo: 'KH001',
    customerName: '山峡化工测试客户',
    shortName: '山峡',
    customerType: 'company',
    level: 'normal',
    status: 'normal',
    dealStatus: 'undeal',
    mobile: '13800138000',
    source: 'phone',
    parkArea: '园区A',
    province: '湖北',
    city: '宜昌',
    district: '西陵',
    ownerUserId: 'user-1',
    ownerUserName: '测试用户',
    createBy: 'user-1',
    createTime: '2026-10-17 09:00:00',
    businessLicenseImages: '',
    businessPermitImages: '',
    otherCertImages: ''
  }
]
const page2Customer = {
  ...customers[0],
  id: 'customer-page-2',
  customerNo: 'KH-P2',
  customerName: '分页客户'
}
const secondCustomer = {
  ...customers[0],
  id: 'customer-fast-b',
  customerNo: 'KH-B',
  customerName: '快速客户B',
  shortName: '客户B'
}
let contacts = [
  {
    id: 'contact-1',
    customerId: customers[0].id,
    contactName: '张经理',
    mobile: '13800138001',
    role: 'decision',
    status: 'active',
    isPrimary: 0,
    isKey: 1,
    createBy: 'user-1'
  }
]
let follows = []
let invoices = []
const opportunity = {
  id: 'opp-1',
  opportunityName: '测试商机',
  customerId: customers[0].id,
  customerName: customers[0].customerName,
  amount: 123,
  status: 'following',
  stage: 'initial',
  stagePercent: 10,
  winRate: 30,
  ownerUserId: 'user-1',
  createBy: 'user-1'
}
let opportunityFollows = []
let failInvoice = false
let failList = false
let failNextPage2 = false
let delayNextPage2 = false
let delayedDetailId = ''
let forbiddenMode = ''
let uploadGate = null
let signalUploadStarted = null
let uploadQueue = []
const dict = Object.fromEntries(
  Object.entries({
    crm_customer_type: ['company', '企业'],
    crm_customer_level: ['normal', '普通'],
    crm_clue_source: ['phone', '电话'],
    crm_customer_park: ['园区A', '园区A'],
    crm_follow_type: ['phone', '电话'],
    crm_customer_status: ['normal', '正常'],
    crm_deal_status: ['undeal', '未成交'],
    crm_contact_role: ['decision', '决策人']
  }).map(([key, [value, label]]) => [key, [{ value, label, tagType: 'success' }]])
)
dict.crm_customer_type.push({ value: 'person', label: '个人', tagType: 'info' })
dict.crm_customer_level.push({ value: 'key', label: '重点', tagType: 'warning' })
dict.crm_opportunity_stage = [
  { value: 'initial', label: '初步' },
  { value: 'quote', label: '报价' }
]
await context.addInitScript(() => {
  window.wx = {
    miniProgram: {
      navigateBack() {},
      reLaunch() {},
      getEnv(cb) {
        cb({ miniprogram: true })
      }
    }
  }
})
await context.route('**/api/**', async (route) => {
  const request = route.request()
  if (!new URL(request.url()).pathname.startsWith('/api/')) return route.continue()
  const path = new URL(request.url()).pathname.replace(/^\/api/, '')
  let body = {}
  try {
    body = request.postDataJSON() || {}
  } catch {
    body = {}
  }
  calls.push({ path, body })
  let data = {}
  let code = 200
  let msg = 'ok'
  if (path === '/web/auth/mp-webview-exchange') {
    const ticket = String(body.ticket || '')
    forbiddenMode = ticket.includes('forbidden-list')
      ? 'list'
      : ticket.includes('forbidden-detail')
        ? 'detail'
        : ''
    data = {
      token: 'fixture-token',
      refreshToken: 'fixture-refresh',
      userInfo: {
        id: 'user-1',
        userId: 'user-1',
        userName: '测试用户',
        role: 'admin',
        roles: ['admin']
      }
    }
  } else if (path === '/web/admin/dict-data/all') data = dict
  else if (path === '/web/auth/current-user')
    data = { id: 'user-1', userId: 'user-1', userName: '测试用户' }
  else if (path === '/web/auth/menu-codes') data = []
  else if (path === '/web/admin/menu-favorites') data = []
  else if (path === '/web/admin/users/options') data = [{ value: 'user-1', label: '测试用户' }]
  else if (/\/customer\/(list|mine|toFollow|key)$/.test(path)) {
    if (forbiddenMode === 'list') {
      code = 403
      msg = '无权限访问客户列表'
    } else if (failList) {
      code = 500
      msg = '列表测试失败'
      failList = false
    } else if (Number(body.page) === 2) {
      if (failNextPage2) {
        code = 500
        msg = '分页测试失败'
        failNextPage2 = false
      } else {
        if (delayNextPage2) {
          delayNextPage2 = false
          await new Promise((resolve) => setTimeout(resolve, 500))
        }
        data = { list: [page2Customer], total: customers.length + 1 }
      }
    } else data = { list: customers, total: customers.length + 1 }
  } else if (path === '/web/crm/customer/detail') {
    if (forbiddenMode === 'detail') {
      code = 403
      msg = '无权限访问客户详情'
    } else {
      if (body.id === delayedDetailId) await new Promise((resolve) => setTimeout(resolve, 500))
      data = [...customers, secondCustomer].find((c) => c.id === body.id)
    }
  } else if (path === '/web/crm/customer/checkDuplicate')
    data = { isDuplicate: false, duplicates: [] }
  else if (path === '/web/crm/customer/options') data = customers
  else if (path === '/web/crm/customer/column-facet-values')
    data = {
      list: body.keyword
        ? [{ value: 'KH-REMOTE-201', label: '第201号外值', count: 1 }]
        : [{ value: 'KH001', label: 'KH001', count: 1 }]
    }
  else if (path === '/web/crm/customer/add') {
    data = { ...body, id: 'created-customer', customerNo: 'KH002', createBy: 'user-1' }
    customers.push(data)
  } else if (path === '/web/crm/customer/update') {
    Object.assign(
      customers.find((c) => c.id === body.id),
      body
    )
    data = body
  } else if (path === '/web/crm/customer/delete' || path === '/web/crm/customer/intoPool') {
    for (let i = customers.length - 1; i >= 0; i--)
      if (body.ids.includes(customers[i].id)) customers.splice(i, 1)
  } else if (path === '/web/crm/contact/byCustomer') data = contacts
  else if (path === '/web/crm/contact/detail') data = contacts.find((c) => c.id === body.id)
  else if (path === '/web/crm/contact/add') {
    data = { ...body, id: 'contact-2', createBy: 'user-1' }
    contacts.push(data)
  } else if (path === '/web/crm/contact/update') {
    Object.assign(
      contacts.find((c) => c.id === body.id),
      body
    )
    data = body
  } else if (path === '/web/crm/contact/setPrimary')
    contacts.forEach((c) => (c.isPrimary = c.id === body.id ? 1 : 0))
  else if (path === '/web/crm/contact/delete')
    contacts = contacts.filter((c) => !body.ids.includes(c.id))
  else if (path === '/web/crm/customer/follow/byCustomer') data = follows
  else if (path === '/web/crm/customer/follow/add') {
    data = {
      ...body,
      id: 'follow-1',
      createBy: 'user-1',
      createByName: '测试用户',
      contactName: '张经理'
    }
    follows.push(data)
  } else if (path === '/web/crm/customer/follow/delete')
    follows = follows.filter((f) => !body.ids.includes(f.id))
  else if (path === '/web/crm/invoice-info/by-customer') data = invoices
  else if (path === '/web/crm/invoice-info/add') {
    if (failInvoice) {
      code = 500
      msg = '开票测试失败'
      failInvoice = false
    } else {
      data = { ...body, id: 'invoice-1', createBy: 'user-1' }
      invoices.push(data)
    }
  } else if (path === '/web/crm/invoice-info/update') {
    Object.assign(
      invoices.find((i) => i.id === body.id),
      body
    )
    data = body
  } else if (path === '/web/crm/invoice-info/set-default')
    invoices.forEach((i) => (i.isDefault = i.id === body.id ? '1' : '0'))
  else if (path === '/web/crm/invoice-info/delete')
    invoices = invoices.filter((i) => i.id !== body.id)
  else if (path === '/web/admin/attachment/upload') {
    signalUploadStarted?.()
    signalUploadStarted = null
    if (uploadGate) await uploadGate
    const queued = uploadQueue.shift()
    if (queued?.fail) {
      code = 500
      msg = queued.fail
    } else {
      data = queued?.data || {
        id: 'file-1',
        fileName: '证件.pdf',
        fileUrl: '/fixtures/customer.pdf',
        fileType: 'application/pdf'
      }
    }
  } else if (path === '/web/admin/attachment/preview-url') data = { previewUrl: body.fileUrl }
  else if (path === '/web/crm/opportunity/list')
    data = {
      list: [opportunity],
      total: 1
    }
  else if (path === '/web/crm/opportunity/detail') data = opportunity
  else if (path === '/web/crm/opportunity/update' || path === '/web/crm/opportunity/stage')
    Object.assign(opportunity, body)
  else if (path === '/web/crm/opportunity/follow/list')
    data = { list: opportunityFollows, total: opportunityFollows.length }
  else if (path === '/web/crm/opportunity/follow/add')
    opportunityFollows.push({ ...body, id: 'opp-follow-1', createBy: 'user-1' })
  else if (path === '/web/crm/opportunity/follow/update') Object.assign(opportunityFollows[0], body)
  else if (path === '/web/crm/opportunity/follow/delete') opportunityFollows = []
  else if (path.includes('/opportunity/')) data = { list: [] }
  else if (path === '/web/crm/contract/list')
    data = { rows: [{ id: 'contract-1', contractName: '测试合同' }], total: 1 }
  else if (path === '/web/monitor/operlog/list')
    data = {
      rows: [
        {
          id: 'log-1',
          title: 'CRM客户管理',
          operName: '测试用户',
          status: '0',
          operParam: '<img src=x onerror=alert(1)>',
          operTime: '2026-10-17 10:00:00'
        }
      ],
      total: 1
    }
  else throw new Error(`未处理的客户 E2E API：${path}`)
  await route.fulfill({
    contentType: 'application/json',
    body: JSON.stringify({ code, msg, data })
  })
})
const label = (name) => page.getByLabel(name, { exact: true }).filter({ visible: true })
const click = (name) =>
  page
    .getByRole('button', { name, exact: true })
    .or(page.getByRole('tab', { name, exact: true }))
    .filter({ visible: true })
    .click()
const waitHeading = (name) => page.getByRole('heading', { name, exact: true }).waitFor()
const closeSheet = () =>
  page.getByRole('button', { name: '关闭', exact: true }).filter({ visible: true }).click()
const hideDevTools = async () => {
  await page.addStyleTag({
    content:
      '#vue-devtools-anchor,.vue-devtools__anchor,.vue-devtools-frame{display:none!important}'
  })
  assert.equal(await page.locator('#vue-devtools-anchor').filter({ visible: true }).count(), 0)
}
const assertNoOverflow = async (label) => {
  const overflow = await page.evaluate(() => document.documentElement.scrollWidth > innerWidth)
  assert.equal(overflow, false, `${label}不应横向溢出`)
}
const assertMinTouchTargets = async (locator, label, minHeight = 44) => {
  const sizes = await locator.evaluateAll((elements) =>
    elements
      .filter((element) => element.getClientRects().length > 0)
      .map((element) => ({
        width: element.getBoundingClientRect().width,
        height: element.getBoundingClientRect().height
      }))
  )
  assert.ok(sizes.length > 0, `${label}应存在可见触控目标`)
  assert.ok(
    sizes.every(({ width, height }) => width >= 44 && height >= minHeight),
    `${label}触控目标应至少为44×${minHeight}px：${JSON.stringify(sizes)}`
  )
}
const waitForMessagesToClear = () =>
  page.waitForFunction(() => !document.querySelector('.el-message'), undefined, { timeout: 6000 })
try {
  await page.goto(`${origin}/#/m/crm/customer?mpTicket=customer-forbidden-list`)
  await page.locator('.mp-customer-error').filter({ hasText: '无权限访问客户列表' }).waitFor()
  assert.equal(await page.locator('.mp-crm-expense-card').count(), 0)
  assert.equal(await page.locator('.mp-wv-status-tabs').count(), 0)
  assert.equal(await page.locator('.mp-wv-filter-bar--three').count(), 0)
  assert.equal(await page.locator('.mp-customer-summary').count(), 0)
  assert.equal(await page.locator('.mp-wv-speed-dial').count(), 0)
  assert.equal(await page.locator('.mp-customer-batch-bar').count(), 0)
  assert.equal(await page.locator('.mp-customer-sheet').count(), 0)

  await page.goto(
    `${origin}/#/m/crm/customer/${customers[0].id}?mpTicket=customer-forbidden-detail`
  )
  await page.locator('.mp-customer-error').filter({ hasText: '无权限访问客户详情' }).waitFor()

  await page.goto(`${origin}/#/m/crm/customer?mpTicket=customer-fixture`)
  await hideDevTools()
  await page.getByRole('button', { name: `查看客户：${customers[0].customerName}` }).waitFor()
  const skeletonOrder = await page
    .locator('.mp-wv-header, .mp-wv-status-tabs, .mp-wv-filter-bar--three, .mp-crm-expense-card')
    .evaluateAll((nodes) => nodes.map((node) => node.className))
  assert.match(String(skeletonOrder[0]), /mp-wv-header/)
  assert.match(String(skeletonOrder[1]), /mp-wv-status-tabs/)
  assert.match(String(skeletonOrder[2]), /mp-wv-filter-bar--three/)
  assert.match(String(skeletonOrder[3]), /mp-crm-expense-card/)
  assert.equal(await page.locator('.mp-customer-actions').filter({ visible: true }).count(), 0)
  assert.equal(await page.locator('.mp-wv-speed-dial').count(), 1)
  assert.equal(await page.getByText('导出', { exact: true }).count(), 0)
  const cardActionSizes = await page
    .locator('.mp-crm-expense-card .op-actions button')
    .evaluateAll((buttons) =>
      buttons.map((button) => ({
        width: button.getBoundingClientRect().width,
        height: button.getBoundingClientRect().height
      }))
    )
  assert.ok(cardActionSizes.every(({ width, height }) => width >= 44 && height >= 28 && height <= 32))

  await assertMinTouchTargets(page.locator('.mp-wv-speed-main'), 'Speed Dial主按钮')
  await click('快捷操作')
  await assertMinTouchTargets(page.locator('.mp-wv-speed-item'), 'Speed Dial菜单', 30)
  await click('批量选择')
  await assertMinTouchTargets(page.locator('.mp-customer-batch-bar button'), '批量操作栏', 30)
  await page.locator('.expense-card__select').first().click()
  assert.equal(await page.locator('.mp-crm-expense-card .ec-bottom').count(), 0)
  failList = true
  await click('重点')
  await page.getByText('列表测试失败', { exact: true }).first().waitFor()
  assert.equal(await page.locator('.mp-crm-expense-card').count(), 0)
  assert.match(await page.locator('.mp-customer-summary').innerText(), /共 0 位客户 · 已加载 0 位/)
  assert.match(await page.locator('.mp-customer-batch-bar').innerText(), /已选 0 项/)
  await click('重试')
  await page.getByRole('button', { name: `查看客户：${customers[0].customerName}` }).waitFor()
  await click('完成')
  await click('全部')

  failNextPage2 = true
  await click('加载更多（1/2）')
  await page.getByText('分页测试失败', { exact: true }).waitFor()
  await click('重试')
  await page.getByRole('button', { name: '查看客户：分页客户', exact: true }).waitFor()
  const page2Calls = calls.filter(
    (call) => call.path.endsWith('/customer/list') && Number(call.body.page) === 2
  )
  assert.deepEqual(
    page2Calls.slice(-2).map((call) => Number(call.body.page)),
    [2, 2],
    '分页失败后重试不得跳到第 3 页'
  )

  await page.getByLabel('搜索客户').fill('测试')
  await Promise.all([
    page.waitForResponse((response) => response.url().endsWith('/customer/list')),
    page.getByLabel('搜索客户').press('Enter')
  ])
  await Promise.all([
    page.waitForResponse((response) => response.url().endsWith('/customer/list')),
    page.getByLabel('搜索客户').fill('')
  ])
  assert.equal(
    calls.findLast((call) => call.path.endsWith('/customer/list')).body.keyword,
    undefined
  )

  delayNextPage2 = true
  await click('加载更多（1/2）')
  await click('客户类型')
  await click('企业')
  await page.waitForTimeout(650)
  assert.equal(
    await page.getByRole('button', { name: '查看客户：分页客户', exact: true }).count(),
    0,
    '旧筛选的第 2 页结果不得混入新筛选'
  )
  await click('企业')
  await click('全部类型')
  for (const [name, endpoint] of [
    ['待跟进', 'toFollow'],
    ['重点', 'key'],
    ['全部', 'list']
  ]) {
    await Promise.all([
      page.waitForResponse((r) => r.url().endsWith('/customer/' + endpoint)),
      click(name)
    ])
  }
  await Promise.all([
    page.waitForResponse((r) => r.url().includes('/customer/mine')),
    click('我的')
  ])
  assert.equal(calls.findLast((c) => c.path.endsWith('/customer/mine')).body.viewMode, 'mine')
  await page.getByLabel('搜索客户').fill('顶部词')
  await Promise.all([
    page.waitForResponse((r) => r.url().includes('/customer/mine')),
    page.getByLabel('搜索客户').press('Enter')
  ])
  await page.getByRole('button', { name: /^更多/ }).click()
  const filterSheet = page.locator('.mp-sheet').filter({ hasText: '更多筛选' })
  await assertMinTouchTargets(
    filterSheet.locator('.mp-sheet-close, .mp-sheet-foot button'),
    '更多筛选底部与关闭按钮',
    30
  )
  assert.equal(await filterSheet.getByLabel('关键词').inputValue(), '顶部词')
  assert.equal(await filterSheet.getByLabel('业务视图').inputValue(), 'mine')
  await filterSheet.getByLabel('关键词').fill('面板词')
  await filterSheet.getByLabel('业务视图').selectOption('key')
  await filterSheet.getByLabel('排序字段').selectOption('createTime')
  const mobileFilter = filterSheet
    .locator('details')
    .filter({ has: page.locator('summary:text-is("手机号")') })
  await mobileFilter.locator('summary').click()
  await mobileFilter.locator('input').fill('138')
  const followCountFilter = filterSheet
    .locator('details')
    .filter({ has: page.locator('summary:text-is("跟进次数")') })
  await followCountFilter.locator('summary').click()
  await followCountFilter.getByLabel('最小值').fill('1')
  const createTimeFilter = filterSheet
    .locator('details')
    .filter({ has: page.locator('summary:text-is("创建时间")') })
  await createTimeFilter.locator('summary').click()
  await createTimeFilter.getByLabel('起始时间').fill('2026-10-01T08:00')
  const customerNoFilter = filterSheet
    .locator('details')
    .filter({ has: page.locator('summary:text-is("客户编号")') })
  await customerNoFilter.locator('summary').click()
  await Promise.all([
    page.waitForResponse((r) => r.url().endsWith('/customer/column-facet-values')),
    customerNoFilter.locator('input[type="search"]').fill('远端')
  ])
  assert.equal(
    calls.findLast((c) => c.path.endsWith('/customer/column-facet-values')).body.keyword,
    '远端'
  )
  await customerNoFilter.getByText('第201号外值', { exact: true }).waitFor()
  await page.locator('summary').filter({ hasText: '客户类型' }).click()
  await page.getByLabel('企业', { exact: true }).check()
  await page.getByLabel('个人', { exact: true }).check()
  await page.locator('summary').filter({ hasText: '客户级别' }).click()
  await page.getByLabel('普通', { exact: true }).check()
  await page.getByLabel('重点', { exact: true }).check()
  await page.getByLabel('客户简称', { exact: true }).uncheck()
  await Promise.all([
    page.waitForResponse((r) => r.url().includes('/customer/key')),
    click('应用筛选')
  ])
  const appliedFilterCall = calls.findLast((c) => c.path.endsWith('/customer/key'))
  assert.equal(appliedFilterCall.body.keyword, '面板词')
  assert.equal(appliedFilterCall.body.customerTypeIn, 'company,person')
  assert.equal(appliedFilterCall.body.levelIn, 'normal,key')
  assert.equal(appliedFilterCall.body.mobile, '138')
  assert.equal(appliedFilterCall.body.followCountMin, '1')
  assert.equal(appliedFilterCall.body.beginTime, '2026-10-01 08:00:00')
  assert.equal(appliedFilterCall.body.sortField, 'createTime')
  assert.equal(await page.getByLabel('搜索客户').inputValue(), '面板词')
  assert.equal(
    await page.getByRole('button', { name: '重点', exact: true }).getAttribute('aria-pressed'),
    'true'
  )
  assert.deepEqual(
    await page.locator('.mp-wv-filter-bar--three .mp-wv-filter-trig__val').allTextContents(),
    ['已选2项', '已选2项']
  )
  await page.locator('.mp-wv-filter-bar--three .mp-wv-filter-trig').first().click()
  await click('企业')
  assert.equal(
    calls.findLast((c) => c.path.endsWith('/customer/key')).body.customerTypeIn,
    'company'
  )
  assert.equal(
    await page.locator('.mp-wv-filter-bar--three .mp-wv-filter-trig__val').first().innerText(),
    '企业'
  )
  assert.equal(
    await page
      .locator('.mp-crm-expense-card')
      .first()
      .getByText('客户简称', { exact: true })
      .count(),
    0
  )
  await page.getByRole('button', { name: /^更多/ }).click()
  await Promise.all([
    page.waitForResponse((r) => r.url().endsWith('/customer/list')),
    filterSheet.getByRole('button', { name: '重置', exact: true }).click()
  ])
  assert.equal(await page.getByLabel('搜索客户').inputValue(), '')
  assert.equal(
    await page.getByRole('button', { name: '全部', exact: true }).getAttribute('aria-pressed'),
    'true'
  )
  assert.deepEqual(
    await page.locator('.mp-wv-filter-bar--three .mp-wv-filter-trig__val').allTextContents(),
    ['客户类型', '客户级别']
  )
  assert.equal(
    await page
      .locator('.mp-crm-expense-card')
      .first()
      .getByText('客户简称', { exact: true })
      .count(),
    1
  )
  await page.waitForTimeout(3200)
  await page.setViewportSize({ width: 414, height: 812 })
  await hideDevTools()
  await assertNoOverflow('414px 有数据列表')
  await page.screenshot({ path: `${artifacts}/list-414.png`, fullPage: true })
  await page.setViewportSize({ width: 375, height: 812 })
  await assertNoOverflow('375px 有数据列表')
  await page.screenshot({ path: `${artifacts}/list-375.png`, fullPage: true })
  await page.getByRole('button', { name: `查看客户：${customers[0].customerName}` }).click()
  await waitHeading('客户详情')
  await page.goto(`${origin}/#/m/crm/customer/${customers[0].id}`)
  await waitHeading('客户详情')
  await page.reload()
  await waitHeading('客户详情')
  customers[0].createBy = 'another-user'
  await page.reload()
  await waitHeading('客户详情')
  assert.equal(await page.getByRole('button', { name: '删除', exact: true }).isDisabled(), true)
  customers[0].createBy = 'user-1'
  await page.reload()
  await waitHeading('客户详情')
  assert.equal(await page.getByRole('button', { name: '删除', exact: true }).isEnabled(), true)
  const detailActionSizes = await page.locator('.mp-wv-fab-bar button').evaluateAll((buttons) =>
    buttons.map((button) => ({
      width: button.getBoundingClientRect().width,
      height: button.getBoundingClientRect().height
    }))
  )
  assert.ok(detailActionSizes.every(({ width, height }) => width >= 44 && height >= 28 && height <= 32))
  assert.deepEqual(await page.locator('.mp-customer-detail-tabs button').allTextContents(), [
    '资料',
    '跟进记录',
    '联系人',
    '商机',
    '合同',
    '开票信息',
    '操作日志'
  ])
  const detailTag = page.locator('.mp-customer-webview-tag').first()
  await detailTag.waitFor()
  assert.notEqual(
    await detailTag.evaluate((tag) => getComputedStyle(tag).color),
    'rgb(255, 255, 255)'
  )
  await page.setViewportSize({ width: 414, height: 812 })
  await hideDevTools()
  await assertNoOverflow('414px 客户详情')
  await page.screenshot({ path: `${artifacts}/detail-414.png`, fullPage: true })
  await page.setViewportSize({ width: 375, height: 812 })

  await page.goto(`${origin}/#/m/crm/customer/${secondCustomer.id}?tab=invoice`)
  await page.getByText('暂无开票信息', { exact: true }).waitFor()
  assert.equal(
    calls.findLast((call) => call.path.endsWith('/customer/detail')).body.id,
    secondCustomer.id
  )
  assert.ok(
    await page
      .locator('.mp-customer-detail-tabs button')
      .filter({ hasText: '开票信息' })
      .evaluate((button) => button.classList.contains('active'))
  )
  delayedDetailId = customers[0].id
  const slowARequest = page.waitForRequest((request) => {
    if (!request.url().endsWith('/web/crm/customer/detail')) return false
    try {
      return request.postDataJSON()?.id === customers[0].id
    } catch {
      return false
    }
  })
  await page.evaluate((id) => {
    location.hash = `#/m/crm/customer/${id}?tab=follow`
  }, customers[0].id)
  await slowARequest
  await page.evaluate((id) => {
    location.hash = `#/m/crm/customer/${id}?tab=contact`
  }, secondCustomer.id)
  await page.getByRole('heading', { name: '张经理', exact: true }).waitFor()
  await page.waitForTimeout(650)
  assert.ok(
    await page
      .locator('.mp-customer-detail-tabs button')
      .filter({ hasText: '联系人' })
      .evaluate((button) => button.classList.contains('active'))
  )
  await click('资料')
  await page.getByRole('heading', { name: secondCustomer.customerName, exact: true }).waitFor()
  assert.equal(await page.getByRole('heading', { name: customers[0].customerName }).count(), 0)
  delayedDetailId = ''
  await page.evaluate((id) => {
    location.hash = `#/m/crm/customer/${id}?tab=follow`
  }, customers[0].id)
  await page.getByRole('button', { name: '＋ 添加跟进', exact: true }).waitFor()
  assert.ok(
    await page
      .locator('.mp-customer-detail-tabs button')
      .filter({ hasText: '跟进记录' })
      .evaluate((button) => button.classList.contains('active'))
  )
  await click('跟进记录')
  await click('＋ 添加跟进')
  await label('关联联系人').selectOption('contact-1')
  await label('跟进内容 *').fill('移动端跟进测试')
  await label('下次联系时间').fill('2026-10-18T10:00')
  await page
    .locator('.mp-sheet')
    .filter({ hasText: '添加跟进记录' })
    .locator('input[type=file]')
    .setInputFiles({
      name: '跟进附件.pdf',
      mimeType: 'application/pdf',
      buffer: Buffer.from('%PDF-1.4\nfollow-fixture')
    })
  await page.getByText('customer.pdf', { exact: true }).filter({ visible: true }).waitFor()
  await click('保存跟进')
  await page.getByText('移动端跟进测试', { exact: true }).waitFor()
  assert.equal(follows[0].customerId, '90071992547409931')
  assert.equal(follows[0].nextTime, '2026-10-18 10:00:00')
  assert.equal(follows[0].attachment, '/fixtures/customer.pdf')
  const followAttachment = page
    .locator('.mp-wv-card')
    .filter({ hasText: '移动端跟进测试' })
    .locator('.att-item')
    .first()
  const followAttachmentBox = await followAttachment.boundingBox()
  assert.equal(followAttachmentBox?.width, 72)
  assert.equal(followAttachmentBox?.height, 72)
  await followAttachment.locator('.att-preview').click()
  await page.getByRole('dialog').getByText('customer.pdf', { exact: true }).waitFor()
  await page.keyboard.press('Escape')
  await click('联系人')
  await page.getByRole('heading', { name: '张经理', exact: true }).waitFor()
  await click('＋ 新增联系人')
  await label('联系人姓名 *').fill('李经理')
  await label('手机号 *').fill('13900139000')
  await click('保存联系人')
  await page.getByRole('heading', { name: '李经理', exact: true }).waitFor()
  assert.equal(contacts[1].customerId, '90071992547409931')
  await click('开票信息')
  await click('＋ 新增开票信息')
  await label('单位名称（章） *').fill('测试开票单位')
  await label('税号').fill('123456789')
  await click('保存开票信息')
  await page.getByText('测试开票单位', { exact: true }).waitFor()
  await click('设为默认')
  await page.getByText('默认', { exact: true }).filter({ visible: true }).waitFor()
  assert.equal(invoices[0].isDefault, '1')
  await click('操作日志')
  await click('CRM客户管理')
  await page.getByText('<img src=x onerror=alert(1)>', { exact: true }).waitFor()
  assert.equal(await page.locator('img[src="x"]').count(), 0)
  await closeSheet()
  assert.equal(await page.locator('.mp-sheet-mask').filter({ visible: true }).count(), 0)
  await click('商机')
  await click('测试商机')
  await page.getByText('123', { exact: true }).waitFor()
  await click('修改商机')
  await label('商机名称 *').fill('移动修改商机')
  await click('保存商机操作')
  await page.getByText('移动修改商机', { exact: true }).filter({ visible: true }).first().waitFor()
  assert.equal(opportunity.customerId, '90071992547409931')
  await click('推进阶段')
  await label('商机阶段 *').selectOption('quote')
  await label('变更原因 *').fill('已报价')
  await click('保存商机操作')
  await page.getByRole('button', { name: '推进阶段', exact: true }).waitFor()
  assert.equal(opportunity.stagePercent, 60)
  await click('添加商机跟进')
  await label('商机跟进内容 *').fill('商机跟进测试')
  await click('保存商机操作')
  await page.getByText('商机跟进测试', { exact: true }).waitFor()
  await click('编辑商机跟进')
  await label('商机跟进内容 *').fill('商机跟进已编辑')
  await click('保存商机操作')
  await page.getByText('商机跟进已编辑', { exact: true }).waitFor()
  await click('删除商机跟进')
  await page.getByRole('button', { name: /^(确定|确认)$/ }).click()
  await page.getByText('暂无跟进记录', { exact: true }).waitFor()
  await closeSheet()
  await click('合同')
  await page.getByText('测试合同', { exact: true }).waitFor()
  await click('资料')
  await page.screenshot({ path: `${artifacts}/detail-375.png`, fullPage: true })
  await click('编辑')
  await waitHeading('编辑客户')
  await label('客户简称 *').fill('移动编辑')
  const certificateInput = page.locator('input[type=file]').first()
  let releaseUploadGate
  uploadGate = new Promise((resolve) => {
    releaseUploadGate = resolve
  })
  const uploadStarted = new Promise((resolve) => {
    signalUploadStarted = resolve
  })
  const uploadCallsBeforeConcurrent = calls.filter(
    (call) => call.path === '/web/admin/attachment/upload'
  ).length
  await certificateInput.setInputFiles({
    name: '并发首个.pdf',
    mimeType: 'application/pdf',
    buffer: Buffer.from('%PDF-1.4\nconcurrent-first')
  })
  await uploadStarted
  await certificateInput.evaluate((input) => {
    const transfer = new DataTransfer()
    transfer.items.add(new File(['second'], '并发第二个.pdf', { type: 'application/pdf' }))
    Object.defineProperty(input, 'files', { value: transfer.files, configurable: true })
    input.dispatchEvent(new Event('change', { bubbles: true }))
  })
  await page.waitForTimeout(100)
  assert.equal(
    calls.filter((call) => call.path === '/web/admin/attachment/upload').length,
    uploadCallsBeforeConcurrent + 1,
    '上传期间再次选择不得启动第二个上传请求'
  )
  releaseUploadGate()
  uploadGate = null
  await page.getByText('customer.pdf', { exact: true }).waitFor()
  await page.waitForFunction(() => {
    const input = document.querySelector('input[type=file]')
    return !!input && !input.disabled
  })
  uploadQueue = [
    {
      data: {
        id: 'partial-ok',
        fileName: '部分成功.pdf',
        fileUrl: '/fixtures/partial-ok.pdf',
        fileType: 'application/pdf'
      }
    }
  ]
  const uploadCallsBeforePartialFailure = calls.filter(
    (call) => call.path === '/web/admin/attachment/upload'
  ).length
  await certificateInput.setInputFiles({
    name: '部分成功.pdf',
    mimeType: 'application/pdf',
    buffer: Buffer.from('%PDF-1.4\npartial-ok')
  })
  await page.getByText('partial-ok.pdf', { exact: true }).waitFor()
  await page.waitForFunction(() => {
    const input = document.querySelector('input[type=file]')
    return !!input && !input.disabled
  })
  uploadQueue = [{ fail: '后续上传失败' }]
  await certificateInput.setInputFiles({
    name: '后续失败.pdf',
    mimeType: 'application/pdf',
    buffer: Buffer.from('%PDF-1.4\npartial-fail')
  })
  for (
    let attempt = 0;
    attempt < 100 &&
    calls.filter((call) => call.path === '/web/admin/attachment/upload').length <
      uploadCallsBeforePartialFailure + 2;
    attempt += 1
  )
    await page.waitForTimeout(20)
  await page.getByText('后续上传失败', { exact: true }).last().waitFor()
  assert.equal(uploadQueue.length, 0, '后续失败请求应被处理')
  assert.equal(
    calls.filter((call) => call.path === '/web/admin/attachment/upload').length,
    uploadCallsBeforePartialFailure + 2
  )
  assert.ok(await page.getByText('customer.pdf', { exact: true }).isVisible())
  await assertMinTouchTargets(
    page.locator(
      '.mp-customer-attachments .att-preview, .mp-customer-attachments .att-remove, .mp-customer-attachments .att-add'
    ),
    '附件预览、删除与添加'
  )
  await waitForMessagesToClear()
  await page.setViewportSize({ width: 414, height: 812 })
  await hideDevTools()
  await assertNoOverflow('414px 附件表单')
  await page.screenshot({ path: `${artifacts}/form-attachments-414.png`, fullPage: true })
  await page.setViewportSize({ width: 375, height: 812 })
  await click('保存客户')
  await waitHeading('客户详情')
  assert.equal(customers[0].shortName, '移动编辑')
  assert.match(customers[0].businessLicenseImages, /\/fixtures\/customer\.pdf/)
  assert.match(customers[0].businessLicenseImages, /\/fixtures\/partial-ok\.pdf/)
  await page.getByRole('button', { name: '返回客户列表' }).click()
  await click('快捷操作')
  await click('新增客户')
  await waitHeading('新增客户')
  for (const [name, value] of [
    ['客户名称 *', '新客户'],
    ['客户简称 *', '新'],
    ['省份 *', '湖北'],
    ['城市 *', '宜昌'],
    ['区县 *', '西陵'],
    ['所在园区 *', '园区A']
  ])
    await label(name).fill(value)
  await label('客户类型 *').selectOption('company')
  await label('客户来源 *').selectOption('phone')
  await label('单位名称（章）').fill('新增开票单位')
  failInvoice = true
  await click('保存客户')
  await page.getByText('客户已创建。请补存开票资料，无需再次新增客户。').waitFor()
  await click('补存开票资料')
  await waitHeading('客户详情')
  assert.equal(calls.filter((c) => c.path === '/web/crm/customer/add').length, 1)
  await page.getByRole('button', { name: '返回客户列表' }).click()
  await page.getByRole('button', { name: '查看客户：新客户', exact: true }).waitFor()
  await click('快捷操作')
  await click('批量选择')
  await page
    .locator('.mp-crm-expense-card')
    .filter({ hasText: '新客户' })
    .locator('.expense-card__select')
    .click()
  await click('放入公海')
  await label('放入原因 *').fill('测试批量放入')
  await click('确认放入')
  await page.getByRole('button', { name: /^(确定|确认)$/ }).click()
  await page.getByRole('button', { name: '查看客户：新客户', exact: true }).waitFor({
    state: 'hidden'
  })
  assert.deepEqual(calls.findLast((c) => c.path.endsWith('/customer/intoPool')).body.ids, [
    'created-customer'
  ])
  await click('快捷操作')
  await click('批量选择')
  await page.locator('.expense-card__select').first().click()
  await click('删除')
  await page.getByRole('button', { name: /^(确定|确认)$/ }).click()
  await page.getByText('暂无客户，可调整筛选后重试').waitFor()
  assert.deepEqual(calls.findLast((c) => c.path.endsWith('/customer/delete')).body.ids, [
    '90071992547409931'
  ])
  failList = true
  await page.getByLabel('搜索客户').fill('失败')
  await page.getByLabel('搜索客户').press('Enter')
  await page.getByText('列表测试失败', { exact: true }).first().waitFor()
  await click('重试')
  await page.getByText('暂无客户，可调整筛选后重试').waitFor()
  await waitForMessagesToClear()
  for (const width of [375, 414]) {
    await page.setViewportSize({ width, height: 812 })
    await assertNoOverflow(`${width}px 空列表`)
    assert.equal(await page.locator('.mp-sheet-mask').filter({ visible: true }).count(), 0)
    assert.equal(await page.locator('.mp-wv-speed-mask.open').count(), 0)
    if (width === 414)
      await page.screenshot({ path: `${artifacts}/list-empty-414.png`, fullPage: true })
  }
  assert.deepEqual(pageErrors, [])
  console.log(
    JSON.stringify({
      result: 'PASS',
      assertions:
        '四视图、快捷/高级筛选与显示字段、搜索清空、分页失败回滚与乱序隔离、卡片动作、直达详情刷新、创建人权限、客户跟进/联系人/商机/合同/开票/日志、72px附件上传预览、客户编辑与新增失败重试、批量公海/删除、44px触达、375/414无溢出遮罩',
      apiCalls: calls.length,
      screenshots: artifacts
    })
  )
} catch (error) {
  await page.screenshot({ path: `${artifacts}/failure.png`, fullPage: true })
  console.error(await page.locator('body').innerText())
  console.error('Page errors:', pageErrors)
  console.error(
    'API calls:',
    calls.map((c) => c.path)
  )
  throw error
} finally {
  await context.close()
  await browser.close()
}