fix(logic):prevent BlockNote widget content persistence across form subs #79 #80

Merged

rsevs3 merged 2 commits from issue-79 into main

2025-11-11 06:17:56 +00:00

rsevs3 commented

2025-11-11 06:13:49 +00:00

(Migrated from github.com)

Root Cause:

React editor component's cleanup useEffect was calling onChange() with stale currentContent during component unmount
This caused stale data from previous widget instances to be written to new widget textareas
Problem occurred specifically after updating objects with content, then creating new empty objects

Solution:

Added cleanup signaling system between widget manager and React components
Widget cleanup now dispatches 'blocknote-cleanup' events before unmounting
React editor components listen for cleanup signals and skip final onChange calls when being properly cleaned up
Enhanced form validation with widget cleanup on submission for HTMX and regular form submissions

Key Changes:

frontend/src/core/widget-manager.ts:
- Added cleanupOrphanedWidgets() function for DOM-based cleanup detection
- Enhanced cleanupWidget() to signal React components before unmount
- Exposed additional cleanup functions in public API
frontend/src/core/editor.tsx:
- Added cleanup event listener to prevent stale onChange calls
- Enhanced unmount useEffect with smarter content handling
django_blocknote/templatetags/blocknote_tags.py:
- Enhanced form validation with widget cleanup on submission
- Added HTMX integration for form-based widget cleanup
- Improved error handling and debugging output
frontend/src/blocknote.ts:
- Updated public API to expose new cleanup functions
- Added TypeScript interfaces for new functionality

Benefits:

Eliminates content persistence between widget instances
Prevents memory leaks from unmounted React components
Maintains proper widget lifecycle management
Works with both standard forms and HTMX submissions
Provides debugging utilities for widget state tracking

This commit resolves a memory leak and content persistence issue where BlockNote widget content would incorrectly carry over between form submissions, causing empty widgets to display stale content from previously edited widgets. Root Cause: - React editor component's cleanup useEffect was calling onChange() with stale currentContent during component unmount - This caused stale data from previous widget instances to be written to new widget textareas - Problem occurred specifically after updating objects with content, then creating new empty objects Solution: - Added cleanup signaling system between widget manager and React components - Widget cleanup now dispatches 'blocknote-cleanup' events before unmounting - React editor components listen for cleanup signals and skip final onChange calls when being properly cleaned up - Enhanced form validation with widget cleanup on submission for HTMX and regular form submissions Key Changes: - frontend/src/core/widget-manager.ts: * Added cleanupOrphanedWidgets() function for DOM-based cleanup detection * Enhanced cleanupWidget() to signal React components before unmount * Exposed additional cleanup functions in public API - frontend/src/core/editor.tsx: * Added cleanup event listener to prevent stale onChange calls * Enhanced unmount useEffect with smarter content handling - django_blocknote/templatetags/blocknote_tags.py: * Enhanced form validation with widget cleanup on submission * Added HTMX integration for form-based widget cleanup * Improved error handling and debugging output - frontend/src/blocknote.ts: * Updated public API to expose new cleanup functions * Added TypeScript interfaces for new functionality Benefits: - Eliminates content persistence between widget instances - Prevents memory leaks from unmounted React components - Maintains proper widget lifecycle management - Works with both standard forms and HTMX submissions - Provides debugging utilities for widget state tracking

github-actions[bot] commented

2025-11-11 06:15:10 +00:00

(Migrated from github.com)

Code Coverage Report

Summary

Overall Coverage: 2.6%
Minimum Required: 0%
Status: ✅ PASSED

Report generated on 2025-11-11 06:15:09 UTC

Package Details

Package	Coverage
django_blocknote	🟢 8.9%
django_blocknote.forms	🟢 0.0%
django_blocknote.image	🟢 0.0%
django_blocknote.models	🟢 0.0%
django_blocknote.templatetags	🟢 0.0%
django_blocknote.views	🟢 0.0%

# Code Coverage Report ![Code Coverage](https://img.shields.io/badge/coverage-2.6%25-red) ## Summary - **Overall Coverage**: 2.6% - **Minimum Required**: 0% - **Status**: ✅ PASSED *Report generated on 2025-11-11 06:15:09 UTC* ## Package Details | Package | Coverage | |---------|-----------| | django_blocknote | 🟢 8.9% | | django_blocknote.forms | 🟢 0.0% | | django_blocknote.image | 🟢 0.0% | | django_blocknote.models | 🟢 0.0% | | django_blocknote.templatetags | 🟢 0.0% | | django_blocknote.views | 🟢 0.0% |