Skip to content

Improve unit test coverage of Applications -> Token Settings#1950

Open
brionmario wants to merge 1 commit intoasgardeo:mainfrom
brionmario:feat-homepage
Open

Improve unit test coverage of Applications -> Token Settings#1950
brionmario wants to merge 1 commit intoasgardeo:mainfrom
brionmario:feat-homepage

Conversation

@brionmario
Copy link
Copy Markdown
Member

@brionmario brionmario commented Mar 25, 2026

Purpose

This pull request enhances the test coverage and improves user experience for the OAuth2 application editing and token settings features. The main changes include new and expanded test cases for advanced settings, scope mapping, and JWT preview components, as well as UI improvements for error visibility and accessibility in token validation and scope mapping.

Test Coverage Improvements:

  • Added comprehensive tests for the ScopeSection component, verifying correct rendering, prop passing, and callback behavior when scopes are added or removed, including proper cleanup of scope claims.
  • Expanded tests for EditAdvancedSettings to cover OAuth2 config change handling and correct merging and prioritization of inbound auth configs.
  • Enhanced JwtPreview tests to cover Monaco editor integration, decoration application, prop changes, and cleanup on unmount. [1] [2]
  • Added keyboard accessibility tests to ScopeMapper, ensuring scopes can be selected via Enter and Space keys.

User Experience and Accessibility Enhancements:

  • Improved the TokenValidationSection to automatically switch tabs to the token type with validation errors and visually indicate errors on tabs with a red dot, increasing error discoverability and accessibility. [1] [2] [3]
  • Updated input props for token validity fields to use slotProps for minimum value enforcement, aligning with UI library best practices.

Bug Fixes:

  • Fixed token settings update logic to preserve existing token configuration when updating access or ID token settings. [1] [2]

Test Utility Updates:

  • Improved test setup for Monaco editor by mocking its behavior to allow for more comprehensive and reliable tests in JwtPreview.

Minor Updates:

  • Added missing imports (fireEvent, InboundAuthConfig) in test files to support new test cases. [1] [2] [3]

These changes collectively strengthen the reliability, usability, and accessibility of the application editing experience for OAuth2 applications.

Approach

N/A

Related Issues

  • N/A

Related PRs

Checklist

  • Followed the contribution guidelines.
  • Manual test round performed and verified.
  • Documentation provided. (Add links if there are any)
    • Ran Vale and fixed all errors and warnings
  • Tests provided. (Add links if there are any)
    • Unit Tests
    • Integration Tests
  • Breaking changes. (Fill if applicable)
    • Breaking changes section filled.
    • breaking change label added.

Security checks

  • Followed secure coding standards in WSO2 Secure Coding Guidelines
  • Confirmed that this PR doesn't commit any keys, passwords, tokens, usernames, or other secrets.

Summary by CodeRabbit

  • Bug Fixes

    • Preserve existing nested token properties when updating OAuth token settings
    • Ensure token validation tabs show precise error indicators
  • New Features

    • Token validation tabs auto-switch to surface active errors
    • Improved keyboard support (Enter/Space) and cancelable timers for scope add/remove flows
  • Tests

    • Expanded unit tests covering PKCE toggle, scope flows, JWT preview mounting/cleanup, scope selector timers, and scope section behavior
  • Localization

    • Updated token UI translation keys and added a validation error label

@coderabbitai
Copy link
Copy Markdown

coderabbitai bot commented Mar 25, 2026

Warning

Rate limit exceeded

@brionmario has exceeded the limit for the number of commits that can be reviewed per hour. Please wait 18 minutes and 27 seconds before requesting another review.

⌛ How to resolve this issue?

After the wait time has elapsed, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout.

Please see our FAQ for further information.

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: a9aaf829-b8b5-44d0-ac22-364f12d500b9

📥 Commits

Reviewing files that changed from the base of the PR and between ba31172 and 814d4b5.

📒 Files selected for processing (8)
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/advanced-settings/__tests__/EditAdvancedSettings.test.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/EditTokenSettings.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/TokenValidationSection.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/JwtPreview.test.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/ScopeMapper.test.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/ScopeSection.test.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/ScopeSelector.test.tsx
  • frontend/packages/thunder-i18n/src/locales/en-US.ts
📝 Walkthrough

Walkthrough

