The Dollar Bet that Fuzzed Figma: Exploding Laptops and UI Reliability with Jonathan Chan

The podcast discusses FuzzMap, a tool designed to stress-test React user interfaces by automating fuzz testing to uncover crashes and edge cases. Inspired by conversations at Figma, the project aimed to replicate the thoroughness of human-led "Bug Bash" testing but through automated, coverage-guided methods. The technical approach involved adapting principles from tools like AFL (American Fuzzy Lop), such as branch coverage tracking, but required complex instrumentation of Reacts internal state transitions. Challenges included visualizing and debugging complex UI states, as well as the limitations of Reacts pure-function model, which simplified instrumentation but made simulating certain state interactions difficult. The team used Babel for compile-time instrumentation and explored techniques like state reduction (e.g., collapsing loop iterations) to improve fuzzer efficiency, though this sacrificed some granularity in tracking edge cases.

The discussion also highlighted practical hurdles in testing, such as reliance on Selenium scripts running on an unreliable MacBook and the need to manually maintain test environments. Future directions for FuzzMap included expanding to full-stack fuzzing and integrating with large language models (LLMs) to enhance automated testing. The project blended academic rigor (e.g., applying linear temporal logic for system property analysis) with pragmatic experimentation, such as hacking Reacts internal structure to prioritize purity for fuzzing. Visualizing state transitions through a "fuzz map" posed challenges due to the complexity of tracking inputs and UI changes, especially when incorporating network interactions or handling asynchronous events. The tools development also touched on broader issues like balancing coverage depth with computational efficiency and the limitations of current testing frameworks in capturing real-world interactions.