[verified] fix calendar subscription layout

frontend/e2e/mobile-ui.spec.ts

@@ -201,21 +201,39 @@ test('all bottom destinations expose one active page and desktop layout stays un
 })
 
 test('calendar week focus keeps seven usable day controls without page overflow', async ({ page }) => {
-  await page.route('**/api/v1/calendar-subscriptions', route => route.fulfill({ json: [{ id:'calendar-source', name:'工作', url:'https://example.com/work.ics', color:'#f15a29', enabled:true, refreshed_at:null, last_error:null, stale:false }] }))
+  const calendarSources = ['天气','法定节假日','老黄历','节日节气','星座','影视上新','股市指数','街舞赛事','F1'].map((name, index) => ({ id:`calendar-source-${index}`, name, url:`https://example.com/${index}.ics`, color:'#f15a29', enabled:true, refreshed_at:null, last_error:null, stale:false }))
+  await page.route('**/api/v1/calendar-subscriptions', route => route.fulfill({ json: calendarSources }))
   await page.route('**/api/v1/calendar-events?*', route => route.fulfill({ json: { events: [], sources: [] } }))
   await page.goto('/')
   const mobile = (await page.viewportSize())!.width <= 930
   if (mobile) await bottomTab(page, '日历订阅').click()
   else await page.locator('.primary-nav').getByRole('button', { name: '日历订阅', exact: true }).click()
   const strip = page.getByRole('group', { name: '选择日期' })
+  const filters = page.locator('.calendar-filters')
   await expect(strip).toBeVisible()
+  await expect(filters).toBeVisible()
   await expect(strip.locator('.calendar-week-day')).toHaveCount(7)
-  const metrics = await strip.evaluate(element => ({
-    documentOverflow: document.documentElement.scrollWidth - document.documentElement.clientWidth,
-    stripOverflow: element.scrollWidth > element.clientWidth,
-    buttons: [...element.querySelectorAll<HTMLElement>('.calendar-week-day')].map(button => ({ width: button.getBoundingClientRect().width, height: button.getBoundingClientRect().height })),
-  }))
+  const metrics = await strip.evaluate(element => {
+    const filters = document.querySelector<HTMLElement>('.calendar-filters')!
+    const calendar = document.querySelector<HTMLElement>('.calendar-view')!
+    const main = calendar.closest('main') as HTMLElement
+    return {
+      documentOverflow: document.documentElement.scrollWidth - document.documentElement.clientWidth,
+      bodyOverflow: document.body.scrollWidth - document.body.clientWidth,
+      mainOverflow: main.scrollWidth - main.clientWidth,
+      calendarOverflow: calendar.scrollWidth - calendar.clientWidth,
+      filters: { clientWidth: filters.clientWidth, scrollWidth: filters.scrollWidth, overflowX: getComputedStyle(filters).overflowX },
+      stripOverflow: element.scrollWidth > element.clientWidth,
+      buttons: [...element.querySelectorAll<HTMLElement>('.calendar-week-day')].map(button => ({ width: button.getBoundingClientRect().width, height: button.getBoundingClientRect().height })),
+    }
+  })
   expect(metrics.documentOverflow).toBe(0)
+  expect(metrics.bodyOverflow).toBe(0)
+  expect(metrics.mainOverflow).toBe(0)
+  expect(metrics.calendarOverflow).toBe(0)
+  if ((await page.viewportSize())!.width <= 930) expect(metrics.filters.clientWidth).toBeLessThan(metrics.filters.scrollWidth)
+  else expect(metrics.filters.clientWidth).toBeGreaterThanOrEqual(metrics.filters.scrollWidth)
+  expect(metrics.filters.overflowX).toBe('auto')
   expect(metrics.buttons.every(button => button.width >= 44 && button.height >= 44)).toBeTruthy()
   const selectedColors = await strip.locator('.calendar-week-day.is-selected').evaluate(element => {
     const style = getComputedStyle(element)