杂谈
文章平均质量分 95
写代码的海怪
公众号「写代码的海怪」
展开
-
彻底解决 qiankun 找不到入口的问题
揭秘第三种 qiankun 找入口的方法原创 2022-08-30 11:54:40 · 2038 阅读 · 1 评论 -
测试中如何处理 Http 请求?
一种在测试中模拟网络请求的方法原创 2022-06-10 13:24:16 · 412 阅读 · 0 评论 -
前端测试常见的 3 个误区
避免过度测试代码细节、避免 100% 覆盖、避免重复测试原创 2022-05-27 12:27:07 · 145 阅读 · 0 评论 -
TDD 的原理和场景
TDD 是什么?要在什么场景下使用?原创 2022-05-06 13:18:14 · 269 阅读 · 0 评论 -
前端测试一共有哪几种?
前言哈喽,大家好,我是海怪。最近有不少朋友找到我聊了聊测试相关的内容,发现他们对测试的分类有些迷茫。实际上测试一共就 3 种:E2E,集成,单测,其它的功能测试、UI 测试、界面测试只是它们中里面的一种。Kent C. Dodds在这篇文章 《Static vs Unit vs Integration vs E2E Testing for Frontend Apps》也聊到了这 3 种测试的对比和区别,除此之外,还聊到它们各自的适用场景,应该对还在迷茫中的同学有所帮助。所以今天把这篇文章分享给大家原创 2022-04-29 13:19:39 · 919 阅读 · 0 评论 -
如何测自定义的 React Hooks?
组件和纯函数都好测,那 Hooks 呢?原创 2022-04-22 12:55:17 · 1178 阅读 · 0 评论 -
测试代码怎么做抽象才是有意义的?
前言哈喽,大家好,我是海怪。不知道大家在写前端单测的时候,是否有出现测试代码和测试数据重复冗余的情况?然后不得不写一些函数和类来封装他们的。然而,慢慢地会发现:过度的封装会致使你的测试用例变得越来越难读。那到底在写测试代码时,怎样的封装才是好的封装呢?今天就把 Kent 的这篇 《AHA Testing》 分享给大家~正片开始“AHA 编码原则” 指的是 “避免过度的抽象”(Avoid Hasty Abstraction)。我对这如何适用于编写可维护的测试有不一样的感觉。因为我见过太多人写的测试原创 2022-04-15 13:55:21 · 176 阅读 · 0 评论 -
前端单测,我们应该测什么?
解决问题不是最难的,发现问题才是!原创 2022-04-09 17:10:27 · 202 阅读 · 0 评论 -
使用 React Testing LIbrary 的 15 个常见错误
前言哈喽,大家好,我是海怪。刚开始我在写项目的单测方案的时候,老板就让我能够写一些单测的规范。虽然表面上我非常自然地说:没问题,但是心里还是慌得不行:以前我自己写单测也没啥规范呀,直接开干就好了。最近一直在看 Kent 的文章,刚好看到他写的这篇 《Common mistakes with React Testing Library》,里面列举了很多别人写单测时经常犯的一些错误 。正好可以作为单测规范的参考。所以,今天就把这篇文章也分享给大家~翻译中会尽量用更地道的语言,这也意味着会给原文加一层原创 2022-04-02 14:42:53 · 12234 阅读 · 0 评论 -
前端单测为什么不要测代码实现细节?
前言哈喽,大家好,我是海怪。相信不少同学在写单测的时候,最大的困扰不是如何写测试代码,而是:“应该测什么?”,“要测多深入”,“哪些不该测”。最近在给 React 组件写单测的时候,发现了 Kent (React Testing Library 的贡献者之一)的 《Testing Implementation Details》 这篇文章,里面对 “为什么不要测代码实现细节?” 这个问题写得非常好,今天就把这篇文章也分享给大家。翻译中会尽量用更地道的语言,这也意味着会给原文加一层 Buf,想看原文的原创 2022-03-26 10:47:41 · 1261 阅读 · 0 评论 -
来聊聊我们为什么要写单测
关于单测的好处,这次来聊点不一样的原创 2022-03-19 11:45:18 · 1114 阅读 · 1 评论 -
用原生 Audio API 实现一个千千静听
还记得那个用千千静听播《简单爱》的下午嘛原创 2022-03-12 09:42:48 · 618 阅读 · 0 评论 -
用JS轻松实现一个录音、录像、录屏的工具库
读懂 react-media-recorder 的源码原创 2022-03-04 12:53:09 · 1726 阅读 · 0 评论 -
用 WebRTC 给自己拍张照
前言哈喽,大家好,我是海怪。最近一直在看 WebRTC 的用法,也学了一下音视频流的东西,今天就跟大家分享一个好玩的小实战吧——给自己拍照。项目已上传至 Github,Repo地址:https://github.com/haixiangyan/webrtc-take-photo页面结构首先,我们要拆分一下实现步骤:打开摄像头,获取视频流需要一个 <video> 来播放摄像头的画面点击按钮,生成画面,并展示在 <img> 里因此,我们需要 <vide原创 2022-02-26 13:55:26 · 1407 阅读 · 0 评论 -
用 Peer.js 愉快上手 P2P 通信
Peer.js 的简单上手原创 2022-02-18 13:18:15 · 1502 阅读 · 0 评论 -
秒懂 Web Component
超级简单的 Web Component原创 2022-02-11 12:46:50 · 1528 阅读 · 0 评论 -
初探 MicroApp,一个极致简洁的微前端框架
这个微前端框架真好吃原创 2022-01-28 13:11:20 · 3297 阅读 · 1 评论 -
一个经常被忽略的 single-spa 微前端实践
前言大家好,我是海怪。了解过微前端的同学应该对 single-spa 这个框架都不陌生,但是我翻看了中文整个社区,发现太少文章是讲 single-spa Demo 实践的。还有一些文章讲了,但是都是以晒代码为主,只讲是什么,不讲为什么。这对读者来说并不是一个很好的体验。那今天就跟大家深入分析一下 single-spa 的 React 版 Demo 吧。让读者知其然,也能知其所然。简介其实 single-spa 的官网上就写了非常多的 Demo 示例:大家只关注 Actively maintain原创 2022-01-14 10:01:10 · 647 阅读 · 0 评论 -
微前端x重构实践落地总结
4000+字全面总结微前端在重构的落地实践原创 2022-01-04 09:55:25 · 849 阅读 · 0 评论 -
我的2021年终总结,原来一年这么长
2021 的个人总结原创 2022-01-01 12:33:37 · 3235 阅读 · 0 评论