82 行
3.7 KiB
Python
82 行
3.7 KiB
Python
"""
|
||
测试首页高端主视觉系统 (Test Premium Home Hero Visual)
|
||
验证宽幅首屏摄影的高清画质、桌面与移动端响应式图片源、
|
||
两端模板一致引用、优先加载与有效替代文本、
|
||
渐变处理、响应式断点与减少动态效果适配。
|
||
"""
|
||
|
||
import os
|
||
import unittest
|
||
|
||
from PIL import Image
|
||
|
||
ROOT_DIR = os.path.abspath(os.path.join(os.path.dirname(__file__), ".."))
|
||
HERO_IMAGE_DIR = os.path.join(
|
||
ROOT_DIR, "public", "assets", "addons", "official", "images", "home"
|
||
)
|
||
CSS_PATH = os.path.join(
|
||
ROOT_DIR, "public", "assets", "addons", "official", "css", "home-v3.css"
|
||
)
|
||
PC_HOME_PATH = os.path.join(
|
||
ROOT_DIR, "addons", "official", "view", "web", "official_home", "index.html"
|
||
)
|
||
M_HOME_PATH = os.path.join(
|
||
ROOT_DIR, "addons", "official", "view", "web", "official_home", "index_e.html"
|
||
)
|
||
|
||
|
||
class PremiumHeroBannerTest(unittest.TestCase):
|
||
"""验证首页宽幅主视觉"""
|
||
|
||
def test_01_hero_image_high_quality(self):
|
||
"""1. 验证桌面与移动端首屏摄影物理存在、分辨率高、画质饱满"""
|
||
hero_images = {
|
||
"ai-computing-v4.jpg": (1983, 793),
|
||
"ai-computing-mobile-v4.jpg": (1024, 1536),
|
||
}
|
||
for filename, (minimum_width, minimum_height) in hero_images.items():
|
||
with self.subTest(hero=filename):
|
||
hero_path = os.path.join(HERO_IMAGE_DIR, filename)
|
||
self.assertTrue(os.path.exists(hero_path), f"首屏宽幅摄影不存在: {filename}")
|
||
self.assertGreater(os.path.getsize(hero_path), 100 * 1024, f"首屏摄影文件过小: {filename}")
|
||
|
||
with Image.open(hero_path) as hero:
|
||
width, height = hero.size
|
||
self.assertGreaterEqual(width, minimum_width, f"首屏摄影宽度不足要求: {filename}")
|
||
self.assertGreaterEqual(height, minimum_height, f"首屏摄影高度不足要求: {filename}")
|
||
|
||
def test_02_css_uses_responsive_hero_and_accessible_motion(self):
|
||
"""2. 验证专属 CSS 提供首屏布局、响应式断点与减少动态效果适配"""
|
||
with open(CSS_PATH, encoding="utf-8") as stream:
|
||
css_content = stream.read()
|
||
|
||
self.assertIn(".hn-hero-picture", css_content, "CSS 未正确定义首屏图片容器")
|
||
self.assertIn("object-fit", css_content, "CSS 应规范首屏图片的适应展示模式")
|
||
self.assertIn("linear-gradient", css_content, "CSS 应使用渐变为文字保留可读区域")
|
||
self.assertIn("@media(max-width:768px)", css_content, "CSS 缺少移动端首屏适配断点")
|
||
self.assertIn("prefers-reduced-motion", css_content, "CSS 应支持减少动态效果")
|
||
|
||
def test_03_pc_and_mobile_template_integrity(self):
|
||
"""3. 验证 PC 与移动端模板引用桌面与移动端两套响应式首屏图片"""
|
||
for page_path in [PC_HOME_PATH, M_HOME_PATH]:
|
||
with open(page_path, encoding="utf-8") as stream:
|
||
html = stream.read()
|
||
self.assertEqual(html.count("hn-hero-picture"), 1, f"首屏图片容器数量应为 1：{page_path}")
|
||
for filename in (
|
||
"ai-computing-v4.webp",
|
||
"ai-computing-v4.jpg",
|
||
"ai-computing-mobile-v4.webp",
|
||
"ai-computing-mobile-v4.jpg",
|
||
):
|
||
self.assertIn(filename, html, f"页面缺少首屏图片资源 {filename}：{page_path}")
|
||
self.assertIn('fetchpriority="high"', html, f"首屏图片应优先加载：{page_path}")
|
||
self.assertRegex(
|
||
html,
|
||
r'<img[^>]+alt="[^"]{4,}"',
|
||
f"首屏图片应包含有效替代文本：{page_path}",
|
||
)
|
||
|
||
|
||
if __name__ == "__main__":
|
||
unittest.main()
|