DI + Fake + in-memory: Writing Frontend Tests That Survive Refactors

Originally published at recca0120.github.io The most common testing pattern I see looks like this: test ( ' saves user data ' , () => { const mockStorage = { set : vi . fn (), get : vi . fn (). mockReturnValue ( null ), }; const service = new UserService ( mockStorage ); service . save ({ id : 1 , name : ' Alice ' }); expect ( mockStorage . set ). toHaveBeenCalledWith ( ' user:1 ' , { id : 1 , name : ' Alice ' }); }); Looks fine. Tests pass. But this approach has a long-term problem: tests are c