CYPRESS-AJV-SCHEMA-VALIDATOR v1.2.0: Boost Debugging Skills from Vigilante to Superhero with Advanced Schema Error Insights!

Master JSON Schema Validation with Precision: Unleash the Power of CYPRESS-AJV-SCHEMA-VALIDATOR v1.2.0!

(Cover image from pexels.com by Franco Monsalvo)

ACT 1: EXPOSITION

In the fast-paced world of software development and testing, efficiency and clarity are crucial. Isn't that right?
No need to answer that question; it was simply rhetorical, as you guessed. 😉

When the cypress-ajv-schema-validator plugin was introduced a little over three months ago, it was an instant success! It streamlined the process of JSON schema validation in the Cypress ecosystem by filling an existing gap and integrating flawlessly within any Cypress test framework.

As a result, it was highlighted in the official Cypress blog "Elevate Your Cypress Testing: Top 10 Essential Plugins",and included in the JSON Schema Tooling website of the json-schema.org.

Besides allowing the tester to validate any API response directly with JSON schemas or even whole OpenAPI and Swagger documents, the plugin provides detailed error information in the Cypress log. It also offers a nested, user-friendly tree view depiction of the validated data, clearly highlighting the schema errors and their exact locations in an intuitive format.

To fully grasp the features introduced in past versions of the cypress-ajv-schema-validator plugin, check out the earlier article "CYPRESS-AJV-SCHEMA-VALIDATOR Plugin: The Brave Vigilante for Your API Contracts".

However, despite its usefulness, this method required testers to navigate away from the main Cypress interface to the browser console, disrupting the testing flow.

Also, recognizing the widespread use of Gleb Bahmutov's @bahmutov/cy-api and Filip Hric's cypress-plugin-api plugins, which enhance the Cypress testing experience by beautifully showcasing request and response data during API testing in Cypress, I envisioned a more enriched solution...

Why not blend these API tools together to create a seamless, enhanced testing experience, elevating testers from vigilant problem solvers to debugging superheroes? 🦸

I must confess, this is something I envisioned from the very beginning when I conceived the plugin.

Also, a Cypress user of the plugin contacted me recently and mentioned an interesting use case: 'When making significant breaking changes, I sometimes want to turn off schema validation and get the E2E working first. I frequently have to add an override of the cy.validateSchema() command at the beginning of a test file to disable the schema validation.' I found this to be a particularly valuable use case.

That's when cypress-ajv-schema-validator donned its virtual tights and cape, ready to tackle schema mischief with a superhero's flair!

ACT 2: CONFRONTATION

Let's dive into the new features of cypress-ajv-schema-validator v1.2.0, without dragging out the suspense like a superhero soap opera cliffhanger.

DISABLE SCHEMA VALIDATION

This feature allows users to disable schema validation within their tests or the entire Cypress framework, adding flexibility. Testers can skip certain validations when they are unnecessary or when specific constraints require bypassing schema checks altogether.

When schema validation is disabled for a test, the Cypress log and the browser console will display the following message:

✔️ You can disable the schema validation in your tests by setting the Cypress environment variable disableSchemaValidation to true.

An environment variable can be set in Cypress in various locations, depending on the specific contexts in which you want to disable the functionality.

• Cypress Configuration File (cypress.config.js): This is useful for applying settings globally across all tests.

module.exports = defineConfig({
      env: {
            disableSchemaValidation: true
      }
});

• Cypress Environment File (cypress.env.json): Use this for setting environment variables to be accessible during specific test runs.

{
    "disableSchemaValidation": true
}

• Command Line Interface (CLI) using --env: This is ideal for temporary overrides during specific test executions without affecting other configurations.

npx cypress open -- env disableSchemaValidation=true

• Within Suite or Test Configuration: Set it directly in the test file for precise control over individual test behaviors.

describe(
  'Suite name',
  {
    env: {
      disableSchemaValidation: true,  // For all tests in the suite
    },
  },
  () => {
    it('Test name', () => {
      // Your test code
    })
  }
)

FULL INTEGRATION WITH @bahmutov/cy-api AND cypress-plugin-api PLUGINS

In this release, the plugin is fully integrated with both of these well-known plugins. This integration allows JSON schema validations to be directly chained after their cy.api() command, using a javascript sentence as simple as:

cy.api('your_url').validateSchema(schemaObject)

Schema errors are displayed instantly in the user interfaces of these plugins, offering an enhanced testing experience. This feature ensures immediate and intuitive error visibility, allowing testers to identify and address JSON schema errors without needing to navigate away from the Cypress environment to the browser console.

✔️ You can enable the display of errors for JSON schema validations in the user interface by setting the Cypress environment variable enableMismatchesOnUI to true.

bahmutov/cy-api

Schema validation mismatches will be displayed directly in the plugin's UI in a user-friendly format.

Missing fields in the obtained JSON response will be highlighted directly within the object representation using a red color and the symbol 🟥.
All other errors will be displayed in orange with the symbol 🟠.

cypress-plugin-api

The schema violations will be displayed in the plugin's UI in a clear, easy-to-read format, following the same color legend.

ACT3: RESOLUTION

Isn't this plugin with its new features cooler than Deadpool?!

And more importantly, isn't it incredibly helpful for quickly identifying what's really happening with the response data in your API request, and understanding why and where it doesn't match the expected JSON Schema?!

I know my opinion might be a bit biased, but I truly believe this tool will save you minutes, if not hours, when debugging schema errors during your API testing.

Embrace the power of speed and precision, and watch your productivity soar!

(Image from pexels.com by Kindel Media)

Don't forget to leave a comment, give a thumbs up, or follow my Cypress blog if you found this new plugin and this post useful. Your feedback and support are always appreciated!