import assert from 'node:assert/strict'
import { readFileSync } from 'node:fs'
import test from 'node:test'
import { fileURLToPath } from 'node:url'

const appShellView = readFileSync(
  fileURLToPath(new URL('../src/views/AppShellRouteView.vue', import.meta.url)),
  'utf8'
)
const appCss = readFileSync(
  fileURLToPath(new URL('../src/assets/styles/app.css', import.meta.url)),
  'utf8'
)
const assistantResponsiveCss = readFileSync(
  fileURLToPath(new URL('../src/assets/styles/views/travel-reimbursement-create-view-part4.css', import.meta.url)),
  'utf8'
)

test('手机浏览器存在应用导航入口', () => {
  assert.match(appShellView, /class="mobile-hamburger-btn"/)
  assert.match(appShellView, /aria-label="打开移动端导航"/)
  assert.match(appShellView, /:aria-expanded="mobileSidebarOpen \? 'true' : 'false'"/)
  assert.match(appShellView, /@click="mobileSidebarOpen = true"/)

  assert.match(appCss, /\.mobile-hamburger-btn\s*{\s*display:\s*none;/s)
  assert.match(appCss, /@media \(max-width:\s*760px\)[\s\S]*\.mobile-hamburger-btn\s*{[\s\S]*display:\s*flex;/)
})

test('报销智能体在手机浏览器下使用全屏工作台和稳定输入区', () => {
  const mobileBlockStart = assistantResponsiveCss.indexOf('@media (max-width: 760px)')
  assert.notEqual(mobileBlockStart, -1)
  const mobileBlock = assistantResponsiveCss.slice(mobileBlockStart)

  assert.match(mobileBlock, /:global\(\.assistant-el-overlay \.el-overlay-dialog\)[\s\S]*padding:\s*0;/)
  assert.match(mobileBlock, /\.assistant-modal-stage\s*{[\s\S]*height:\s*100dvh;[\s\S]*border:\s*0;/)
  assert.match(mobileBlock, /\.assistant-layout\s*{[\s\S]*grid-template-columns:\s*minmax\(0,\s*1fr\);/)
  assert.match(mobileBlock, /\.dialog-panel\s*{[\s\S]*border:\s*0;[\s\S]*border-radius:\s*0;/)
  assert.match(mobileBlock, /\.insight-panel-shell\s*{[\s\S]*position:\s*absolute;[\s\S]*transform:\s*translateX\(100%\);/)
  assert.match(mobileBlock, /\.assistant-layout\.has-insight \.insight-panel-shell\s*{[\s\S]*transform:\s*translateX\(0\);/)
  assert.match(mobileBlock, /\.composer-row\s*{[\s\S]*display:\s*grid;[\s\S]*grid-template-columns:\s*minmax\(0,\s*1fr\) var\(--composer-control-size,\s*40px\);/)
  assert.match(mobileBlock, /\.composer-leading-actions\s*{[\s\S]*grid-column:\s*1 \/ -1;[\s\S]*grid-template-columns:\s*repeat\(3,\s*minmax\(0,\s*1fr\)\);/)
})