<?xml version="1.0" encoding="UTF-8"?><rss version="2.0" xmlns:content="http://purl.org/rss/1.0/modules/content/"><channel><title>自动化测试 | 锤子前端</title><description>Now vibe coding, so learning hammer FE ?</description><link>https://channel.meo-ai.com</link><item><title>《如何更有野心：给有模型可用的人的教程》</title><link>https://channel.meo-ai.com/posts/725</link><guid isPermaLink="true">https://channel.meo-ai.com/posts/725</guid><pubDate>Mon, 26 Oct 2026 23:26:47 GMT</pubDate><content:encoded>&lt;span class=&quot;post-title-source&quot;&gt;《如何更有野心：给有模型可用的人的教程》&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;标签：&lt;br /&gt;&lt;a href=&quot;/search/result?q=%23%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD&quot; title=&quot;#人工智能&quot;&gt;#人工智能&lt;/a&gt; &lt;a href=&quot;/search/result?q=%23%E4%B8%AA%E4%BA%BA%E6%95%88%E7%8E%87%E6%8F%90%E5%8D%87&quot; title=&quot;#个人效率提升&quot;&gt;#个人效率提升&lt;/a&gt; &lt;a href=&quot;/search/result?q=%23%E4%BA%BA%E6%9C%BA%E5%8D%8F%E4%BD%9C&quot; title=&quot;#人机协作&quot;&gt;#人机协作&lt;/a&gt; &lt;a href=&quot;/search/result?q=%23%E6%A8%A1%E5%9E%8B%E8%83%BD%E5%8A%9B%E8%BE%B9%E7%95%8C&quot; title=&quot;#模型能力边界&quot;&gt;#模型能力边界&lt;/a&gt; &lt;a href=&quot;/search/result?q=%23%E8%87%AA%E6%88%91%E6%95%88%E8%83%BD%E6%84%9F&quot; title=&quot;#自我效能感&quot;&gt;#自我效能感&lt;/a&gt; &lt;a href=&quot;/search/result?q=%23Altitude_Depth_Range&quot; title=&quot;#Altitude_Depth_Range&quot;&gt;#Altitude_Depth_Range&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;总结：&lt;br /&gt;作者 Felix Rieseberg（Claude 团队成员）指出，AI 模型能力在各方向增长并不均衡，许多用户还停留在&quot;问首都、改邮件&quot;的浅层用法。他把&quot;更有野心&quot;拆解为 Speed（速度）、Altitude（高度）、Depth（深度）、Range（广度）四种类型，并给出了每种类型的具体操作方法——从&quot;让模型对结果负责&quot;而非&quot;执行单个任务&quot;，到&quot;用行业顶尖专家的工具和方法&quot;，再到&quot;用跨领域团队思维重写任务&quot;，最后还从心理学角度（自我效能感）解释了为什么这种&quot;野心&quot;需要刻意练习。&lt;br /&gt;&lt;br /&gt;文章要点：&lt;br /&gt;1. 野心分四种：速度（省时间，已基本普及，无需多讲）、高度（关注目标之上的目标）、深度（像顶尖专家那样做任务）、广度（引入多个领域的视角与方法）。&lt;br /&gt;2. 高度（Altitude）的关键问题是&quot;下一步你想要什么结果&quot;：别只让模型填季度报告模板，而是让它分析全部数据找出变化与原因、推演最紧迫的三个决策、甚至设计一套比季度汇报更好的业务监控机制。&lt;br /&gt;3. 深度（Depth）的核心是坚持让模型使用行业顶级专家的工具，而非表面模仿专业术语：用数据库和统计模型替代 Markdown 表格，设定看似不合理的高目标，让模型用原始数据对抗性检验既有假设，甚至构建仿真模型产出&quot;新知识&quot;。&lt;br /&gt;4. 不要自我评判，要用外部裁判：作者在 2026 年 10 月仍坚持模型不能可靠地自我评估，最好用可运行的工具或测试来验证结果。&lt;br /&gt;5. 广度（Range）的技巧之一是把名词换成动词：季度报告不是&quot;一份 PPT&quot;，而是&quot;让忙碌的人在 30 分钟内相信因果故事并做出不确定决策&quot;，然后再像组建抢劫团队一样，为任务引入分析师、记者、编辑、做空者、法务会计等不同角色真正在&quot;做的事&quot;。&lt;br /&gt;6. 这一切的前提是模型要有电脑可用——能装软件、能访问数据（如 MCP 连接器），而不是只在一个聊天框里空转。&lt;br /&gt;7. 从心理学看，这本质是&quot;自我效能感&quot;问题：人类只敢在自己熟悉的窄领域相信自己能成功；好在这可被&quot;破解&quot;——设定具体的高难度目标（Locke 和 Latham 35 年研究）、看到别人做到后跟上（四分钟一英里、破二马拉松），以及允许自己失败（Linux 当年也只是&quot;爱好&quot;）。&lt;br /&gt;&lt;br /&gt;URL：&lt;a href=&quot;https://felixrieseberg.com/how-to-be-more-ambitious-a-tutorial-for-humans-with-models/&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; title=&quot;https://felixrieseberg.com/how-to-be-more-ambitious-a-tutorial-for-humans-with-models/&quot;&gt;https://felixrieseberg.com/how-to-be-more-ambitious-a-tutorial-for-humans-with-models/&lt;/a&gt;&lt;a class=&quot;tgme_widget_message_link_preview&quot; href=&quot;https://felixrieseberg.com/how-to-be-more-ambitious-a-tutorial-for-humans-with-models&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; title=&quot;“We’re not ambitious enough” is easy to post and hard to follow. Here’s a practical tutorial, with prompts.&quot;&gt;
  
  &lt;div class=&quot;link_preview_site_name accent_color&quot;&gt;Felix Rieseberg&lt;/div&gt;
  &lt;img class=&quot;link_preview_image&quot; alt=&quot;How to be more ambitious: A tutorial for humans with models&quot; src=&quot;/static/https://cdn4.telesco.pe/file/uVusNcFOdFWaTdLta5O6Z-Jfo91-DcsGluLaT6m1YdCAEFA6mbDZekwK-2e-N1gRKnmg35mIiAG1XgSpIh4uRxeG3E2-evFu259v8OYmIe6VrrAYQJ4YRXoAicPcjnfswAJVwTIsXIKsbOTOCqkpI8gLK_VRlAk64A_095onirQbcYgk_yLPrMlvApG9lly_KaKb_W0UoOFKEONnwKTxqoW4fb3e_Sk1w-LBeFpchayZqK1GVQXDKrJg8BGIpGKl3GD1aWK8SD2TKlKbTDEPAqTy16qks0szmR60JJ0prF2sMeqqpzBHhxR3xz--ZxvNDq285UdIfcsOgv_ViKbNgw.jpg&quot; width=&quot;1200&quot; height=&quot;630&quot; loading=&quot;eager&quot; /&gt;
  &lt;div class=&quot;link_preview_title&quot;&gt;How to be more ambitious: A tutorial for humans with models&lt;/div&gt;
  &lt;div class=&quot;link_preview_description&quot;&gt;“We’re not ambitious enough” is easy to post and hard to follow. Here’s a practical tutorial, with prompts.&lt;/div&gt;