Adds and updates tests for OAuth2/PKCE, scope management, and JWT preview; preserves existing token subfields when updating OAuth token config; adds token-validation tab auto-switching with inline error indicators; and renames one i18n key.

Changes

Cohort / File(s) Summary
OAuth2 Config Tests
frontend/apps/thunder-console/src/features/applications/components/edit-application/advanced-settings/__tests__/EditAdvancedSettings.test.tsx
Adds user-event-driven tests for toggling PKCE and asserts onFieldChange('inboundAuthConfig', ...) behavior across no-config, existing-inboundAuthConfig, and editedApp-priority cases.
Token Settings Logic
frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/EditTokenSettings.tsx
When applying debounced OAuth token updates, preserves other token subproperties by spreading ...updatedConfig.token before updating accessToken/idToken.
Token Validation UI
frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/TokenValidationSection.tsx
Adds derived error flags, an effect to auto-switch validation tabs toward the token with errors, swaps numeric inputPropsslotProps, and shows inline error-dot indicators with aria labels on OAuth tabs.
Token-related Tests & Monaco Mock
frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/JwtPreview.test.tsx, .../ScopeMapper.test.tsx, .../ScopeSection.test.tsx, .../ScopeSelector.test.tsx
Enhances Monaco mock (supports onMount, editor/monaco stubs) and adds tests for JWT preview lifecycle; adds keyboard (Enter/Space) scope-selection tests; introduces ScopeSection suite covering add/remove and scope-claims mutation; adds timer-driven add/remove and cancellation tests for ScopeSelector.
i18n Update
frontend/packages/thunder-i18n/src/locales/en-US.ts
Renames translation key edit.token.user_info.inherit_infoedit.token.user_info.inherit_hint and adds edit.token.validation_error.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

Suggested labels

Type/Improvement

Suggested reviewers

  • jeradrutnam
  • DonOmalVindula
  • ThaminduDilshan

Poem

🐰 I hopped through tabs and PKCE,

I nudged token fields to keep them free,
Scopes leapt on Enter, Space gave a cheer,
JWTs stayed tidy as tests drew near,
Hooray — the console’s safer here! ✨

🚥 Pre-merge checks | ✅ 3
✅ Passed checks (3 passed)
Check name Status Explanation
Title check ✅ Passed The title accurately describes the main focus of the PR: improving unit test coverage for the Token Settings feature area within Applications.
Description check ✅ Passed The PR description is comprehensive and well-structured, covering purpose, approach, related PRs, and checklist items. It provides clear context about test coverage improvements, UX enhancements, bug fixes, and utility updates.
Docstring Coverage ✅ Passed Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@brionmario brionmario added the skip-changelog Skip generating changelog for a particular PR label Mar 25, 2026
Copy link
Copy Markdown

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 3

🧹 Nitpick comments (1)
frontend/apps/thunder-console/src/features/applications/components/edit-application/advanced-settings/__tests__/EditAdvancedSettings.test.tsx (1)

227-228: Use fully shaped OAuth2 fixtures instead of force-casts to strengthen type-safety.

The test fixtures at lines 227–228 and 253–254 cast partial objects to OAuth2Config, omitting the required responseTypes field. TypeScript's interface definition shows both grantTypes and responseTypes are required (not optional). This force-casting weakens type-safety and bypasses contract validation that could catch real regressions.

Add the missing responseTypes field to match the interface contract:

  • For authorization_code grant type, use responseTypes: ['code']
  • For implicit grant type, use responseTypes: ['token']
Proposed fix
-        inboundAuthConfig: [
-          {type: 'oauth2', config: {grantTypes: ['authorization_code']} as OAuth2Config} as InboundAuthConfig,
-        ],
+        inboundAuthConfig: [
+          {
+            type: 'oauth2',
+            config: {
+              grantTypes: ['authorization_code'],
+              responseTypes: ['code'],
+            },
+          } as InboundAuthConfig,
+        ],
@@
-      const editedInbound: InboundAuthConfig[] = [
-        {type: 'oauth2', config: {grantTypes: ['implicit']} as OAuth2Config} as InboundAuthConfig,
-      ];
+      const editedInbound: InboundAuthConfig[] = [
+        {
+          type: 'oauth2',
+          config: {
+            grantTypes: ['implicit'],
+            responseTypes: ['token'],
+          },
+        } as InboundAuthConfig,
+      ];

