@capillarytech/creatives-library 8.0.263 → 8.0.265

package/v2Components/HtmlEditor/utils/contentSanitizer.js

@@ -24,7 +24,7 @@ const defaultMessageFormatter = (messageKey, values = {}) => {
     'sanitizer.productionValidHtml': 'Provide valid HTML content before deploying to production',
     'sanitizer.productionSanitized': 'Content has been sanitized for security - review changes before deploying',
     'sanitizer.productionInlineCss': 'Consider inlining CSS for better email client compatibility',
-    'sanitizer.productionLargeContent': `Content is large (${values.size || 'unknown'} characters) - consider optimizing for mobile performance`,
+    'sanitizer.productionLargeContent': `Content is large (${values.size || 'unknown'} characters) - consider optimizing for mobile performance`
   };
 
   return fallbackMessages[messageKey] || messageKey;
@@ -33,17 +33,17 @@ const defaultMessageFormatter = (messageKey, values = {}) => {
 // Constants for better maintainability
 const SANITIZER_VARIANTS = {
   EMAIL: 'email',
-  INAPP: 'inapp',
+  INAPP: 'inapp'
 };
 
 const SECURITY_LEVELS = {
   STANDARD: 'standard',
-  STRICT: 'strict',
+  STRICT: 'strict'
 };
 
 const CONTENT_LIMITS = {
   LARGE_CONTENT_SIZE: 50000,
-  MIN_CONTENT_LENGTH: 0,
+  MIN_CONTENT_LENGTH: 0
 };
 
 const DANGEROUS_PROTOCOLS = ['javascript:', 'data:', 'vbscript:'];
@@ -51,7 +51,7 @@ const DANGEROUS_PROTOCOLS = ['javascript:', 'data:', 'vbscript:'];
 const EVENT_HANDLERS = [
   'onclick', 'onload', 'onerror', 'onmouseover', 'onmouseout',
   'onmousedown', 'onmouseup', 'onkeydown', 'onkeyup', 'onkeypress',
-  'onfocus', 'onblur', 'onchange', 'onsubmit', 'onreset',
+  'onfocus', 'onblur', 'onchange', 'onsubmit', 'onreset'
 ];
 
 // Email-specific sanitization config
@@ -62,18 +62,18 @@ const EMAIL_CONFIG = {
     'a', 'img', 'table', 'tr', 'td', 'th', 'thead', 'tbody', 'tfoot',
     'ul', 'ol', 'li', 'strong', 'b', 'em', 'i', 'u', 'center',
     'font', 'small', 'big', 'sup', 'sub', 'pre', 'code',
-    'blockquote', 'cite', 'abbr', 'acronym', 'address',
+    'blockquote', 'cite', 'abbr', 'acronym', 'address'
   ],
   ALLOWED_ATTR: [
     'src', 'alt', 'title', 'href', 'target', 'rel',
     'width', 'height', 'style', 'class', 'id',
     'align', 'valign', 'bgcolor', 'color', 'border',
     'cellpadding', 'cellspacing', 'colspan', 'rowspan',
-    'type', 'charset', 'content', 'name', 'http-equiv',
+    'type', 'charset', 'content', 'name', 'http-equiv'
   ],
   FORBID_TAGS: ['script', 'iframe', 'object', 'embed', 'applet', 'form', 'input'],
   FORBID_ATTR: ['onclick', 'onload', 'onerror', 'onmouseover'],
-  ALLOW_DATA_ATTR: false,
+  ALLOW_DATA_ATTR: false
 };
 
 // InApp-specific sanitization config
@@ -83,29 +83,29 @@ const INAPP_CONFIG = {
     'div', 'span', 'p', 'br', 'hr', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6',
     'a', 'img', 'button', 'ul', 'ol', 'li', 'strong', 'b', 'em', 'i', 'u',
     'small', 'big', 'sup', 'sub', 'pre', 'code', 'blockquote', 'cite',
-    'video', 'audio', 'source', 'canvas', // Mobile-friendly multimedia
+    'video', 'audio', 'source', 'canvas'  // Mobile-friendly multimedia
   ],
   ALLOWED_ATTR: [
     'src', 'alt', 'title', 'href', 'target', 'rel',
     'width', 'height', 'style', 'class', 'id',
     'type', 'controls', 'autoplay', 'loop', 'muted',
-    'poster', 'preload',
+    'poster', 'preload'
   ],
   FORBID_TAGS: ['script', 'iframe', 'object', 'embed', 'applet', 'form', 'input'],
   FORBID_ATTR: ['onclick', 'onload', 'onerror', 'onmouseover'],