&lt;/a&gt;</content:encoded></item><item><title>《视觉回归测试：你可能还没跑起来的最重要测试》</title><link>https://channel.meo-ai.com/posts/702</link><guid isPermaLink="true">https://channel.meo-ai.com/posts/702</guid><pubDate>Mon, 31 Aug 2026 01:33:14 GMT</pubDate><content:encoded>&lt;span class=&quot;post-title-source&quot;&gt;《视觉回归测试：你可能还没跑起来的最重要测试》&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;标签：&lt;br /&gt;&lt;a href=&quot;/search/result?q=%23%E5%89%8D%E7%AB%AF%E6%B5%8B%E8%AF%95&quot; title=&quot;#前端测试&quot;&gt;#前端测试&lt;/a&gt; &lt;a href=&quot;/search/result?q=%23%E8%A7%86%E8%A7%89%E5%9B%9E%E5%BD%92%E6%B5%8B%E8%AF%95&quot; title=&quot;#视觉回归测试&quot;&gt;#视觉回归测试&lt;/a&gt; &lt;a href=&quot;/search/result?q=%23%E8%87%AA%E5%8A%A8%E5%8C%96%E6%B5%8B%E8%AF%95&quot; title=&quot;#自动化测试&quot;&gt;#自动化测试&lt;/a&gt; &lt;a href=&quot;/search/result?q=%23%E8%B4%A8%E9%87%8F%E4%BF%9D%E8%AF%81&quot; title=&quot;#质量保证&quot;&gt;#质量保证&lt;/a&gt; &lt;a href=&quot;/search/result?q=%23Web%E5%BC%80%E5%8F%91&quot; title=&quot;#Web开发&quot;&gt;#Web开发&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;总结：&lt;br /&gt;&lt;br /&gt;文章系统介绍了视觉回归测试（Visual Regression Testing）的概念、重要性、工作原理、主流工具及实践建议。核心观点是：即使功能测试覆盖率100%，应用仍可能在视觉上&quot;看起来完全损坏&quot;。视觉回归测试通过截图对比基线，捕捉传统测试无法发现的视觉缺陷，在AI生成代码时代尤为重要。&lt;br /&gt;&lt;br /&gt;文章要点：&lt;br /&gt;&lt;br /&gt;1. 为什么视觉测试不可或缺：单元测试、集成测试和E2E测试只验证功能逻辑，不检查实际视觉呈现。CSS类名测试是代码异味，因为即使类名正确，实际渲染仍可能因样式冲突、加载失败等出问题。&lt;br /&gt;&lt;br /&gt;2. 工作原理超直观：在真实浏览器中渲染页面/组件并截图，与基线快照对比。匹配则通过，不匹配则在CI/CD中标记失败，需人工审核确认是否为预期变更。&lt;br /&gt;&lt;br /&gt;3. 能抓住哪些&quot;隐形&quot;Bug：组件一处修改意外影响其他使用位置、CSS变更导致的布局错位、响应式问题、跨浏览器渲染差异、字体/图片加载失败等。作者曾靠它避免了一个SVG图标在20处地方颜色错误的生产事故。&lt;br /&gt;&lt;br /&gt;4. 三大主流工具怎么选：Percy（适合全页截图，与Playwright/Cypress/Puppeteer兼容，UI体验好但用量大时贵）；Chromatic（Storybook生态，组件级截图，免费 tier 友好）；Vitest Browser Mode（内置截图测试，但缺少审核UI，适合组件级）。&lt;br /&gt;&lt;br /&gt;5. 接入CI/CD很轻松：通常在现有E2E测试中插入一行代码即可，如Playwright中调用&lt;code&gt;percySnapshot()&lt;/code&gt;或Chromatic的&lt;code&gt;takeSnapshot()&lt;/code&gt;，无需重构测试架构。&lt;br /&gt;&lt;br /&gt;6. 避免&quot; flaky 测试&quot;的实用技巧：确保页面完全加载后再截图；用CSS隐藏动画区域；对动态数据（如日期、&quot;5天前&quot;）设置忽略区域；避免对内容过多的整页盲目截图，要有选择性地测试。&lt;br /&gt;&lt;br /&gt;7. AI时代的刚需：随着AI生成代码的普及，视觉回归测试将变得更加关键，能帮助团队快速发现AI改动带来的意外视觉副作用。&lt;br /&gt;&lt;br /&gt;URL：&lt;br /&gt;&lt;a href=&quot;https://howtotestfrontend.com/resources/visual-regression-testing-introduction-guide&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; title=&quot;https://howtotestfrontend.com/resources/visual-regression-testing-introduction-guide&quot;&gt;https://howtotestfrontend.com/resources/visual-regression-testing-introduction-guide&lt;/a&gt;&lt;a class=&quot;tgme_widget_message_link_preview&quot; href=&quot;https://howtotestfrontend.com/resources/visual-regression-testing-introduction-guide&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; title=&quot;Your tests can pass while your app looks broken. Visual regression testing catches the UI bugs that unit, integration and E2E tests miss - and here is how to set it up with Percy, Chromatic or Vitest Browser Mode&quot;&gt;
  
  &lt;div class=&quot;link_preview_site_name accent_color&quot;&gt;How To Test Frontend&lt;/div&gt;
  &lt;img class=&quot;link_preview_image&quot; alt=&quot;Visual Regression Testing: The Most Important Test You&apos;re Not Running&quot; src=&quot;/static/https://cdn4.telesco.pe/file/CGxxW8nFXdB1gDL_CmmjoycXKoB0saZWUUhDJkscoSgYoiSkQwGh5RLAsUsSHyUowqYgZU8yVxp1QoCCLPoHo83cfiGoPoZpF_vbxN3zTDgy8euVFCg-s4mBuWJy3HcLjxeWXsDpvCX26HZ3a--_JOe5_bEecG1TUOYgseIPLQBLI5UzsKFer4Cb9iAMmLvfirC3bIcvYOJ91sVYWVVj1LJ1QdENqkQNVsQR10Aq-g8cfhKasffOcUzWNw0YcqSZpGJpQC58xesUdhvHtK2cXQChLKCqtbQVDD9ar6aOjVCkfkZoJb_W86D4ZBj4eXcrEVXuJgvp5YtnAcvaC6sjow.jpg&quot; width=&quot;1200&quot; height=&quot;630&quot; loading=&quot;eager&quot; /&gt;
  &lt;div class=&quot;link_preview_title&quot;&gt;Visual Regression Testing: The Most Important Test You&apos;re Not Running&lt;/div&gt;
  &lt;div class=&quot;link_preview_description&quot;&gt;Your tests can pass while your app looks broken. Visual regression testing catches the UI bugs that unit, integration and E2E tests miss - and here is how to set it up with Percy, Chromatic or Vitest Browser Mode&lt;/div&gt;
&lt;/a&gt;</content:encoded></item></channel></rss>