Practical Front-End Testing / Практическое фронт-энд тестирование Год издания: 2025 Автор: Tang Hsin-Hao / Тан Синь-Хао Издательство: Apress Media LLC ISBN: 979-8-8688-1451-8 Язык: Английский Формат: PDF/EPUB Качество: Издательский макет или текст (eBook) Интерактивное оглавление: Да Количество страниц: 366 Описание: In the fast-paced and ever-evolving field of front-end development, one of the biggest challenges is maintaining high-quality code while producing work rapidly. This is why testing has become crucial. Deciding on the right testing approach and how to write and execute tests is a key issue every developer must consider. Code without tests is difficult to guarantee in terms of quality, and the solution lies in developing a solid testing strategy. This book provides practical guidance in front-end testing that will help you master a variety of techniques and understand how to apply them in real-world applications. This book dives deep into the types and implementation of front-end testing to teach you best practices for building flexible, maintainable test code. By guiding you through various strategies, the book will help you produce test code efficiently. Its pragmatic approach promises to be useful if you encounter challenges when writing tests and are searching for solutions. The book provides detailed explanations supported by visuals and code examples, helping you learn, practice, and apply various front-end tests. It presents clear principles and approaches to guide you in evaluating testing strategies and costs, so you can make the best choices. Additionally, the book contains thorough explanations of various challenges through easy-to-understand examples, enabling you to tackle testing obstacles with ease. It begins with the fundamentals of testing, discussing basics like types of tests and naming conventions. The subsequent chapters cover how to write and use unit testing, integration testing, end-to-end testing, and visual testing. Additionally, the book includes a chapter on how to perform these tests. The final chapters focus on frequently asked questions about front-end testing, serving as a quick reference for developers. The book concludes with material on how to use AI in testing to boost productivity. You Will Learn: How to write and employ a wide variety of tests, including unit testing, integration testing, end-to-end testing, and visual testing Effectively using AI tools to generate test code and enhance productivity Make informed decisions in testing, based on both cost and effectiveness Who Is This Book For: Front-end developers, full-stack developers, software testers, and QA automation developers. В быстро развивающейся области интерфейсной разработки одной из самых сложных задач является поддержание высокого качества кода при одновременном быстром выполнении работы. Вот почему тестирование стало иметь решающее значение. Выбор правильного подхода к тестированию, а также способов написания и выполнения тестов является ключевым вопросом, который должен учитывать каждый разработчик. Качество кода без тестов трудно гарантировать, и решение заключается в разработке надежной стратегии тестирования. В этой книге представлены практические рекомендации по интерфейсному тестированию, которые помогут вам освоить различные методы и понять, как применять их в реальных приложениях. В этой книге подробно рассматриваются типы и реализация интерфейсного тестирования, чтобы научить вас передовым методам создания гибкого, удобного в обслуживании тестового кода. Ознакомив вас с различными стратегиями, книга поможет вам эффективно создавать тестовый код. Ее прагматичный подход обещает быть полезным, если вы столкнетесь с трудностями при написании тестов и будете искать решения. Книга содержит подробные объяснения, подкрепленные визуальными эффектами и примерами кода, которые помогут вам изучить, практиковать и применять различные интерфейсные тесты. В ней представлены четкие принципы и подходы, которые помогут вам оценить стратегии тестирования и затраты, чтобы вы могли сделать оптимальный выбор. Кроме того, книга содержит подробные объяснения различных задач с помощью простых для понимания примеров, что позволит вам с легкостью преодолевать препятствия при тестировании. Она начинается с основ тестирования, в которой рассматриваются такие базовые понятия, как типы тестов и соглашения об именовании. В последующих главах рассказывается о том, как писать и использовать модульное тестирование, интеграционное тестирование, сквозное тестирование и визуальное тестирование. Кроме того, в книгу включена глава о том, как выполнять эти тесты. В заключительных главах рассматриваются часто задаваемые вопросы о интерфейсном тестировании, которые служат кратким руководством для разработчиков. В конце книги представлен материал о том, как использовать искусственный интеллект в тестировании для повышения производительности. Вы узнаете: Как писать и использовать широкий спектр тестов, включая модульное тестирование, интеграционное тестирование, комплексное тестирование и визуальное тестирование Эффективное использование инструментов искусственного интеллекта для создания тестового кода и повышения производительности Принимайте обоснованные решения при тестировании, исходя как из затрат, так и из эффективности Для кого предназначена эта книга: Разработчики интерфейсов, разработчики полного цикла, тестировщики программного обеспечения и разработчики средств автоматизации контроля качества.
Примеры страниц (скриншоты)
Оглавление
About the Author ...........................................................................................xiii About the Technical Reviewer ..........................................................................xv Acknowledgments ..........................................................................................xvii Introduction ..................................................................................................xix Forewords .....................................................................................................xxiii Chapter 1: Getting Started with Testing .............................................................1 What Is Front-End Web Testing? .......................................................................2 Why Write Tests? ............................................................................................2 How to Start Writing Tests? ..............................................................................3 Types of Front-End Testing ...............................................................................4 Unit Testing ...................................................................................................5 Integration Testing ..........................................................................................8 End-to-End Testing .........................................................................................10 Visual Testing .................................................................................................11 I Only Have One Hour, Which Tests Should I Write? .............................................12 Summary ......................................................................................................13 Notes ............................................................................................................15 Testing Techniques ..........................................................................................16 What Are the Testing Techniques? .....................................................................16 How Are These Testing Techniques Applied in Development? .................................17 Are These Testing Techniques Suitable for UI Development? .................................18 Notes ............................................................................................................20 Naming Conventions ........................................................................................22 Given-When-Then ............................................................................................23 it should .........................................................................................................24 3A Pattern ......................................................................................................25 Conclusion ......................................................................................................26 Notes .............................................................................................................27 Mock, Spy, and Double .....................................................................................27 Mock ..............................................................................................................27 Spy ................................................................................................................28 Double ...........................................................................................................30 Notes .............................................................................................................31 Chapter Review and Summary ...........................................................................32 Chapter 2: Unit Testing .....................................................................................35 Unit Testing .....................................................................................................36 Environment Setup, Installation, and Tool Comparison ..........................................39 Jest ................................................................................................................39 Cypress ..........................................................................................................48 Notes .............................................................................................................53 Minimal Scope Validation Logic ..........................................................................54 Breaking Down Overly Complex Code ................................................................56 Isolating Dependencies ...................................................................................58 Conclusion .....................................................................................................60 Notes ............................................................................................................60 How to Write Tests for Components? A React Example .........................................60 Testing Implementation vs. Testing Behavior ......................................................61 Splitting Logic and Presentation ........................................................................69 Summary .......................................................................................................80 Notes .............................................................................................................81 Shallow Rendering and Full Rendering ................................................................82 Shallow Rendering ...........................................................................................83 Full Rendering .................................................................................................94 Notes .............................................................................................................95 Chapter Review and Summary ...........................................................................96 Chapter 3: Integration Testing ...........................................................................99 Integration Testing ..........................................................................................99 Notes ...........................................................................................................108 Testing Features from the User’s Perspective and Maximizing Realism ........................................................................................108 Testing Features from the User’s Perspective .....................................................108 Maximizing Realism ........................................................................................110 Notes ...........................................................................................................112 Mocking Components, API Responses, and Third-Party Libraries ...........................113 How to Mock Components? .............................................................................114 How to Mock API Responses? ..........................................................................116 How to Mock Third-Party Libraries? ..................................................................122 Why Aim for Realism? Is Mocking Not Good Enough? ..........................................125 Can Testing Be Done Without Using Mock Data? .................................................129 Notes ...........................................................................................................129 Snapshots .....................................................................................................130 Notes ...........................................................................................................140 How to Write Tests for State Management? A Redux Example ..............................141 Notes ...........................................................................................................148 Chapter Review and Summary .........................................................................148 Chapter 4: End-to-End Testing .........................................................................151 End-to-End Testing .........................................................................................151 Notes ...........................................................................................................154 Environment Setup and Installation ..................................................................154 Notes ...........................................................................................................156 Verifying User Flow ........................................................................................159 Memori ........................................................................................................160 Conclusion ...................................................................................................167 Notes ...........................................................................................................169 Chapter Review and Summary .........................................................................169 Chapter 5: Visual Testing .................................................................................171 Visual Testing .................................................................................................171 Mixtini ..........................................................................................................172 How Snapshot Comparison Works ....................................................................174 Notes ...........................................................................................................176 Verifying Visual Accuracy ................................................................................177 Component-Level Testing ...............................................................................178 Page-Level Testing ........................................................................................189 Workflow .....................................................................................................192 Summary .....................................................................................................192 Notes ...........................................................................................................193 Tool Comparison ...........................................................................................194 Snapshot File Types and Structure ..................................................................195 Reviewing Snapshots Based on Pull Requests or Branches .................................197 Merge Checks .............................................................................................197 Component-Level Testing .............................................................................198 Page-Level Testing .......................................................................................198 Browser Support ..........................................................................................199 Summary ....................................................................................................199 Notes ..........................................................................................................201 Chapter Review and Summary ........................................................................201 Chapter 6: What to Do After Writing Tests: When and How to Run Them ..............205 Pre-commands and Manual Test Invocation ......................................................206 Pre-commands .............................................................................................206 Manual Test Invocation ..................................................................................207 Summary .....................................................................................................209 Notes ..........................................................................................................209 Run Tests Before Merging Code .......................................................................210 pre-commit ..................................................................................................210 pre-push ......................................................................................................211 Running Tests During PR Submission ................................................................213 Summary .....................................................................................................214 Notes ...........................................................................................................214 Running Tests Regularly in CI ..........................................................................215 Should Code Be Merged into the Main Branch When Tests Fail? ............................216 How to Reduce the Likelihood of Test Failures After Code Merges? ........................217 Notes ...........................................................................................................217 Inferring Use Case Coverage from Code Coverage ..............................................218 Conclusion ....................................................................................................223 Chapter Review and Summary .........................................................................223 Chapter 7: Frequently Asked Questions ............................................................225 What to Do When UI Updates Cause Test Failures? ............................................225 The Element Selection Method Is Too Loose, Strict, or Lacks Clear Meaning ..........226 Tests with Too Many Implementation Details .....................................................234 Summary .....................................................................................................248 Notes ...........................................................................................................249 How to Handle Duplicate Tests? ........................................................................249 Notes ...........................................................................................................253 How to Test the Timer? ...................................................................................254 Notes ...........................................................................................................258 How to Mock Only Part of a Module? .................................................................258 How to Debug? What If an Element Can’t Be Found? How Do You Trace the Data Flow? ................................................................................260 What If the Element Can’t Be Found? ................................................................263 How Do You Trace the Data Flow? ....................................................................265 Notes ...........................................................................................................267 How to Test Localization? .................................................................................267 Notes ...........................................................................................................271 How to Use Setup and Teardown? What Are beforeEach, afterEach, beforeAll, and afterAll? ....................................................................272 Repeated Setup ............................................................................................272 One-Time Setup ...........................................................................................275 Summary .....................................................................................................276 Notes ...........................................................................................................276 Should Tests Include Type Checking? ...............................................................277 Option 1: Implement Type Checking Inside the addNumbers Function ...................277 Option 2: Use Tools for Type Checking ..............................................................278 Notes ...........................................................................................................279 Why Do Some Test Cases Succeed Sometimes and Fail Other Times? ....................280 Resource Dependencies .................................................................................280 Test Dependencies ........................................................................................283 Conclusion ...................................................................................................286 Notes .........................................................................................................286 How to Run Specific Tests? An Example Using Jest .........................................287 Skipping Specific Test Blocks ......................................................................287 Skipping Specific Test Cases .......................................................................288 Notes .......................................................................................................292 Chapter 8: Leveraging AI for Writing Tests .....................................................293 How to Effectively Use GitHub Copilot for Writing Tests ....................................293 Simple Example ..........................................................................................294 Implementing Unit Tests ..............................................................................296 Implementing Integration Tests .....................................................................297 Implementing End-to-End Tests .....................................................................302 Conclusion ..................................................................................................304 Notes .........................................................................................................305 How to Leverage Mermaid and ChatGPT for Writing Tests ..................................306 Simple Example ...........................................................................................307 Writing Unit Tests .........................................................................................313 Implementing Integration Test .......................................................................318 Implementing End-to-End Test .......................................................................324 Conclusion ...................................................................................................328 Notes ...........................................................................................................329 Chapter 9: Summary ......................................................................................331 Types and Methods of Testing ...........................................................................331 Product Stage and Testing Ratio .......................................................................331 Common Types of Testing .................................................................................331 Testing Methods and Tools ................................................................................332 Testing Strategies at Different Stages of Product Development ..............................332 Leveraging AI to Improve Testing Efficiency ........................................................333 Conclusion .....................................................................................................333 Index ............................................................................................................335
You cannot post new topics in this forum You cannot reply to topics in this forum You cannot edit your posts in this forum You cannot delete your posts in this forum You cannot vote in polls in this forum You cannot attach files in this forum You can download files in this forum
![[Quote]](./templates/default/images/lang/en/icon_quote.gif "Reply with quote"){kind=icon}
![[Profile]](./templates/default/images/lang/en/icon_profile.gif "View user's profile"){kind=icon}
![[PM]](./templates/default/images/lang/en/icon_pm.gif "Send private message"){kind=icon}
