There is a huge problem with documentation examples - they might be wrong. Since they are copied from tests, or written by hand without running them, there is no guarantee that they are correct with respect to the latest Cypress version.
We could write a real end-to-end test for each example and keep it in sync, but this requires a lot of work to stay up-to-date. What if we instead executed the examples directly from the documentation pages? After all, each example has the HTML to mount and test code to run, so it contains all the parts of a real test as code blocks.
This is what @cypress/fiddle does. It contains a test file preprocessor that understand the Markdown file format, finds all specially marked example blocks and creates a Cypress test out of them. For example, see bahmutov/vuepress-cypress-test-example. In that repo, the README.md file contains the following block
Notice the special HTML comments
<!-- fiddle DOM test --> and
cy.last example in the documentation becomes a fiddle like this:
And it runs as a test in Cypress