Fix CSS style changes not applying in Preview pane#221
Merged
Conversation
When users change CSS style or syntax highlighting theme in Preferences, the Preview pane now correctly updates to show the new styles. The issue was that the DOM replacement optimization (which preserves scroll position during edits) only replaced <body> content, leaving the old CSS <link> tags in <head>. Now we detect style changes and force a full HTML reload when needed, while preserving the fast DOM replacement path for normal text editing. Changes: - Add currentStyleName and currentHighlightingThemeName tracking properties - Check if styles changed before using DOM replacement optimization - Force full HTML reload when CSS style or highlighting theme changes - Add tests for style change detection logic Related to #219
Contributor
Code Coverage ReportCurrent Coverage: 42.43% Coverage Details (Summary) |
Owner
Author
|
Tested by hand |
schuyler
added a commit
that referenced
this pull request
Feb 26, 2026
## Summary - Add `invalidateStyleCaches` method to `MPDocument` that clears WebView's URL cache (`[[NSURLCache sharedURLCache] removeAllCachedResponses]`) and resets cached style/theme names to nil - Call `invalidateStyleCaches` from both `reloadPreview:` (Preview context menu) and `didRequestPreviewReload:` (Settings gear menu Reload button) before triggering re-render - This forces the full HTML reload path (bypassing DOM replacement optimization) so edited CSS files are re-read from disk - Add 9 unit tests verifying the cache invalidation logic and style change detection - Register `MPDocumentStyleUpdateTests.m` in the Xcode project (existed on disk but was missing from project file) ## Related Issue Related to #318 ## Root Cause The bug had two layers: 1. **DOM replacement optimization** in `renderer:didProduceHTMLOutput:` only replaced `<body>` content when the style *name* hadn't changed — but the user edited the file *content*, not the style selection. Setting cached names to nil forces `stylesChanged = YES`, bypassing DOM replacement. 2. **WebView URL cache** served stale CSS from `<link>` tags with the same `file://` URL. Clearing `NSURLCache` forces WebView to re-read from disk. Normal editing is unaffected because `invalidateStyleCaches` is only called from explicit reload handlers, never from the `editorTextDidChange:` editing flow. ## Manual Testing Plan 1. Open a Markdown document, note the CSS style in Preview 2. Edit the active CSS file externally (e.g., add `body { background-color: red !important; }`) 3. Right-click in Preview → "Reload" — **Expected:** Preview updates with red background 4. Open Preferences → Rendering → click Reload button for CSS styles — **Expected:** Same result 5. Same workflow for syntax highlighting themes (edit theme CSS, reload) 6. Verify normal typing still preserves scroll position (DOM replacement regression check) 7. Verify switching styles via dropdown still works (issue #221 regression check) --------- Co-authored-by: Claude <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Fixes the issue where CSS styles and syntax highlighting themes don't update in the Preview pane when changed in Preferences.
Root cause: The DOM replacement optimization (which preserves scroll position during text edits) only replaced
<body>content, leaving the old CSS<link>tags in<head>unchanged.Solution: Before using DOM replacement, check if CSS style or highlighting theme has changed. If so, force a full HTML reload to update the
<head>with new CSS links. This preserves the fast DOM replacement path for normal text editing.Changes
currentStyleNameandcurrentHighlightingThemeNametracking propertiesRelated Issue
Related to #219
Manual Testing Plan