DEV Community

Discussion on: Testing Workflow for Web Components

 
dakmor profile image
Thomas Allmer

Snapshots are useful especially for components which very big dom trees - in these cases it's pretty painful to maintain 2 "versions" of the same dom (e.g. the actual dom and the dom you compare to in your test).

With snapshots you will be get an error whenever the html structure changed - what comes next depends:

  1. if you did not intend to change the dom (e.g. refactors, certain types of bug fixing, optimizations, ..) then something went wrong and you should fix it so the test passes again
  2. the dom change was intentional - then you just run the "update snapshot command" and your tests are green again

The important part here is that updating the snapshots is faster/simpler than manually adjusting a "dom string" (hence for doms with less then ~5-10 nodes it's probably impractical)