-  ALLOW_DATA_ATTR: true,
+  ALLOW_DATA_ATTR: true
 };
 
 // Strict sanitization config for production
 const STRICT_CONFIG = {
   ALLOWED_TAGS: [
     'div', 'span', 'p', 'br', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6',
-    'a', 'img', 'strong', 'b', 'em', 'i', 'u', 'ul', 'ol', 'li',
+    'a', 'img', 'strong', 'b', 'em', 'i', 'u', 'ul', 'ol', 'li'
   ],
   ALLOWED_ATTR: ['src', 'alt', 'title', 'href', 'style', 'class'],
   FORBID_TAGS: ['script', 'iframe', 'object', 'embed', 'applet', 'form', 'input', 'style'],
   FORBID_ATTR: ['onclick', 'onload', 'onerror', 'onmouseover'],
-  ALLOW_DATA_ATTR: false,
+  ALLOW_DATA_ATTR: false
 };
 
 /**
@@ -126,9 +126,8 @@ export const sanitizeHTML = (html, variant = SANITIZER_VARIANTS.EMAIL, level = S
       warnings: html === null || html === undefined ? [] : [{
         type: 'warning',
         message: formatMessage('sanitizer.invalidInput'),
-        source: 'sanitizer',
-        rule: 'sanitizer.invalidInput', // Rule Group #1 – blocking error for UI gating
-      }],
+        source: 'sanitizer'
+      }]
     };
   }
 
@@ -138,7 +137,7 @@ export const sanitizeHTML = (html, variant = SANITIZER_VARIANTS.EMAIL, level = S
       sanitized: '',
       isClean: true,
       removedElements: [],
-      warnings: [],
+      warnings: []
     };
   }
 
@@ -160,7 +159,7 @@ export const sanitizeHTML = (html, variant = SANITIZER_VARIANTS.EMAIL, level = S
     sanitized: '',
     isClean: true,
     removedElements: [],
-    warnings: [],
+    warnings: []
   };
 
   try {
@@ -189,8 +188,8 @@ export const sanitizeHTML = (html, variant = SANITIZER_VARIANTS.EMAIL, level = S
       CUSTOM_ELEMENT_HANDLING: {
         tagNameCheck: null,
         attributeNameCheck: null,
-        allowCustomizedBuiltInElements: false,
-      },
+        allowCustomizedBuiltInElements: false
+      }
     };
 
     // Sanitize the content directly
@@ -203,12 +202,12 @@ export const sanitizeHTML = (html, variant = SANITIZER_VARIANTS.EMAIL, level = S
 
     // Add variant-specific warnings (check original HTML before sanitization)
     addVariantWarnings(html, variant, result, formatMessage);
+
   } catch (error) {
     result.warnings.push({
       type: 'error',
       message: formatMessage('sanitizer.sanitizationFailed', { error: error.message }),
-      source: 'sanitizer',
-      rule: 'sanitizer.sanitizationFailed', // Rule Group #1 – blocking error for UI gating
+      source: 'sanitizer'
     });
     result.sanitized = ''; // Return empty content if sanitization fails
     result.isClean = false;
@@ -230,30 +229,30 @@ const addVariantWarnings = (html, variant, result, formatMessage = defaultMessag
   if (variant === SANITIZER_VARIANTS.EMAIL) {
     // Check for potentially problematic email elements
     const emailProblematicElements = ['<video', '<audio', '<canvas'];
-    if (emailProblematicElements.some((element) => html.includes(element))) {
+    if (emailProblematicElements.some(element => html.includes(element))) {
       result.warnings.push({
         type: 'warning',
         message: formatMessage('sanitizer.emailMultimediaNotSupported'),
-        source: 'email-compatibility',
+        source: 'email-compatibility'
       });
     }
 
     const problematicStyles = ['position: fixed', 'position: sticky', 'position:fixed', 'position:sticky'];
-    if (problematicStyles.some((style) => html.includes(style))) {
+    if (problematicStyles.some(style => html.includes(style))) {
       result.warnings.push({
         type: 'warning',
         message: formatMessage('sanitizer.emailPositioningNotSupported'),
-        source: 'email-compatibility',
+        source: 'email-compatibility'
       });
     }
 
     // Check for CSS Grid/Flexbox which may have limited email support
     const modernCssFeatures = ['display: grid', 'display: flex', 'display:grid', 'display:flex'];
-    if (modernCssFeatures.some((feature) => html.includes(feature))) {
+    if (modernCssFeatures.some(feature => html.includes(feature))) {
       result.warnings.push({
         type: 'info',
         message: formatMessage('sanitizer.emailModernCssLimited'),
-        source: 'email-compatibility',
+        source: 'email-compatibility'
       });
     }
   } else if (variant === SANITIZER_VARIANTS.INAPP) {
@@ -262,7 +261,7 @@ const addVariantWarnings = (html, variant, result, formatMessage = defaultMessag
       result.warnings.push({
         type: 'info',
         message: formatMessage('sanitizer.mobileTablesNotFriendly'),
-        source: 'mobile-optimization',
+        source: 'mobile-optimization'
       });
     }
 
@@ -271,7 +270,7 @@ const addVariantWarnings = (html, variant, result, formatMessage = defaultMessag
       result.warnings.push({
         type: 'info',
         message: formatMessage('sanitizer.mobileRelativeFontSizes'),
-        source: 'mobile-optimization',
+        source: 'mobile-optimization'
       });
     }
 
@@ -280,7 +279,7 @@ const addVariantWarnings = (html, variant, result, formatMessage = defaultMessag
       result.warnings.push({
         type: 'info',
         message: formatMessage('sanitizer.mobileFixedWidthsProblematic'),
-        source: 'mobile-optimization',
+        source: 'mobile-optimization'
       });
     }
   }
@@ -303,9 +302,9 @@ export const prepareForProduction = (html, variant = SANITIZER_VARIANTS.EMAIL, f
       warnings: [{
         type: 'error',
         message: formatMessage('sanitizer.invalidInputNonEmpty'),
-        source: 'production-validator',
+        source: 'production-validator'
       }],
-      recommendations: [formatMessage('sanitizer.productionValidHtml')],
+      recommendations: [formatMessage('sanitizer.productionValidHtml')]
     };
   }
 
@@ -317,7 +316,7 @@ export const prepareForProduction = (html, variant = SANITIZER_VARIANTS.EMAIL, f
     isProductionReady: sanitizeResult.isClean,
     securityIssues: sanitizeResult.removedElements,
     warnings: sanitizeResult.warnings,
-    recommendations: [],
+    recommendations: []
   };
 
   // Add production readiness recommendations
@@ -356,7 +355,9 @@ export const isContentSafe = (html) => {
   if (!html || typeof html !== 'string') return true;
 
   // Create dynamic patterns from constants
-  const protocolPatterns = DANGEROUS_PROTOCOLS.map((protocol) => new RegExp(protocol.replace(':', '\\:'), 'gi'));
+  const protocolPatterns = DANGEROUS_PROTOCOLS.map(protocol =>
+    new RegExp(protocol.replace(':', '\\:'), 'gi')
+  );
 
   const eventHandlerPattern = new RegExp(EVENT_HANDLERS.join('|'), 'gi');
 
@@ -368,10 +369,10 @@ export const isContentSafe = (html) => {
     /<object/gi,
     /<embed/gi,
     /<applet/gi,
-    /<form/gi,
+    /<form/gi
   ];
 
-  return !dangerousPatterns.some((pattern) => pattern.test(html));
+  return !dangerousPatterns.some(pattern => pattern.test(html));
 };
 
 /**
@@ -394,7 +395,7 @@ export const findUnsafeContent = (html) => {
     'Iframe': /<iframe[^>]*>/gi,
     'Object/Embed': /<(object|embed)[^>]*>/gi,
     'Applet': /<applet[^>]*>/gi,
-    'Form': /<form[^>]*>/gi,
+    'Form': /<form[^>]*>/gi
   };
 
   Object.entries(patterns).forEach(([name, pattern]) => {
@@ -405,7 +406,7 @@ export const findUnsafeContent = (html) => {
         type: name,
         content: match[0],
         position: match.index,
-        length: match[0].length,
+        length: match[0].length
       });
 
       // Prevent infinite loop for global patterns
@@ -428,5 +429,5 @@ export default {
   // Include constants in default export for convenience
   VARIANTS: SANITIZER_VARIANTS,
   SECURITY_LEVELS,
-  CONTENT_LIMITS,
+  CONTENT_LIMITS
 };

package/v2Components/HtmlEditor/utils/htmlValidator.js

@@ -20,7 +20,7 @@ const defaultMessageFormatter = (messageKey, values = {}) => {
     'validator.largeImageDetected': 'Large image dimensions detected - consider mobile optimization',
     'validator.unclosedCssRule': 'Unclosed CSS rule detected',
     'validator.emptyCssRule': 'Empty CSS rule detected',
-    'validator.cssValidationFailed': `CSS validation failed: ${values.error || 'Unknown error'}`,
+    'validator.cssValidationFailed': `CSS validation failed: ${values.error || 'Unknown error'}`
   };
 
   return fallbackMessages[messageKey] || messageKey;
@@ -49,7 +49,7 @@ const HTML_RULES = {
   'space-tab-mixed-disabled': 'space',
   'id-class-ad-disabled': false,
   'href-abs-or-rel': false,
-  'attr-unsafe-chars': true,
+  'attr-unsafe-chars': true
 };
 
 // Additional custom validation rules
@@ -66,7 +66,7 @@ const CUSTOM_VALIDATIONS = {
 
   // InApp-specific validations
   MOBILE_INCOMPATIBLE: /<(object|embed|applet)\b/gi,
-  LARGE_IMAGES: /width\s*:\s*[5-9]\d{2,}px|height\s*:\s*[5-9]\d{2,}px/gi,
+  LARGE_IMAGES: /width\s*:\s*[5-9]\d{2,}px|height\s*:\s*[5-9]\d{2,}px/gi
 };
 
 /**
@@ -82,7 +82,7 @@ export const validateHTML = (html, variant = 'email', formatMessage = defaultMes
       isValid: true,
       errors: [],
       warnings: [],
-      info: [],
+      info: []
     };
   }
 
@@ -90,7 +90,7 @@ export const validateHTML = (html, variant = 'email', formatMessage = defaultMes
     isValid: true,
     errors: [],
     warnings: [],
-    info: [],
+    info: []
   };
 
   try {
@@ -98,7 +98,7 @@ export const validateHTML = (html, variant = 'email', formatMessage = defaultMes
     const htmlHintResults = HTMLHint.verify(html, HTML_RULES);
 
     // Process HTMLHint results
-    htmlHintResults.forEach((issue) => {
+    htmlHintResults.forEach(issue => {
       const error = {
         type: issue.type,
         message: issue.message,
@@ -106,64 +106,66 @@ export const validateHTML = (html, variant = 'email', formatMessage = defaultMes
         column: issue.col,
         rule: issue.rule.id,
         severity: getSeverityLevel(issue.type, issue.rule.id),
-        source: 'htmlhint',
+        source: 'htmlhint'
       };
 
-      if (error.severity === 'warning') {
+      if (error.severity === 'error') {
+        results.errors.push(error);
+        results.isValid = false;
+      } else if (error.severity === 'warning') {
         results.warnings.push(error);
-      } else if (error.severity === 'info') {
-        results.info.push(error);
       } else {
-        results.warnings.push(error);
+        results.info.push(error);
       }
     });
+
+    // Run custom validations
+    runCustomValidations(html, variant, results, formatMessage);
+
+    // Run Liquid template validation
+    runLiquidValidation(html, variant, results, formatMessage);
+
   } catch (error) {
-    // HTMLHint failed, but we still want to run custom validations and Liquid validation
-    results.warnings.push({
-      type: 'warning',
+    results.errors.push({
+      type: 'error',
       message: formatMessage('validator.validationFailed', { error: error.message }),
       line: 1,
       column: 1,
       rule: 'validation-error',
-      severity: 'warning',
-      source: 'validator',
+      severity: 'error',
+      source: 'validator'
     });
+    results.isValid = false;
   }
 
-  // Always run custom validations and Liquid validation, even if HTMLHint failed
-  // This ensures unsafe protocol detection and other critical validations still run
-  runCustomValidations(html, variant, results, formatMessage);
-  runLiquidValidation(html, variant, results, formatMessage);
-
   return results;
 };
 
 /**
- * Determines severity level based on error type and rule.
- * ONLY Rule Group #1 (Input & Sanitization) is blocking; that is handled in
- * contentSanitizer/useValidation. All HTML/CSS/Liquid/security rules here are
- * WARNING only for backward compatibility with CKEditor legacy templates.
+ * Determines severity level based on error type and rule
  */
 const getSeverityLevel = (type, ruleId) => {
-  const warningRules = [
+  const errorRules = [
     'tag-pair',
     'attr-no-duplication',
     'id-unique',
-    'spec-char-escape',
+    'spec-char-escape'
+  ];
+
+  const warningRules = [
     'tagname-lowercase',
     'attr-lowercase',
     'attr-value-double-quotes',
-    'alt-require',
+    'alt-require'
   ];
 
-  if (warningRules.includes(ruleId)) {
-    return 'warning';
-  }
-  // Downgrade HTMLHint "error" type to warning (Rule Group #1 is sanitizer-only)
-  if (type === 'error') {
+  if (type === 'error' || errorRules.includes(ruleId)) {
+    return 'error';
+  } else if (warningRules.includes(ruleId)) {
     return 'warning';
+  } else {
+    return 'info';
   }
-  return 'info';
 };
 
 /**
@@ -175,7 +177,6 @@ const getSeverityLevel = (type, ruleId) => {
  */
 const runCustomValidations = (html, variant, results, formatMessage = defaultMessageFormatter) => {
   // Check for unsafe protocols using RegExp.exec loop
-  // These are BLOCKING ERRORS (Rule Group #1: sanitizer.dangerousProtocolDetected)
   const unsafeProtocolsRegex = new RegExp(CUSTOM_VALIDATIONS.UNSAFE_PROTOCOLS.source, CUSTOM_VALIDATIONS.UNSAFE_PROTOCOLS.flags);
   unsafeProtocolsRegex.lastIndex = 0; // Reset lastIndex before running
   let match;
@@ -185,9 +186,9 @@ const runCustomValidations = (html, variant, results, formatMessage = defaultMes
       message: formatMessage('validator.unsafeProtocolDetected', { protocol: match[0] }),
       line: getLineNumber(html, match.index),
       column: 1,
-      rule: 'sanitizer.dangerousProtocolDetected',
+      rule: 'unsafe-protocol',
       severity: 'error',
-      source: 'custom',
+      source: 'custom'
     });
     results.isValid = false;
 
@@ -208,7 +209,7 @@ const runCustomValidations = (html, variant, results, formatMessage = defaultMes
       column: 1,
       rule: 'script-tag-warning',
       severity: 'warning',
-      source: 'custom',
+      source: 'custom'
     });
 
     // Guard against zero-length matches to avoid infinite loops
@@ -244,7 +245,7 @@ const validateEmailSpecific = (html, results, formatMessage = defaultMessageForm
       column: 1,
       rule: 'outlook-compatibility',
       severity: 'warning',
-      source: 'email-specific',
+      source: 'email-specific'
     });
 
     // Guard against zero-length matches to avoid infinite loops
