Warn before opening a very large JSON value in the data grid (#9868) by dpage · Pull Request #10075 · pgadmin-org/pgadmin4

dpage · 2026-06-10T15:24:55Z

Summary

Opening a very large JSON/JSONB cell in the Query Tool's cell editor parses, pretty-prints and renders the whole document on the main thread. For a pathologically large value (the report uses a jsonb object with 100,000 keys, ~3 MB) this blocks the UI thread and pgAdmin becomes completely unresponsive, with no opportunity for the user to back out.
This matches the maintainer's assessment on the issue: there should be a warning for large JSON so the user can decide whether to proceed — but currently no such warning fires.
Fix: gate JsonTextEditor — when the raw cell value exceeds a size threshold (1 MB of characters), render nothing until the user confirms via a warning dialog. If they cancel, the editor closes without doing the expensive parse/render. Small values are unaffected and open immediately, exactly as before. The grid already sets commitOnOutsideClick: false, so the confirm dialog does not dismiss the editor.
The size-threshold decision is factored into a small, separately unit-tested helper (json_editor_warning.js).

Test plan

New Jest spec regression/javascript/sqleditor/json_editor_warning.spec.js (5 tests) covering the threshold boundary, custom thresholds, and non-string values — all passing.
eslint -c .eslintrc.js clean on all changed files.
Manual: build the reporter's table, View/Edit Data, double-click the wide_data cell — a confirmation dialog appears; Cancel leaves the UI responsive, Continue opens the editor as before. A small jsonb cell opens with no prompt.

Closes #9868

Summary by CodeRabbit

Release Notes

Bug Fixes
- Added a confirmation warning when opening very large JSON/JSONB values in the data grid editor, allowing users to proceed or cancel to prevent potential application freezing.
Documentation
- Updated version 9.16 release notes with new bug-fix entry.
Tests
- Added regression tests for JSON editor warning functionality.

…-org#9868) Opening a huge JSON/JSONB cell in the Query Tool's cell editor parses, pretty-prints and renders the entire document on the main thread. For pathologically large values (e.g. a jsonb object with 100k keys) this blocks the UI thread and pgAdmin becomes completely unresponsive, with no chance for the user to back out. Guard the JSON editor: when the raw cell value exceeds a size threshold, render nothing until the user confirms via a warning dialog. If they cancel, the editor is closed without doing the expensive work. Small values are unaffected and open immediately as before. The editor already uses commitOnOutsideClick: false, so the confirm dialog does not dismiss the editor. The size-threshold logic is a small, separately tested helper. Closes pgadmin-org#9868

coderabbitai · 2026-06-10T15:25:26Z

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 6a175278-bdea-4b3d-938f-ea1288d3530d

📥 Commits

Reviewing files that changed from the base of the PR and between 04fa05c and 4b57462.

📒 Files selected for processing (4)

docs/en_US/release_notes_9_16.rst
web/pgadmin/tools/sqleditor/static/js/components/QueryToolDataGrid/Editors.jsx
web/pgadmin/tools/sqleditor/static/js/components/QueryToolDataGrid/json_editor_warning.js
web/regression/javascript/sqleditor/json_editor_warning.spec.js

Walkthrough

This PR adds a safeguard against UI freezing when opening very large JSON/JSONB cell values in the SQL editor data grid. A new detection module with a 1MB threshold, integrated into the JSON editor as a confirmation guard, prevents main-thread blocking when editing large JSON objects. Tests validate both the detection logic and confirmation behavior; release notes document the fix for issue #9868.

Changes

Large JSON Value Warning Guard

Layer / File(s)	Summary
Large JSON detection helper and predicate logic `web/pgadmin/tools/sqleditor/static/js/components/QueryToolDataGrid/json_editor_warning.js`, `web/regression/javascript/sqleditor/json_editor_warning.spec.js`	Defines a 1MB threshold constant `LARGE_JSON_WARNING_LENGTH` and exports `shouldWarnForLargeJSON(value, threshold)` predicate that returns `true` only when a string exceeds the threshold. Test infrastructure mocks `JsonEditor` and `QueryToolDataGrid`, and unit tests validate the predicate across small/empty strings, threshold boundaries, custom thresholds, and non-string inputs.
JSON editor wrapper with confirmation dialog `web/pgadmin/tools/sqleditor/static/js/components/QueryToolDataGrid/Editors.jsx`, `web/regression/javascript/sqleditor/json_editor_warning.spec.js`	Imports `shouldWarnForLargeJSON`, refactors the original JSON editor UI into an internal `JsonTextEditorContent` component, and replaces the exported `JsonTextEditor` with a wrapper that computes `proceed` state via the detection predicate. Large values trigger `pgAdmin.Browser.notifier.confirm()`; on cancel, `onClose(false)` is called; on confirm, the wrapper renders `JsonTextEditorContent`. Integration tests verify immediate rendering for small values, deferred rendering and confirmation blocking for large values, and the regression case where OK + Cancel does not close the editor.
Release notes documentation `docs/en_US/release_notes_9_16.rst`	Documents Issue `#9868` and the new warning/confirmation flow that prevents pgAdmin UI freezing when attempting to open very large JSON/JSONB values in the data grid cell editor.

Sequence Diagram

sequenceDiagram
  participant User
  participant JsonTextEditor
  participant shouldWarnForLargeJSON
  participant notifier
  participant JsonTextEditorContent
  
  User->>JsonTextEditor: Open cell editor
  JsonTextEditor->>shouldWarnForLargeJSON: Check value size
  alt Large value exceeds threshold
    shouldWarnForLargeJSON-->>JsonTextEditor: true
    JsonTextEditor->>notifier: Show confirm dialog
    alt User confirms
      notifier-->>JsonTextEditor: Callback triggered
      JsonTextEditor->>JsonTextEditorContent: Render editor
      JsonTextEditorContent-->>User: Display JSON editor
    else User cancels
      notifier-->>JsonTextEditor: Cancel callback
      JsonTextEditor->>User: Call onClose(false)
    end
  else Small value within threshold
    shouldWarnForLargeJSON-->>JsonTextEditor: false
    JsonTextEditor->>JsonTextEditorContent: Render editor immediately
    JsonTextEditorContent-->>User: Display JSON editor
  end

🎯 2 (Simple) | ⏱️ ~12 minutes

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 50.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title directly and clearly summarizes the primary change: adding a warning before opening very large JSON values in the data grid, with the issue number for traceability.
Linked Issues check	✅ Passed	All code changes directly address issue `#9868` requirements: guard mechanism prevents parsing large JSON (>1MB), confirmation dialog prevents unresponsiveness, cancellation closes editor cleanly, and helper module is unit-tested.
Out of Scope Changes check	✅ Passed	All changes are within scope: release notes documentation, JSON editor guard logic, warning threshold module, regression tests, and no unrelated modifications detected.

_{✏️ 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.}

Copilot

Pull request overview

Adds a size-based guard to the Query Tool data grid JSON cell editor to avoid UI hangs when opening very large JSON/JSONB values (issue #9868), prompting the user before doing expensive parse/pretty-print/render work on the main thread.

Changes:

Introduces shouldWarnForLargeJSON + LARGE_JSON_WARNING_LENGTH helper for determining when to warn.
Wraps JsonTextEditor with a confirmation gate for large raw JSON strings.
Adds Jest coverage for the helper and updates v9.16 release notes.

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 1 comment.

File	Description
web/regression/javascript/sqleditor/json_editor_warning.spec.js	Adds Jest tests for the size-threshold warning helper.
web/pgadmin/tools/sqleditor/static/js/components/QueryToolDataGrid/json_editor_warning.js	Implements threshold constant + helper predicate for large JSON warning.
web/pgadmin/tools/sqleditor/static/js/components/QueryToolDataGrid/Editors.jsx	Gates the JSON cell editor behind a confirm dialog for large values.
docs/en_US/release_notes_9_16.rst	Documents the fix for issue #9868 in release notes.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

notifier.confirm() fires its cancel callback whenever the dialog closes, including when the user clicks OK. The large-JSON guard passed () => onClose(false) as the cancel callback, so confirming "continue" also closed the cell editor and the JSON editor never opened. Track the confirmation in the effect closure so the editor is only closed on an actual cancel, and add a regression test for the continue path. Closes pgadmin-org#9868

asheshv requested a review from Copilot June 10, 2026 15:42

Copilot started reviewing on behalf of asheshv June 10, 2026 15:42 View session

Copilot AI reviewed Jun 10, 2026

View reviewed changes

Comment thread web/pgadmin/tools/sqleditor/static/js/components/QueryToolDataGrid/Editors.jsx

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Warn before opening a very large JSON value in the data grid (#9868)#10075

Warn before opening a very large JSON value in the data grid (#9868)#10075
dpage wants to merge 2 commits into
pgadmin-org:masterfrom
dpage:worktree-fix-issue-9868-large-json-warning

dpage commented Jun 10, 2026 •

edited by coderabbitai Bot

Loading

Uh oh!

coderabbitai Bot commented Jun 10, 2026 •

edited

Loading

❌ Failed checks (1 warning)

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Conversation

dpage commented Jun 10, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Test plan

Summary by CodeRabbit

Release Notes

Uh oh!

coderabbitai Bot commented Jun 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Sequence Diagram

❌ Failed checks (1 warning)

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

dpage commented Jun 10, 2026 •

edited by coderabbitai Bot

Loading

coderabbitai Bot commented Jun 10, 2026 •

edited

Loading