Skip to content

Conversation

@omarkasem
Copy link
Collaborator

@omarkasem omarkasem commented Sep 8, 2025

💾 Build file (a932eab).

Summary by CodeRabbit

  • Bug Fixes
    • Disabled linting in the admin CSS editor when the editor is in CSS mode to prevent false warnings and allow modern CSS syntax without erroneous errors.
    • Improves editing experience and compatibility with contemporary CSS features.
    • Linting behavior for other languages/editors remains unchanged.

✏️ Tip: You can customize this high-level summary in your review settings.

@omarkasem omarkasem linked an issue Sep 8, 2025 that may be closed by this pull request
@omarkasem omarkasem self-assigned this Sep 8, 2025
@coderabbitai
Copy link

coderabbitai bot commented Sep 8, 2025

Walkthrough

Disables CodeMirror linting for editors initialized with CSS mode by setting codemirrorConfig.codemirror.lint = false in setupCodeMirror after merging data-codemirror attributes; no other behavior or API changes.

Changes

Cohort / File(s) Summary
CodeMirror CSS lint toggle
assets/js/admin-views.js
In setupCodeMirror, after merging data-codemirror attributes, if attributeValue.mode === 'css', set codemirrorConfig.codemirror.lint = false to disable linting for CSS mode. No other logic or API changes.

Sequence Diagram(s)

(omitted)

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

  • Review assets/js/admin-views.js around setupCodeMirror to confirm the conditional placement and that codemirrorConfig is defined when modified.
  • Verify there are no unintended side effects for editors that rely on lint being enabled by other configuration sources.

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)
Check name Status Explanation
Title check ✅ Passed The title directly and clearly describes the main change: disabling CodeMirror linting specifically for CSS mode, which matches the core functionality implemented in the changeset.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
✨ Finishing touches
  • 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch issue/2411-custom-code-editor-shows-false-warnings-for-valid-modern-css

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

Copy link

@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: 0

🧹 Nitpick comments (1)
assets/js/admin-views.js (1)

1345-1349: Broaden CSS-mode check and read the merged config, not just data-attribute.

Covers cases where mode is 'text/css' or an object ({name:'css'}) and when mode comes from defaults (no data-codemirror on the textarea). Optionally removes empty lint gutter.

-			   // Disable linting for CSS mode as WordPress CSS editor does not support modern CSS syntax.
-			   if ( attributeValue && 'css' === attributeValue.mode ) {
-				   codemirrorConfig.codemirror.lint = false;
-			   }
+			   // Disable linting for CSS mode as WordPress CSS editor does not support modern CSS syntax.
+			   const modeOpt  = codemirrorConfig?.codemirror?.mode;
+			   const modeName = typeof modeOpt === 'string' ? modeOpt : modeOpt?.name;
+			   if ( modeName === 'css' || modeName === 'text/css' ) {
+				   codemirrorConfig.codemirror.lint = false;
+				   // Optional: drop lint gutter to avoid an empty column.
+				   if ( Array.isArray( codemirrorConfig.codemirror.gutters ) ) {
+					   codemirrorConfig.codemirror.gutters =
+						   codemirrorConfig.codemirror.gutters.filter( g => g !== 'CodeMirror-lint-markers' );
+				   }
+			   }
📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 70d9f3c and 4ffc051.

⛔ Files ignored due to path filters (1)
  • assets/js/admin-views.min.js is excluded by !**/*.min.js
📒 Files selected for processing (1)
  • assets/js/admin-views.js (1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
  • GitHub Check: test_and_package

…SS syntax in WordPress. This change ensures compatibility with the WordPress CSS editor, which does not handle modern CSS features.
@mrcasual mrcasual force-pushed the issue/2411-custom-code-editor-shows-false-warnings-for-valid-modern-css branch from 4ffc051 to a932eab Compare December 5, 2025 13:36
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.

Custom code editor shows false warnings for valid modern CSS

3 participants