Also applies to: 253–254

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In
`@frontend/apps/thunder-console/src/features/applications/components/edit-application/advanced-settings/__tests__/EditAdvancedSettings.test.tsx`
around lines 227 - 228, The OAuth2 test fixtures in
EditAdvancedSettings.test.tsx are being force-cast to OAuth2Config while
omitting required fields; update the fixtures that set {type: 'oauth2', config:
{grantTypes: ['authorization_code']} as OAuth2Config} and the similar implicit
fixture to include the required responseTypes property (use responseTypes:
['code'] for authorization_code and responseTypes: ['token'] for implicit) so
the objects fully conform to the OAuth2Config interface instead of relying on
force-casts.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Inline comments:
In
`@frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/JwtPreview.test.tsx`:
- Around line 105-135: The tests currently only check for no-throws and DOM
presence but must assert side effects: spy/mock the editor instance used by
JwtPreview to verify that editor.deltaDecorations is called on mount and again
on rerender when defaultClaims changes (reference JwtPreview and
deltaDecorations), and ensure the content change listener's disposable.dispose
is invoked on unmount (reference the content listener/disposable and the unmount
helper). Update the tests to inject or mock the Monaco editor instance, attach
spies to deltaDecorations and the disposable.dispose method, then assert those
spies were called at the appropriate stages (initial render, rerender with new
defaultClaims, and unmount).

