- tailwind.config.js darkMode 从 'class' 改为 ['variant', '[data-theme="dark"] &'] - 'class' 模式匹配 .dark class,但站点用 html[data-theme='dark'] 属性,导致 dark: 变体全局失效 - variant 模式让 dark:bg-foo 类生成 [data-theme="dark"] .dark\:bg-foo 选择器 - 验证:临时加 dark:bg-blue-500 → CSS 含正确选择器;运行时浅色 bg=white、深色 bg=rgb(59,130,246) 回归测试脚本: - darkmode-selector-verify.mjs:合成探针验证 utility 生效 - home-cta-verify.mjs:定位 home 本地简化 CTASection 实际渲染(之前误判为'不渲染') 诚实标注: - 全站 grep dark: utility class 仅发现 cta-button.tsx 2 处,但均为 TS 对象 key(非 utility),故 dark: 失效问题无直接破坏 - 修复属'基础设施补全':未来添加 dark: 工具类即按 data-theme='dark' 自动生效 home-content-v15.tsx 的 CTASection(line 978-998)是**文件本地简化版** (仅标题 + CTAButton,无 BrandStamp),与 src/components/sections/cta-section.tsx (含 BrandStamp「值得信赖」)是不同组件。前者实际渲染,后者无路由使用(待用资产)。 本修复不涉及 CTASection 渲染路径。 验证: - type-check 0 error - lint 0 error - 编译产物含 [data-theme="dark"] .dark\:bg-blue-500 选择器 - 运行时合成探针 PASS(浅色 white / 深色 blue)
25 lines
1.2 KiB
JavaScript
25 lines
1.2 KiB
JavaScript
// 验证 home 本地 CTASection 实际渲染(含 BrandStamp 的是 src/components/sections/cta-section.tsx)
|
||
import { chromium } from 'playwright';
|
||
const browser = await chromium.launch();
|
||
const page = await browser.newPage({ viewport: { width: 1280, height: 800 } });
|
||
await page.goto('http://127.0.0.1:3000/', { waitUntil: 'networkidle' });
|
||
await page.waitForTimeout(2000);
|
||
await page.evaluate(() => window.scrollTo(0, document.body.scrollHeight));
|
||
await page.waitForTimeout(2000);
|
||
|
||
const dump = await page.evaluate(() => {
|
||
// home 本地简化版的特征 className
|
||
const homeCta = document.querySelector('section.relative.py-24.sm\\:py-32');
|
||
// 公开 cta-section 的特征 id
|
||
const srcCta = document.querySelector('section#cta');
|
||
// BrandStamp 容器特征(inline-block px-3 py-1.5 border-2 border-[var(--color-brand)] rounded-sm)
|
||
const stamp = document.querySelector('.inline-block.px-3.py-1\\.5.border-2');
|
||
return {
|
||
homeCtaPresent: !!homeCta,
|
||
homeCtaText: homeCta ? (homeCta.textContent || '').slice(0, 60) : null,
|
||
srcCtaPresent: !!srcCta,
|
||
brandStampPresent: !!stamp,
|
||
};
|
||
});
|
||
await browser.close();
|
||
console.log(JSON.stringify(dump, null, 2)); |