工欲善其事，必先利其器。最近在写代码的时候越发觉得不是代码有多难，而是当代码出了问题该如何调试，如何追溯本源，这才是最难的。 响应这个要求，我决定写一个关于调试实战系列。本来不打算写这个基础篇章，为了整个的完整性。（不喜勿喷） 所以示例在以下环境通过。 使用 console.l…

通过前一篇的介绍，我们已经懂得基本的 debug 技巧，那么我们如何快速调试一些线上的问题呢。本文将线上的调试分为以下三种：（当然有更好的调试方式，可以在评论区提出） 线上即时修改；针对一些样式以及一些 js 已经知道问题所在快速地修改以达到解决 bug 的模式。 线上不存在 …

认真看完，一定有你不知道的调试技巧，一定有你想要的装 x 操作。 1. 在“Elements”面板拖放元素 在“Elements”面板中，您可以拖放任何 HTML 元素并更改其在页面中的位置。 2. 在“Console”中显示当前选定的元素 在“Elements”面板中选择一个…

web开发中，写“bug”和改“bug”同样重要；记录一次web devtool 调试文档阅读摘录。

🎉 大家好，我是前端队长Daotin，想要获取最新前端相关的精彩内容，可以在关注我，解锁更多前端成长新姿势。 以下正文： 已经是晚上11点整了，小D看了下闹钟然后摘下眼镜，捏了捏疲惫的双眼，办公桌上不

大多数开发者基本都使用浏览器的开发者工具调试前端，但即使用了好几年 Chrome 的开发者工具，我仍然会遇到从未见过的技巧和功能。 在本文中，我写了许多在开发者工具中与 CSS 相关的功能和技巧，我认为它们将把你的 CSS 开发水平提升至一个新的台阶。其中一些技巧不仅仅针对 C…

接下来近一分钟里，我希望你暂且将CSS、web开发、数字化用户界面抛之脑后。 接着，我想让你畅想时光回退，回到年少时，回到上学第一天。 那时的你更简单，只担心画没画好图形，有没有尿裤子。 现在，看看上图中的点，注意有些点是怎样聚在一起的，有些点又是怎样分开的?我想让你把这些点分…

如果你从事的是前端开发，就应该能理解调试代码还是很有难度的。特别是对于JavaScript，一个小错误有时会花费数小时来调试。对于不同的浏览器、操作系统和设备，错误又是不可避免的。 本文主要列出一些调试工具，你们可以自己根据情况来选择。 任何现代的 Web 浏览器都配有功能强大…

主流的测试框架有 Jasmine、 MOCHA、 Jest等。 单元测试是指对软件中最小的可测试单元进行检测和校验，前端所说的单元测试就是对一个模块进行测试。也就是说前端测试的时候，测试的一定是一个模块。 集成测试则是组装测试。在单元测试的基础上，将所有模块按照涉及要求组装成子…