In
`@frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/ScopeMapper.test.tsx`:
- Around line 160-192: The keyboard-selection assertions in the ScopeMapper
tests are too broad because they only check presence of 'given_name' which may
already appear in the Available Attributes panel; update the two tests
("pressing Enter on a scope in the left panel selects it" and "pressing Space on
a scope in the left panel selects it") to assert selection-specific UI: after
simulating keyDown on the profile button (use screen.getByRole('button', {name:
/profile/i}) as already used), verify that 'given_name' appears specifically
inside the Mapped/Right panel (or that 'email' is no longer shown in the Mapped
panel), e.g., query the mapped panel container (the element rendered by
ScopeMapper that holds mapped claims) and assert within that container rather
than using global getByText; this ensures the key press actually moved the
mapping.

In `@frontend/packages/thunder-i18n/src/locales/en-US.ts`:
- Around line 1271-1273: The locale file is missing the translation key
applications:edit.token.validation_error used by TokenValidationSection.tsx for
the tab error indicator aria-label; add an entry 'edit.token.validation_error':
'<appropriate English message>' to the en-US locale object (near the other
edit.token.* keys such as 'edit.token.inherit_from_id_token' and
'edit.token.user_info.inherit_hint') so TokenValidationSection.tsx can read a
proper human-readable string for the aria-label.

---

Nitpick comments:
In
`@frontend/apps/thunder-console/src/features/applications/components/edit-application/advanced-settings/__tests__/EditAdvancedSettings.test.tsx`:
- Around line 227-228: The OAuth2 test fixtures in EditAdvancedSettings.test.tsx
are being force-cast to OAuth2Config while omitting required fields; update the
fixtures that set {type: 'oauth2', config: {grantTypes: ['authorization_code']}
as OAuth2Config} and the similar implicit fixture to include the required
responseTypes property (use responseTypes: ['code'] for authorization_code and
responseTypes: ['token'] for implicit) so the objects fully conform to the
OAuth2Config interface instead of relying on force-casts.

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: d02c0e23-185d-4bf5-8c72-53b794aa6704

📥 Commits

Reviewing files that changed from the base of the PR and between 5050633 and 7247daa.

📒 Files selected for processing (8)
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/advanced-settings/__tests__/EditAdvancedSettings.test.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/EditTokenSettings.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/TokenValidationSection.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/JwtPreview.test.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/ScopeMapper.test.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/ScopeSection.test.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/ScopeSelector.test.tsx
  • frontend/packages/thunder-i18n/src/locales/en-US.ts

@brionmario brionmario force-pushed the feat-homepage branch 3 times, most recently from ba31172 to 1fe5107 Compare March 25, 2026 18:51
@brionmario brionmario enabled auto-merge March 25, 2026 18:52
Copy link
Copy Markdown

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🧹 Nitpick comments (1)
frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/ScopeSection.test.tsx (1)

154-157: Assert mock invocation before indexing mock.calls.

Line 154 directly accesses the first call payload; adding an invocation assertion first gives clearer failure output when callback wiring breaks.

Suggested tweak
-    const updatedClaims = onScopeClaimsChange.mock.calls[0][0] as ScopeClaims;
+    expect(onScopeClaimsChange).toHaveBeenCalledTimes(1);
+    const updatedClaims = onScopeClaimsChange.mock.calls[0][0] as ScopeClaims;
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In
`@frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/ScopeSection.test.tsx`
around lines 154 - 157, Add an assertion that the mock callback was invoked
before indexing into its calls: verify onScopeClaimsChange was called (e.g.,
expect(onScopeClaimsChange).toHaveBeenCalled()) immediately before retrieving
updatedClaims from onScopeClaimsChange.mock.calls[0][0] so tests fail with a
clear message when the handler wasn't called.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Inline comments:
In
`@frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/TokenValidationSection.tsx`:
- Around line 129-156: The Tab labels currently put aria-label on the decorative
dot Box which won't reliably expose the error to screen readers; instead, when
hasAccessTokenError or hasIdTokenError is true, include the translated error
text from t('applications:edit.token.validation_error', 'Validation error') in
the Tab's accessible name (e.g., append it to the span that contains the tab
text or set the Tab's aria-label to "<tab text> - Validation error") and mark
the dot Box as decorative by removing its aria-label and adding
aria-hidden="true" or role="presentation" so it doesn't duplicate or steal
accessibility semantics.

---

Nitpick comments:
In
`@frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/ScopeSection.test.tsx`:
- Around line 154-157: Add an assertion that the mock callback was invoked
before indexing into its calls: verify onScopeClaimsChange was called (e.g.,
expect(onScopeClaimsChange).toHaveBeenCalled()) immediately before retrieving
updatedClaims from onScopeClaimsChange.mock.calls[0][0] so tests fail with a
clear message when the handler wasn't called.

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: fd3af4ba-f17b-47c5-8379-8217598b0414

📥 Commits

Reviewing files that changed from the base of the PR and between 280b378 and ba31172.

📒 Files selected for processing (8)
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/advanced-settings/__tests__/EditAdvancedSettings.test.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/EditTokenSettings.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/TokenValidationSection.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/JwtPreview.test.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/ScopeMapper.test.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/ScopeSection.test.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/__tests__/ScopeSelector.test.tsx
  • frontend/packages/thunder-i18n/src/locales/en-US.ts
✅ Files skipped from review due to trivial changes (1)
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/tests/ScopeMapper.test.tsx
🚧 Files skipped from review as they are similar to previous changes (4)
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/EditTokenSettings.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/tests/JwtPreview.test.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/token-settings/tests/ScopeSelector.test.tsx
  • frontend/apps/thunder-console/src/features/applications/components/edit-application/advanced-settings/tests/EditAdvancedSettings.test.tsx

@codecov
Copy link
Copy Markdown

codecov bot commented Mar 25, 2026

Codecov Report

❌ Patch coverage is 96.00000% with 1 line in your changes missing coverage. Please review.
✅ Project coverage is 90.15%. Comparing base (5050633) to head (814d4b5).

Files with missing lines Patch % Lines
...lication/token-settings/TokenValidationSection.tsx 96.00% 1 Missing ⚠️
Additional details and impacted files
@@            Coverage Diff             @@
##             main    #1950      +/-   ##
==========================================
+ Coverage   90.02%   90.15%   +0.12%     
==========================================
  Files         879      879              
  Lines       56803    56826      +23     
==========================================
+ Hits        51139    51231      +92     
+ Misses       4147     4079      -68     
+ Partials     1517     1516       -1     
Flag Coverage Δ
backend-integration-postgres 49.30% <ø> (ø)
backend-integration-sqlite 49.25% <ø> (ø)
backend-unit 85.12% <ø> (+<0.01%) ⬆️
frontend-apps-console-unit 91.81% <96.00%> (+0.45%) ⬆️
frontend-apps-gate-unit 98.71% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@brionmario brionmario added this pull request to the merge queue Mar 26, 2026
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Mar 26, 2026
@brionmario brionmario added this pull request to the merge queue Mar 26, 2026
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Mar 26, 2026
@brionmario brionmario added this pull request to the merge queue Mar 26, 2026
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Mar 26, 2026
@brionmario brionmario added this pull request to the merge queue Mar 26, 2026
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Mar 26, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

skip-changelog Skip generating changelog for a particular PR

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants