← all papers · overview

LLM-Based Unit Test Cases Generation for React, Vue, and Angular Components

Abstract

The rapid adoption of React, Vue, and Angular for creating dynamic UIs for the interactive web makes manual unit testing increasingly time-consuming and error-prone due to framework specific paradigms such as hooks, reactivity, and dependency injection. Large Language Models (LLMs) offer a new solution for unit test automation, although relative efficacy comparisons among the top three JavaScript tools remain largely unexplored. This paper presents a systematic evaluation of five LLMs - GPT-4o, Claude Opus 4, Gemini 2.5 Pro, Grok 3, and Llama 3 in generating JEST-based unit tests for the twelve isolated TodoMVC UI components for each of the three popular JavaScript frameworks, cumulatively totaling thirtysix UI components. Identical testing prompts, along with three independent test runs per LLM (540 test suites in total), test suite pass/fail status, individual test pass percentage, code coverage percentages for statements, branches, functions, and line coverage, and execution time were measured. The results show that Gemini 2.5 Pro achieved the highest average test pass rate of 93.73 % and average test suite result (reliability), followed closely by Claude Opus 4 at 89.76 %, while React and Vue consistently yield higher pass rates and coverage than Angular. The UI components that require state updating, such as the 'RemainingCounter' UI, proved significantly harder across all models. The study provides a large-scale (540 independently generated test suites), reproducible comparison of LLM performance on modern JavaScript UI frameworks and offers actionable insights into model strengths, framework-specific challenges, and prompting strategies for practical adoption in web development.

Related papers

Ranked by semantic similarity — how closely each paper's abstract matches this one (100% = near-identical topic).