Skip to content

feat (change-history): add sidebar with topbar toggle#10952

Open
tunjiadeyemi wants to merge 1 commit into
swagger-api:masterfrom
tunjiadeyemi:ft/history
Open

feat (change-history): add sidebar with topbar toggle#10952
tunjiadeyemi wants to merge 1 commit into
swagger-api:masterfrom
tunjiadeyemi:ft/history

Conversation

@tunjiadeyemi

Copy link
Copy Markdown

Description

This PR adds an API Change History feature to Swagger UI so users can quickly see what changed between OpenAPI spec reloads.

Implemented:

  • New change-history core plugin with Redux state/actions/selectors
  • Local snapshot persistence in localStorage (keyed by spec URL)
  • Spec diff engine for:
    • endpoint add/remove/modify
    • parameter/request/response changes
    • schema add/remove and property-level schema diffs
    • tags/info/security changes
    • media-type changes
  • History UI moved to a right sidebar
  • History trigger moved to top bar as a history icon (next to dark mode toggle), with unseen-change badge
  • Light/dark mode styling for the sidebar and controls

Motivation and Context

When backend teams update the OpenAPI document, frontend/API consumers currently have no native way in Swagger UI to track what changed. They must manually compare specs.
This feature adds built-in change visibility by capturing snapshots and presenting a readable history timeline of changes after reloads.
Fixes #10951

How Has This Been Tested?

  • Manual testing:

    • Ran local dev server and loaded specs from local/dev sources
    • Verified baseline snapshot is created on first load
    • Reloaded modified specs and verified history entries update correctly
    • Verified history icon badge appears for unseen changes
    • Verified sidebar open/close behavior (button, backdrop, close button)
    • Verified light/dark mode color behavior for sidebar controls
  • Automated testing:

    • Ran targeted unit tests for change-history:
    • test/unit/core/plugins/change-history/fn.test.js
    • test/unit/core/plugins/change-history/container.jsx
    • test/unit/core/plugins/change-history/sidebar.jsx
    • test/unit/standalone/plugins/top-bar/ChangeHistoryToggle.jsx
      Result: all relevant tests passed

Screenshots (if appropriate):

Screenshot 2026-07-08 at 11 50 30 Screenshot 2026-07-08 at 11 50 33 Screenshot 2026-07-08 at 12 10 29

Checklist

My PR contains...

  • No code changes (src/ is unmodified: changes to documentation, CI, metadata, etc.)
  • Dependency changes (any modification to dependencies in package.json)
  • Bug fixes (non-breaking change which fixes an issue)
  • Improvements (misc. changes to existing features)
  • Features (non-breaking change which adds functionality)

My changes...

  • are breaking changes to a public API (config options, System API, major UI change, etc).
  • are breaking changes to a private API (Redux, component props, utility functions, etc.).
  • are breaking changes to a developer API (npm script behavior changes, new dev system dependencies, etc).
  • are not breaking changes.

Documentation

  • My changes do not require a change to the project documentation.
  • My changes require a change to the project documentation.
  • If yes to above: I have updated the documentation accordingly.

Automated tests

  • My changes can not or do not need to be tested.
  • My changes can and should be tested by unit and/or integration tests.
  • If yes to above: I have added tests to cover my changes.
  • If yes to above: I have taken care to cover edge cases in my tests.
  • All new and existing tests passed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

feat: Track and display OpenAPI spec changes over time

1 participant