Baseline CI Guard – GitHub Action

A GitHub Action that scans pull requests and fails the build if new, non-Baseline features are introduced.

Comment

🌟 About the Project

Baseline Feature Check is a GitHub Action designed to automatically detect the use of non-baseline web features in your JavaScript, TypeScript, CSS, and HTML code. The goal is to help developers ensure that their code only relies on web APIs and features that are safe for their target browsers.

Inspiration

I was inspired to build this project after noticing how easily modern web development can introduce features that are not fully supported across all browsers. While testing web applications, subtle issues caused by unsupported features would often surface late in production. I wanted a tool that could automatically detect risky features early in the development workflow and integrate seamlessly with GitHub Pull Requests.

What I Learned

During this project, I deepened my understanding of:

  • Abstract Syntax Trees (ASTs) for parsing JavaScript and TypeScript using Babel.
  • PostCSS for parsing and analyzing CSS selectors and pseudo-classes.
  • GitHub Actions and the GitHub API for automating workflows and commenting on PRs.
  • Efficiently merging baseline feature definitions with local overrides and ignore lists.
  • Handling JSON safely and formatting data for automated PR comments.

I also gained practical experience with building tools that interact with multiple file types, handle large codebases, and provide structured outputs for CI/CD pipelines.

How I Built It

The project consists of three main components:

  1. Feature Detection Engine

    • JS/TS features are detected using AST parsing.
    • CSS features are detected via PostCSS and postcss-selector-parser.
    • Local overrides (baseline.json) and ignore lists (.baselineignore) customize detection per project.

  2. GitHub Action

    • Runs automatically on pull requests.
    • Posts structured PR comments showing detected non-baseline features, severity, and file usage.
    • Optionally fails the workflow if unsafe features are detected.

  3. Configuration & Extensibility

    • Users can add .baselineignore and baseline.json to adapt to their project needs.
    • The action is configurable via workflow inputs (fail-on-limited, critical-features).

Challenges

Some of the challenges I faced included:

  • Parsing large codebases efficiently without false positives.
  • Correctly detecting JS/TS features across multiple syntax patterns (e.g., identifiers, member expressions).
  • Handling forked pull requests, where GitHub restricts write permissions for the default GITHUB_TOKEN.
  • Designing user-friendly PR comments that are concise but informative.

In summary, this project combines static code analysis, CI/CD automation, and developer tooling to help maintain safer, more compatible web applications. It has strengthened my understanding of AST parsing, GitHub Actions, and automated workflow design.

🚀 What's Next for Baseline CI Guard – GitHub Action

Baseline CI Guard is already helping developers detect non-baseline web features in PRs, but there’s plenty of room to grow. Some exciting directions for the future include:

1️⃣ Expanded Feature Coverage

  • Add support for additional file types like JSON, SVG, and Markdown with embedded scripts.
  • Enhance CSS feature detection to cover animations, grids, and advanced selectors.

2️⃣ Smarter Detection

  • Introduce machine learning or heuristics to reduce false positives.
  • Track usage patterns over time to detect risky trends in large codebases.

3️⃣ Customizable Enforcement

  • Allow project-specific severity levels and rules via workflow inputs.
  • Add auto-fixes or suggestions for commonly flagged features.

4️⃣ Improved Developer Feedback

  • Integrate GitHub Checks annotations in addition to PR comments.
  • Provide summary dashboards for repositories to visualize trends across multiple PRs.

5️⃣ Community Contributions

  • Open the project for plugins or feature packs contributed by the community.
  • Maintain a central registry of safe vs. experimental features with continuous updates from MDN.

6️⃣ Marketplace & Integration

  • Publish to GitHub Marketplace for easy installation.
  • Integrate with other CI/CD platforms like GitLab and Bitbucket for broader adoption.

The ultimate goal is to make Baseline CI Guard a reliable, extensible, and easy-to-use tool that helps teams ship modern web applications safely across all browsers.

Built With

Share this project:

Updates