What is Canyon?

In a nutshell

Canyon is a JavaScript code coverage solution. Through a simple Babel plugin configuration, coverage uploading and real-time report generation can be achieved, solving the problem of difficulty in collecting code coverage in end-to-end testing for developers and QA engineers.

Ecosystem

ProjectStatusDescription
babel-plugin-canyonbabel-plugin-canyon-statusBabel plugin for detecting pipeline environment variables
vite-plugin-canyonvite-plugin-canyon-statusVite plugin for detecting pipeline environment variables
uploaderuploader-statusCoverage reporter
canyon-extensioncanyon-extension-statusChrome plugin for manually reporting coverage data

Architecture diagram

This diagram illustrates the architecture of Canyon and some components of its ecosystem:

  1. The Babel plugin completes code instrumentation in the CI/CD process.
  2. The project is released to the test environment. The user chooses UI automation or manual testing to trigger the instrumented code probe.
  3. The generated coverage data is reported to the Canyon server.
  4. The Canyon server consumes the data and combines the source code information provided by GitLab to generate a coverage report.