@@ -264,7 +265,7 @@ const validateEmailSpecific = (html, results, formatMessage = defaultMessageForm
       column: 1,
       rule: 'email-css-compatibility',
       severity: 'warning',
-      source: 'email-specific',
+      source: 'email-specific'
     });
 
     // Guard against zero-length matches to avoid infinite loops
@@ -293,7 +294,7 @@ const validateInAppSpecific = (html, results, formatMessage = defaultMessageForm
       column: 1,
       rule: 'mobile-compatibility',
       severity: 'warning',
-      source: 'inapp-specific',
+      source: 'inapp-specific'
     });
 
     // Guard against zero-length matches to avoid infinite loops
@@ -313,7 +314,7 @@ const validateInAppSpecific = (html, results, formatMessage = defaultMessageForm
       column: 1,
       rule: 'mobile-image-size',
       severity: 'info',
-      source: 'inapp-specific',
+      source: 'inapp-specific'
     });
 
     // Guard against zero-length matches to avoid infinite loops
@@ -335,9 +336,8 @@ const runLiquidValidation = (html, variant, results, formatMessage = defaultMess
     const liquidResults = validateLiquidHTML(html, variant);
 
     // Merge Liquid validation results
-    // Client-side Liquid validation errors are blocking (genuine syntax errors)
     if (liquidResults.errors) {
-      results.errors.push(...liquidResults.errors.map((e) => ({ ...e, severity: 'error' })));
+      results.errors.push(...liquidResults.errors);
       if (liquidResults.errors.length > 0) {
         results.isValid = false;
       }
@@ -375,7 +375,7 @@ export const validateCSS = (css, formatMessage = defaultMessageFormatter) => {
     isValid: true,
     errors: [],
     warnings: [],
-    info: [],
+    info: []
   };
 
   if (!css || typeof css !== 'string') {
@@ -388,7 +388,7 @@ export const validateCSS = (css, formatMessage = defaultMessageFormatter) => {
       unclosedBraces: /\{[^{}]*$/gm,
       invalidProperty: /[^;{}]+:\s*[^;{}]*[^;}]/g,
       missingColon: /[^;{}]+\s+[^;{}:]+;/g,
-      emptyRule: /[^{}]+\{\s*\}/g,
+      emptyRule: /[^{}]+\{\s*\}/g
     };
 
     // Check for unclosed braces using RegExp.exec loop
@@ -396,15 +396,16 @@ export const validateCSS = (css, formatMessage = defaultMessageFormatter) => {
     unclosedBracesRegex.lastIndex = 0; // Reset lastIndex before running
     let match;
     while ((match = unclosedBracesRegex.exec(css)) !== null) {
-      results.warnings.push({
-        type: 'warning',
+      results.errors.push({
+        type: 'error',
         message: formatMessage('validator.unclosedCssRule'),
         line: getLineNumber(css, match.index),
         column: 1,
         rule: 'unclosed-brace',
-        severity: 'warning',
-        source: 'css-validator',
+        severity: 'error',
+        source: 'css-validator'
       });
+      results.isValid = false;
 
       // Guard against zero-length matches to avoid infinite loops
       if (match[0].length === 0) {
@@ -416,31 +417,34 @@ export const validateCSS = (css, formatMessage = defaultMessageFormatter) => {
     const emptyRulesRegex = new RegExp(validationPatterns.emptyRule.source, validationPatterns.emptyRule.flags);
     emptyRulesRegex.lastIndex = 0; // Reset lastIndex before running
     while ((match = emptyRulesRegex.exec(css)) !== null) {
-      results.warnings.push({
-        type: 'warning',
+      results.errors.push({
+        type: 'error',
         message: formatMessage('validator.emptyCssRule'),
         line: getLineNumber(css, match.index),
         column: 1,
         rule: 'empty-rule',
-        severity: 'warning',
-        source: 'css-validator',
+        severity: 'error',
+        source: 'css-validator'
       });
+      results.isValid = false;
 
       // Guard against zero-length matches to avoid infinite loops
       if (match[0].length === 0) {
         emptyRulesRegex.lastIndex++;
       }
     }
+
   } catch (error) {
-    results.warnings.push({
-      type: 'warning',
+    results.errors.push({
+      type: 'error',
       message: formatMessage('validator.cssValidationFailed', { error: error.message }),
       line: 1,
       column: 1,
       rule: 'css-validation-error',
-      severity: 'warning',
-      source: 'css-validator',
+      severity: 'error',
+      source: 'css-validator'
     });
+    results.isValid = false;
   }
 
   return results;
@@ -453,20 +457,16 @@ export const validateCSS = (css, formatMessage = defaultMessageFormatter) => {
  * @returns {Object} Combined validation results from all CSS blocks
  */
 export const extractAndValidateCSS = (html, formatMessage = defaultMessageFormatter) => {
-  if (!html) {
-    return {
-      isValid: true, errors: [], warnings: [], info: [],
-    };
-  }
+  if (!html) return { isValid: true, errors: [], warnings: [], info: [] };
 
   // Extract CSS from style tags
   const styleTagPattern = /<style[^>]*>([\s\S]*?)<\/style>/gi;
   let match;
-  const allResults = {
+  let allResults = {
     isValid: true,
     errors: [],
     warnings: [],
-    info: [],
+    info: []
   };
 
   while ((match = styleTagPattern.exec(html)) !== null) {
@@ -483,18 +483,19 @@ export const extractAndValidateCSS = (html, formatMessage = defaultMessageFormat
     }
   }
 
-  // Check for unclosed style tags (warning only for CKEditor legacy compatibility)
+  // Check for unclosed style tags
   const unclosedStylePattern = /<style[^>]*>(?![\s\S]*?<\/style>)/gi;
   if (unclosedStylePattern.test(html)) {
-    allResults.warnings.push({
-      type: 'warning',
+    allResults.errors.push({
+      type: 'error',
       message: formatMessage('validator.unclosedCssRule'),
       line: 1,
       column: 1,
       rule: 'unclosed-style-tag',
-      severity: 'warning',
-      source: 'css-validator',
+      severity: 'error',
+      source: 'css-validator'
     });
+    allResults.isValid = false;
   }
 
   return allResults;
@@ -503,5 +504,5 @@ export const extractAndValidateCSS = (html, formatMessage = defaultMessageFormat
 export default {
   validateHTML,
   validateCSS,
-  extractAndValidateCSS,
+  extractAndValidateCSS
 };