Skip to content

Commit 94bfe20

Browse files
committed
Mark the component test chapters as obsolete
1 parent 8521348 commit 94bfe20

File tree

4 files changed

+61
-44
lines changed

4 files changed

+61
-44
lines changed

README.md

Lines changed: 46 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -30,9 +30,9 @@
3030
4. [Beginners (1)](#4-beginners)
3131
5. [Generic testing perks (1)](#5-generic-testing-perks)
3232
6. [Tools (2)](#6-tools)
33-
7. [Component Testing (3)](#7-component-testing)
34-
8. [Advanced (5)](#8-advanced)
35-
9. [Real Life Examples (2)](#9-real-life-examples)
33+
7. [Advanced (5)](#7-advanced)
34+
8. [Real Life Examples (2)](#8-real-life-examples)
35+
9. [Obsolete chapters (3)](#9-obsolete-chapters)
3636

3737
<br/><br/>
3838

@@ -232,48 +232,19 @@ some UI utilities that make easy to use them as a development tool.
232232

233233
<br/><br/>
234234

235-
# `7. Component Testing`
236235

237-
Please note: the whole Component Testing world is changing rapidly, more contents will be added.
238236

239-
## ![] 7.1 [@NoriSte](https://github.com/NoriSte)'s approach: Testing a component with Cypress and Storybook
237+
# `7. Advanced`
240238

241-
**TL;DR:** Components ar the building blocks of your app, testing them in isolation is important to discover, as soon as possible, iof there is something wrong with them.
242-
243-
**Otherwise:** UI Tests without lower-level tests do not allow you to understand the source of the problem.
244-
245-
🔗 [**Read More: Testing a component with Cypress and Storybook**](/sections/tools/cypress-and-storybook.md)
246-
247-
<br/>
248-
249-
## ![] 7.2 [@daedalius](https://github.com/daedalius)'s approach: Exposing components from Storybook separating stories from tests
250-
251-
**TL;DR:** You may expose the component reference from Storybook Story to test it whatever you wish in Cypress without breaking testing logic into pieces.
252-
253-
**Otherwise:** Splitted test logic and test data will make it difficult to read and support.
254-
255-
🔗 [**Read More: Cypress + Storybook. Keeping test scenario, data and component rendering in one place.**](/sections/tools/cypress-and-storybook-exposing-component-from-story.md)
256-
257-
<br/>
258-
259-
## ![] 7.3 Unit Testing React components with Cypress
260-
261-
**TL;DR:** Cypress v4.5.0 release allowed Unit Testing React components, an external tool like Storybook is not necessary anymore to test isolated components.
262-
263-
🔗 [**Read More: Unit Testing React components with Cypress.**](/sections/tools/cypress-react-component-test.md)
264-
<br/> <br/>
265-
266-
# `8. Advanced`
267-
268-
## ![] 8.1 Test States
239+
## ![] 7.1 Test States
269240

270241
**TL;DR:** Tests should be repeatable, modular and should handle their own state setup. UI Tests should not be repeated in order to achieve state for another test.
271242

272243
🔗 [**Read More: Test States**](./sections/advanced/test-states.md)
273244

274245
<br/>
275246

276-
## ![] 8.2 Test Flake
247+
## ![] 7.2 Test Flake
277248

278249
**TL;DR:** Tests must produce consistent results every time. Repeatable pipeline execution results are the quorum.
279250
If a test cannot produce reliable results, it reduces confidence in the tests and requires maintenance which reduces all value. In these cases it is best to manually test the functionality.
@@ -282,33 +253,33 @@ If a test cannot produce reliable results, it reduces confidence in the tests an
282253

283254
<br/>
284255

285-
## ![] 8.3 Combinatorial Testing
256+
## ![] 7.3 Combinatorial Testing
286257

287258
**TL;DR:** Most software bugs and failures are caused by one or two parameters. Testing parameter combinations can provide more efficient fault detection than conventional methods. Combinatorial Testing is a proven method for more effective software testing at a lower cost.
288259

289260
🔗 [**Read More: Combinatorial Testing**](./sections/advanced/combinatorial-testing.md)
290261

291262
<br/>
292263

293-
## ![] 8.4 Performance Testing
264+
## ![] 7.4 Performance Testing
294265

295266
**TL;DR:** Although this is a vast topic, Performance testing from a web development perspective can be simplified with modern tools and understanding. It is highly effective in ensuring user experience, satisfying non-functional requirements (NFRS), and detecting possible system-flake early on.
296267

297268
🔗 [**Read More: Performance Testing**](./sections/advanced/performance-testing.md)
298269

299270
<br/>
300271

301-
## ![] 8.5 Email Testing
272+
## ![] 7.5 Email Testing
302273

303274
**TL;DR:** Email testing is [critical for business success](https://www.industrialmarketer.com/why-email-testing-is-critical-for-email-marketing-success/). Modern services not only allow automated email testing but also provide a stateless, scalable solution while testing SaaS applications.
304275

305276
🔗 [**Read More: Email Testing**](./sections/advanced/email-testing.md)
306277

307278
<br/><br/>
308279

309-
# `9. Real Life Examples`
280+
# `8. Real Life Examples`
310281

311-
## ![] 9.1 Siemens - Test the front-end with the integration tests, the back-end with the E2E ones - in reference to [Component vs Integration vs E2e Testing](./sections/testing-strategy/component-vs-integration-vs-e2e-testing.md)
282+
## ![] 8.1 Siemens - Test the front-end with the integration tests, the back-end with the E2E ones - in reference to [Component vs Integration vs E2e Testing](./sections/testing-strategy/component-vs-integration-vs-e2e-testing.md)
312283

313284
**TL;DR:** UI tests with a stubbed server are reliable and faster compared to full E2E tests. Full E2E tests are not always necessary to ensure front-end quality. We can instead have high confidence in front-end quality by using lower-cost UI integration tests and saving higher cost E2E tests for the back-end.
314285

@@ -318,7 +289,7 @@ If a test cannot produce reliable results, it reduces confidence in the tests an
318289

319290
<br/>
320291

321-
## ![] 9.2 WorkWave - From unreadable React Component Tests to simple, stupid ones
292+
## ![] 8.2 WorkWave - From unreadable React Component Tests to simple, stupid ones
322293

323294
**TL;DR:** The test's code must be as straightforward as possible. The benefit is to save a lot of time to understand, update, refactor, fix it when needed. At the opposite, a terrible scenario happens when you are not able to read some tests, even if you are the author! Here are reported some examples explaining why the test's code is hard, and how they have been refactored.
324295

@@ -328,6 +299,40 @@ If a test cannot produce reliable results, it reduces confidence in the tests an
328299

329300
<br/> <br/>
330301

302+
# `9. Obsolete chapters`
303+
304+
## Unit Testing React components with Cypress
305+
306+
*This section is now marked as obsolete because it refers to a very old version of Cypress (that now fully supports component tests).*
307+
308+
**TL;DR:** Cypress v4.5.0 release allowed Unit Testing React components, an external tool like Storybook is not necessary anymore to test isolated components.
309+
310+
🔗 [**Read More: Unit Testing React components with Cypress.**](/sections/tools/cypress-react-component-test.md)
311+
312+
<br/>
313+
314+
## [@daedalius](https://github.com/daedalius)'s approach: Exposing components from Storybook separating stories from tests
315+
316+
*This section is now marked as obsolete because it refers to a very old version of Cypress and Storybook (either of them now fully support component tests).*
317+
318+
**TL;DR:** You may expose the component reference from Storybook Story to test it whatever you wish in Cypress without breaking testing logic into pieces.
319+
320+
**Otherwise:** Splitted test logic and test data will make it difficult to read and support.
321+
322+
🔗 [**Read More: Cypress + Storybook. Keeping test scenario, data and component rendering in one place.**](/sections/tools/cypress-and-storybook-exposing-component-from-story.md)
323+
324+
## [@NoriSte](https://github.com/NoriSte)'s approach: Testing a component with Cypress and Storybook
325+
326+
*This section is now marked as obsolete because it refers to a very old version of Cypress and Storybook (either of them now fully support component tests).*
327+
328+
**TL;DR:** Components ar the building blocks of your app, testing them in isolation is important to discover, as soon as possible, iof there is something wrong with them.
329+
330+
**Otherwise:** UI Tests without lower-level tests do not allow you to understand the source of the problem.
331+
332+
🔗 [**Read More: Testing a component with Cypress and Storybook**](/sections/tools/cypress-and-storybook.md)
333+
334+
<br/> <br/>
335+
331336
## Steering Committee
332337

333338
Meet the steering committee members - the people who work together to provide guidance and future direction to the project.

sections/tools/cypress-and-storybook-exposing-component-from-story.md

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,8 @@
1-
# Cypress + Storybook. Keeping test scenario, data and component rendering in one place.
1+
# [OBSOLETE] Cypress + Storybook. Keeping test scenario, data and component rendering in one place.
2+
3+
*This section is now marked as obsolete because it refers to a very old version of Cypress and Storybook (either of them now fully support component tests).*
4+
5+
---
26

37
_Russian version: [Cypress + Storybook. Хранение тестового сценария, данных и рендеринг компонента в одном месте](https://habr.com/ru/post/497544/)._
48

sections/tools/cypress-and-storybook.md

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,8 @@
1-
# Testing a component with Cypress and Storybook
1+
# [OBSOLETE] Testing a component with Cypress and Storybook
2+
3+
*This section is now marked as obsolete because it refers to a very old version of Cypress and Storybook (either of them now fully support component tests).*
4+
5+
---
26

37
_**UPDATE**: After this experimental approach, take a look at the “[Unit Testing React components with Cypress](./cypress-react-component-test.md)” chapter, things got simplified and more effective with Cypress 4.5.0 release!_
48

sections/tools/cypress-react-component-test.md

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,8 @@
1-
# Unit Testing React components with Cypress
1+
# [OBSOLETE] Unit Testing React components with Cypress
2+
3+
*This section is now marked as obsolete because it refers to a very old version of Cypress (that now fully supports component tests).*
4+
5+
---
26

37
_**UPDATE**: [Cypress 10 is out with Component Testing integrated with E2E testing](https://www.cypress.io/blog/2022/06/01/cypress-10-release/), please check it out and ignore all the configuration steps reported below since they are outdated!_
48

0 commit comments

Comments
 (0)