cap-creatives-ui 8.0.280 → 8.0.321

package/app/v2Components/HtmlEditor/components/CodeEditorPane/index.js

@@ -59,6 +59,7 @@ const CodeEditorPaneComponent = ({
   injectedTags = {},
   location,
   eventContextTags = [],
+  waitEventContextTags = {},
   selectedOfferDetails = [],
   channel,
   userLocale = 'en',
@@ -69,7 +70,7 @@ const CodeEditorPaneComponent = ({
 }) => {
   const context = useEditorContext();
   const {
-    content, validation, variant, isLiquidEnabled,
+    content, validation, variant,
   } = context || {};
   const { content: contentValue, updateContent } = content || {};
   const editorRef = useRef(null);
@@ -289,6 +290,7 @@ const CodeEditorPaneComponent = ({
               location={location}
               selectedOfferDetails={selectedOfferDetails}
               eventContextTags={eventContextTags}
+              waitEventContextTags={waitEventContextTags}
               popoverPlacement="rightTop"
             />
           </CapRow>
@@ -298,7 +300,6 @@ const CodeEditorPaneComponent = ({
         <ValidationErrorDisplay
           validation={validation}
           onErrorClick={onErrorClick}
-          isLiquidEnabled={isLiquidEnabled}
           className="code-editor-pane__validation"
         />
       </div>
@@ -328,6 +329,7 @@ CodeEditorPane.propTypes = {
   injectedTags: PropTypes.object,
   location: PropTypes.object,
   eventContextTags: PropTypes.array,
+  waitEventContextTags: PropTypes.object,
   selectedOfferDetails: PropTypes.array,
   channel: PropTypes.string,
   userLocale: PropTypes.string,

package/app/v2Components/HtmlEditor/hooks/__tests__/useValidation.test.js

@@ -155,7 +155,7 @@ describe('useValidation', () => {
         await Promise.resolve();
       });
 
-      expect(validateHTML).toHaveBeenCalledWith('<p>Test</p>', 'email', null);
+      expect(validateHTML).toHaveBeenCalledWith('<p>Test</p>', 'email', null, { skipLiquidValidation: false });
     });
 
     it('updates validation when content changes', async () => {
@@ -472,7 +472,7 @@ describe('useValidation', () => {
         await Promise.resolve();
       });
 
-      expect(validateHTML).toHaveBeenCalledWith('<p>Test</p>', 'inapp', null);
+      expect(validateHTML).toHaveBeenCalledWith('<p>Test</p>', 'inapp', null, { skipLiquidValidation: false });
     });
 
     it('defaults to email variant', async () => {
@@ -487,7 +487,7 @@ describe('useValidation', () => {
         await Promise.resolve();
       });
 
-      expect(validateHTML).toHaveBeenCalledWith('<p>Test</p>', 'email', null);
+      expect(validateHTML).toHaveBeenCalledWith('<p>Test</p>', 'email', null, { skipLiquidValidation: false });
     });
   });
 
@@ -644,6 +644,326 @@ describe('useValidation', () => {
     // The functionality is verified through integration tests and the hasErrors test above
   });
 
+  describe('getLineAndColumnFromPosition utility (lines 36-46)', () => {
+    it('computes correct line and column from position in security issue', async () => {
+      const { isContentSafe, findUnsafeContent } = require('../../utils/contentSanitizer');
+      const { validateHTML, extractAndValidateCSS } = require('../../utils/htmlValidator');
+      let validationState;
+
+      validateHTML.mockImplementationOnce(() => ({ isValid: true, errors: [], warnings: [], info: [] }));
+      extractAndValidateCSS.mockImplementationOnce(() => ({ isValid: true, errors: [], warnings: [], info: [] }));
+      isContentSafe.mockImplementationOnce(() => false);
+      // position 12 in "line1\nline2\nX" → line 3, column 1
+      const content = 'line1\nline2\njavascript:alert(1)';
+      findUnsafeContent.mockImplementationOnce(() => [{ type: 'JavaScript Protocol', position: 12 }]);
+
+      render(
+        <TestComponent
+          content={content}
+          options={{ enableRealTime: false }}
+          onStateChange={(state) => { validationState = state; }}
+        />
+      );
+
+      await waitFor(() => { expect(validationState).toBeDefined(); });
+      await act(async () => { validationState.forceValidation(); await Promise.resolve(); });
+
+      await waitFor(() => {
+        const issues = validationState.getAllIssues();
+        const secIssue = issues.find((i) => i.source === 'security');
+        expect(secIssue).toBeDefined();
+        expect(secIssue.line).toBe(3);
+        expect(secIssue.column).toBe(1);
+      });
+    });
+
+    it('defaults line/column to 1 when security issue has no position', async () => {
+      const { isContentSafe, findUnsafeContent } = require('../../utils/contentSanitizer');
+      const { validateHTML, extractAndValidateCSS } = require('../../utils/htmlValidator');
+      let validationState;
+
+      validateHTML.mockImplementationOnce(() => ({ isValid: true, errors: [], warnings: [], info: [] }));
+      extractAndValidateCSS.mockImplementationOnce(() => ({ isValid: true, errors: [], warnings: [], info: [] }));
+      isContentSafe.mockImplementationOnce(() => false);
+      findUnsafeContent.mockImplementationOnce(() => [{ type: 'JavaScript Protocol' }]); // no position
+
+      render(
+        <TestComponent
+          content="<a href='javascript:x'>x</a>"
+          options={{ enableRealTime: false }}
+          onStateChange={(state) => { validationState = state; }}
+        />
+      );
+
+      await waitFor(() => { expect(validationState).toBeDefined(); });
+      await act(async () => { validationState.forceValidation(); await Promise.resolve(); });
+
+      await waitFor(() => {
+        const issues = validationState.getAllIssues();
+        const secIssue = issues.find((i) => i.source === 'security');
+        expect(secIssue).toBeDefined();
+        expect(secIssue.line).toBe(1);
+        expect(secIssue.column).toBe(1);
+      });
+    });
+
+    it('handles negative or undefined position in getLineAndColumnFromPosition', async () => {
+      const { isContentSafe, findUnsafeContent } = require('../../utils/contentSanitizer');
+      const { validateHTML, extractAndValidateCSS } = require('../../utils/htmlValidator');
+      let validationState;
+
+      validateHTML.mockImplementationOnce(() => ({ isValid: true, errors: [], warnings: [], info: [] }));
+      extractAndValidateCSS.mockImplementationOnce(() => ({ isValid: true, errors: [], warnings: [], info: [] }));
+      isContentSafe.mockImplementationOnce(() => false);
+      findUnsafeContent.mockImplementationOnce(() => [{ type: 'JavaScript Protocol', position: -5 }]);
+
+      render(
+        <TestComponent
+          content="<a href='javascript:x'>x</a>"
+          options={{ enableRealTime: false }}
+          onStateChange={(state) => { validationState = state; }}
+        />
+      );
+
+      await waitFor(() => { expect(validationState).toBeDefined(); });
+      await act(async () => { validationState.forceValidation(); await Promise.resolve(); });
+
+      await waitFor(() => {
+        const issues = validationState.getAllIssues();
+        const secIssue = issues.find((i) => i.source === 'security');
+        expect(secIssue).toBeDefined();
+        // negative position falls back to line 1, column 1
+        expect(secIssue.line).toBe(1);
+        expect(secIssue.column).toBe(1);
+      });
+    });
+  });
+
+  describe('getAllIssues spread — all six arrays included (lines 401-411)', () => {
+    it('includes items from htmlErrors, htmlWarnings, htmlInfo, cssErrors, cssWarnings, cssInfo', async () => {
+      const { validateHTML, extractAndValidateCSS } = require('../../utils/htmlValidator');
+      const { isContentSafe, findUnsafeContent } = require('../../utils/contentSanitizer');
+      let validationState;
+
+      validateHTML.mockImplementationOnce(() => ({
+        isValid: false,
+        errors: [{ type: 'error', message: 'html error', line: 1, column: 1, rule: 'r1', severity: 'error', source: 'htmlhint' }],
+        warnings: [{ type: 'warning', message: 'html warning', line: 2, column: 1, rule: 'r2', severity: 'warning', source: 'htmlhint' }],
+        info: [{ type: 'info', message: 'html info', line: 3, column: 1, rule: 'r3', severity: 'info', source: 'htmlhint' }],
+      }));
+      extractAndValidateCSS.mockImplementationOnce(() => ({
+        isValid: false,
+        errors: [{ type: 'error', message: 'css error', line: 4, column: 1, rule: 'r4', severity: 'error', source: 'css-validator' }],
+        warnings: [{ type: 'warning', message: 'css warning', line: 5, column: 1, rule: 'r5', severity: 'warning', source: 'css-validator' }],
+        info: [{ type: 'info', message: 'css info', line: 6, column: 1, rule: 'r6', severity: 'info', source: 'css-validator' }],
+      }));
+      isContentSafe.mockImplementationOnce(() => true);
+      findUnsafeContent.mockImplementationOnce(() => []);
+
+      render(
+        <TestComponent
+          content="<div>test</div>"
+          options={{ enableRealTime: false, enableSanitization: false }}
+          onStateChange={(state) => { validationState = state; }}
+        />
+      );
+
+      await waitFor(() => { expect(validationState).toBeDefined(); });
+      await act(async () => { validationState.forceValidation(); await Promise.resolve(); });
+
+      await waitFor(() => {
+        const issues = validationState.getAllIssues();
+        const rules = issues.map((i) => i.rule);
+        expect(rules).toContain('r1'); // htmlErrors
+        expect(rules).toContain('r2'); // htmlWarnings
+        expect(rules).toContain('r3'); // htmlInfo
+        expect(rules).toContain('r4'); // cssErrors
+        expect(rules).toContain('r5'); // cssWarnings
+        expect(rules).toContain('r6'); // cssInfo
+        expect(issues.length).toBeGreaterThanOrEqual(6);
+      });
+    });
+
+    it('sorts issues: errors before warnings before info', async () => {
+      const { validateHTML, extractAndValidateCSS } = require('../../utils/htmlValidator');
+      const { isContentSafe, findUnsafeContent } = require('../../utils/contentSanitizer');
+      let validationState;
+
+      validateHTML.mockImplementationOnce(() => ({
+        isValid: false,
+        errors: [{ type: 'error', message: 'html error', line: 10, column: 1, rule: 're', severity: 'error', source: 'htmlhint' }],
+        warnings: [{ type: 'warning', message: 'html warning', line: 1, column: 1, rule: 'rw', severity: 'warning', source: 'htmlhint' }],
+        info: [{ type: 'info', message: 'html info', line: 1, column: 1, rule: 'ri', severity: 'info', source: 'htmlhint' }],
+      }));
+      extractAndValidateCSS.mockImplementationOnce(() => ({ isValid: true, errors: [], warnings: [], info: [] }));
+      isContentSafe.mockImplementationOnce(() => true);
+      findUnsafeContent.mockImplementationOnce(() => []);
+
+      render(
+        <TestComponent
+          content="<div>test</div>"
+          options={{ enableRealTime: false, enableSanitization: false }}
+          onStateChange={(state) => { validationState = state; }}
+        />
+      );
+
+      await waitFor(() => { expect(validationState).toBeDefined(); });
+      await act(async () => { validationState.forceValidation(); await Promise.resolve(); });
+
+      await waitFor(() => {
+        const issues = validationState.getAllIssues();
+        const severities = issues.map((i) => i.severity);
+        // Errors should come before warnings, warnings before info
+        const firstError = severities.indexOf('error');
+        const firstWarning = severities.indexOf('warning');
+        const firstInfo = severities.indexOf('info');
+        if (firstError !== -1 && firstWarning !== -1) expect(firstError).toBeLessThan(firstWarning);
+        if (firstWarning !== -1 && firstInfo !== -1) expect(firstWarning).toBeLessThan(firstInfo);
+      });
+    });
+  });
+
+  describe('hasClientSideLiquidErrors and hasBlockingErrors (lines 455-456)', () => {
+    it('sets hasBlockingErrors=true when htmlErrors has a liquid-validator error', async () => {
+      const { validateHTML, extractAndValidateCSS } = require('../../utils/htmlValidator');
+      const { isContentSafe, findUnsafeContent } = require('../../utils/contentSanitizer');
+      let validationState;
+
+      validateHTML.mockImplementationOnce(() => ({
+        isValid: false,
+        errors: [{
+          type: 'error',
+          message: 'Liquid syntax error',
+          line: 1,
+          column: 1,
+          rule: 'liquid-syntax',
+          severity: 'error',
+          source: 'liquid-validator', // ISSUE_SOURCES.LIQUID
+        }],
+        warnings: [],
+        info: [],
+      }));
+      extractAndValidateCSS.mockImplementationOnce(() => ({ isValid: true, errors: [], warnings: [], info: [] }));
+      isContentSafe.mockImplementationOnce(() => true);
+      findUnsafeContent.mockImplementationOnce(() => []);
+
+      render(
+        <TestComponent
+          content="{{ invalid liquid }}"
+          options={{ enableRealTime: false, enableSanitization: false }}
+          onStateChange={(state) => { validationState = state; }}
+        />
+      );
+
+      await waitFor(() => { expect(validationState).toBeDefined(); });
+      await act(async () => { validationState.forceValidation(); await Promise.resolve(); });
+
+      await waitFor(() => {
+        // hasClientSideLiquidErrors → true because htmlErrors has liquid-validator+error item
+        // therefore hasBlockingErrors → true
+        expect(validationState.hasBlockingErrors).toBe(true);
+      });
+    });
+
+    it('does NOT set hasBlockingErrors from liquid-validator warning (non-error severity)', async () => {
+      const { validateHTML, extractAndValidateCSS } = require('../../utils/htmlValidator');
+      const { isContentSafe, findUnsafeContent } = require('../../utils/contentSanitizer');
+      let validationState;
+
+      validateHTML.mockImplementationOnce(() => ({
+        isValid: true,
+        errors: [],
+        warnings: [{
+          type: 'warning',
+          message: 'Liquid warning',
+          line: 1,
+          column: 1,
+          rule: 'liquid-warning',
+          severity: 'warning',
+          source: 'liquid-validator',
+        }],
+        info: [],
+      }));
+      extractAndValidateCSS.mockImplementationOnce(() => ({ isValid: true, errors: [], warnings: [], info: [] }));
+      isContentSafe.mockImplementationOnce(() => true);
+      findUnsafeContent.mockImplementationOnce(() => []);
+
+      render(
+        <TestComponent
+          content="<div>test</div>"
+          options={{ enableRealTime: false, enableSanitization: false }}
+          onStateChange={(state) => { validationState = state; }}
+        />
+      );
+
+      await waitFor(() => { expect(validationState).toBeDefined(); });
+      await act(async () => { validationState.forceValidation(); await Promise.resolve(); });
+
+      await waitFor(() => {
+        // hasClientSideLiquidErrors → false (severity is warning, not error)
+        // No other blocking conditions → hasBlockingErrors → false
+        expect(validationState.hasBlockingErrors).toBe(false);
+      });
+    });
+
+    it('sets hasBlockingErrors=true via API liquid errors', async () => {
+      const { validateHTML, extractAndValidateCSS } = require('../../utils/htmlValidator');
+      const { isContentSafe, findUnsafeContent } = require('../../utils/contentSanitizer');
+      let validationState;
+
+      validateHTML.mockImplementationOnce(() => ({ isValid: true, errors: [], warnings: [], info: [] }));
+      extractAndValidateCSS.mockImplementationOnce(() => ({ isValid: true, errors: [], warnings: [], info: [] }));
+      isContentSafe.mockImplementationOnce(() => true);
+      findUnsafeContent.mockImplementationOnce(() => []);
+
+      render(
+        <TestComponent
+          content="<div>test</div>"
+          options={{
+            enableRealTime: false,
+            enableSanitization: false,
+            apiValidationErrors: { liquidErrors: ['API liquid error'], standardErrors: [] },
+          }}
+          onStateChange={(state) => { validationState = state; }}
+        />
+      );
+
+      await waitFor(() => { expect(validationState).toBeDefined(); });
+      await act(async () => { validationState.forceValidation(); await Promise.resolve(); });
+
+      await waitFor(() => {
+        // hasApiErrors → true → hasBlockingErrors → true
+        expect(validationState.hasBlockingErrors).toBe(true);
+      });
+    });
+
+    it('hasBlockingErrors=false when no blocking conditions are present', async () => {
+      const { validateHTML, extractAndValidateCSS } = require('../../utils/htmlValidator');
+      const { isContentSafe, findUnsafeContent } = require('../../utils/contentSanitizer');
+      let validationState;
+
+      validateHTML.mockImplementationOnce(() => ({ isValid: true, errors: [], warnings: [], info: [] }));
+      extractAndValidateCSS.mockImplementationOnce(() => ({ isValid: true, errors: [], warnings: [], info: [] }));
+      isContentSafe.mockImplementationOnce(() => true);
+      findUnsafeContent.mockImplementationOnce(() => []);
+
+      render(
+        <TestComponent
+          content="<div>clean</div>"
+          options={{ enableRealTime: false, enableSanitization: false }}
+          onStateChange={(state) => { validationState = state; }}
+        />
+      );
+
+      await waitFor(() => { expect(validationState).toBeDefined(); });
+      await act(async () => { validationState.forceValidation(); await Promise.resolve(); });
+
+      await waitFor(() => {
+        expect(validationState.hasBlockingErrors).toBe(false);
+      });
+    });
+  });
+
   describe('Blocking errors', () => {
     it('treats protocol security issues as blocking errors', async () => {
       const { isContentSafe, findUnsafeContent } = require('../../utils/contentSanitizer');
@@ -922,4 +1242,133 @@ describe('useValidation', () => {
       });
     });
   });
+
+  describe('isFullMode - skip liquid validation', () => {
+    it('passes skipLiquidValidation: true to validateHTML when isFullMode is true', async () => {
+      const { validateHTML } = require('../../utils/htmlValidator');
+
+      render(<TestComponent content="<p>Test</p>" options={{ isFullMode: true }} />);
+
+      await act(async () => {
+        jest.advanceTimersByTime(500);
+        await Promise.resolve();
+        await Promise.resolve();
+        await Promise.resolve();
+      });
+
+      expect(validateHTML).toHaveBeenCalledWith('<p>Test</p>', 'email', null, { skipLiquidValidation: true });
+    });
+
+    it('excludes API liquid errors from getAllIssues when isFullMode is true', async () => {
+      let validationState;
+      const onStateChange = (state) => { validationState = state; };
+
+      const apiValidationErrors = {
+        liquidErrors: ['Unsupported tag: points_balance'],
+        standardErrors: [],
+      };
+
+      render(
+        <TestComponent
+          content="<p>Test</p>"
+          options={{ apiValidationErrors, isFullMode: true }}
+          onStateChange={onStateChange}
+        />
+      );
+
+      await act(async () => {
+        jest.advanceTimersByTime(500);
+        await Promise.resolve();
+        await Promise.resolve();
+        await Promise.resolve();
+      });
+
+      await waitFor(() => {
+        expect(validationState).toBeDefined();
+      });
+
+      const issues = validationState.getAllIssues();
+      const liquidIssues = issues.filter((i) => i.source === 'liquid-validator');
+      expect(liquidIssues).toHaveLength(0);
+    });
+
+    it('returns isClean true when only liquid errors exist and isFullMode is true', () => {
+      const apiValidationErrors = {
+        liquidErrors: ['Unsupported tag: points_balance'],
+        standardErrors: [],
+      };
+
+      render(
+        <TestComponent
+          content=""
+          options={{ apiValidationErrors, isFullMode: true }}
+        />
+      );
+
+      // Before validation runs, isClean should be true because liquid errors are ignored in full mode
+      expect(screen.getByTestId('is-clean')).toHaveTextContent('true');
+    });
+
+    it('does not treat liquid errors as blocking when isFullMode is true', async () => {
+      let validationState;
+      const onStateChange = (state) => { validationState = state; };
+
+      const apiValidationErrors = {
+        liquidErrors: ['Unsupported tag: points_balance'],
+        standardErrors: [],
+      };
+
+      render(
+        <TestComponent
+          content="<p>Valid</p>"
+          options={{ apiValidationErrors, isFullMode: true }}
+          onStateChange={onStateChange}
+        />
+      );
+
+      await act(async () => {
+        jest.advanceTimersByTime(500);
+        await Promise.resolve();
+        await Promise.resolve();
+        await Promise.resolve();
+      });
+
+      await waitFor(() => {
+        expect(validationState).toBeDefined();
+      });
+
+      expect(validationState.hasBlockingErrors).toBe(false);
+    });
+
+    it('still treats standard API errors as blocking when isFullMode is true', async () => {
+      let validationState;
+      const onStateChange = (state) => { validationState = state; };
+
+      const apiValidationErrors = {
+        liquidErrors: ['Liquid error'],
+        standardErrors: ['Standard error'],
+      };
+
+      render(
+        <TestComponent
+          content="<p>Valid</p>"
+          options={{ apiValidationErrors, isFullMode: true }}
+          onStateChange={onStateChange}
+        />
+      );
+
+      await act(async () => {
+        jest.advanceTimersByTime(500);
+        await Promise.resolve();
+        await Promise.resolve();
+        await Promise.resolve();
+      });
+
+      await waitFor(() => {
+        expect(validationState).toBeDefined();
+      });
+
+      expect(validationState.hasBlockingErrors).toBe(true);
+    });
+  });
 });

package/app/v2Components/HtmlEditor/hooks/useValidation.js

@@ -77,6 +77,7 @@ export const useValidation = (content, variant = 'email', options = {}, formatSa
     enableSanitization = true,
     securityLevel = 'standard',
     apiValidationErrors = null, // API validation errors from validateLiquidTemplateContent
+    isFullMode = false, // When true, skip liquid validation (standalone/full mode)
   } = options;
 
   // Validation state
@@ -137,7 +138,7 @@ export const useValidation = (content, variant = 'email', options = {}, formatSa
 
     try {
       // 1. HTML Validation
-      const htmlValidation = validateHTML(htmlContent, variant, formatValidatorMessage);
+      const htmlValidation = validateHTML(htmlContent, variant, formatValidatorMessage, { skipLiquidValidation: isFullMode });
 
       // 2. CSS Validation (extract from HTML)
       const cssValidation = extractAndValidateCSS(htmlContent, formatValidatorMessage);
@@ -206,7 +207,7 @@ export const useValidation = (content, variant = 'email', options = {}, formatSa
         },
       }));
     }
-  }, [variant, enableSanitization, securityLevel, formatSanitizerMessage, formatValidatorMessage]);
+  }, [variant, enableSanitization, securityLevel, formatSanitizerMessage, formatValidatorMessage, isFullMode]);
 
   /**
    * Validates content with debouncing
@@ -339,7 +340,7 @@ export const useValidation = (content, variant = 'email', options = {}, formatSa
    */
   const getAllIssues = useCallback(() => {
     // API errors (liquid + standard) are blocking – they block Save/Update/Preview/Test
-    const apiLiquidErrors = (apiValidationErrors?.liquidErrors || []).map((errorMessage) => {
+    const apiLiquidErrors = (isFullMode ? [] : (apiValidationErrors?.liquidErrors || [])).map((errorMessage) => {
       const extractedLine = extractLineNumberFromMessage(errorMessage);
       return {
         type: VALIDATION_SEVERITY.ERROR,
@@ -420,19 +421,20 @@ export const useValidation = (content, variant = 'email', options = {}, formatSa
 
     // Ensure we always return an array
     return Array.isArray(allIssues) ? allIssues : [];
-  }, [validationState, apiValidationErrors, extractLineNumberFromMessage, content]);
+  }, [validationState, apiValidationErrors, extractLineNumberFromMessage, content, isFullMode]);
 
   /**
    * Check if validation is clean (no errors or warnings)
    * Includes API validation errors in the check
    */
   const isClean = useCallback(() => {
-    const hasApiErrors = (apiValidationErrors?.liquidErrors?.length || 0) + (apiValidationErrors?.standardErrors?.length || 0) > 0;
+    const liquidErrorCount = isFullMode ? 0 : (apiValidationErrors?.liquidErrors?.length || 0);
+    const hasApiErrors = liquidErrorCount + (apiValidationErrors?.standardErrors?.length || 0) > 0;
     return validationState.summary.totalErrors === 0
            && validationState.summary.totalWarnings === 0
            && !validationState.summary.hasSecurityIssues
            && !hasApiErrors;
-  }, [validationState.summary, apiValidationErrors]);
+  }, [validationState.summary, apiValidationErrors, isFullMode]);
 
   // Effect to validate content when it changes
   useEffect(() => {
@@ -448,11 +450,12 @@ export const useValidation = (content, variant = 'email', options = {}, formatSa
     }
   }, []);
 
-  const hasApiErrors = (apiValidationErrors?.liquidErrors?.length || 0) + (apiValidationErrors?.standardErrors?.length || 0) > 0;
+  const hasApiLiquidErrors = isFullMode ? false : (apiValidationErrors?.liquidErrors?.length || 0) > 0;
+  const hasApiErrors = hasApiLiquidErrors || (apiValidationErrors?.standardErrors?.length || 0) > 0;
 
   const protocolTypes = ['JavaScript Protocol', 'Data URL', 'VBScript Protocol'];
-  // Client-side Liquid validation errors are blocking (genuine syntax errors)
-  const hasClientSideLiquidErrors = (validationState.htmlErrors || []).some((e) => e.source === ISSUE_SOURCES.LIQUID && e.severity === VALIDATION_SEVERITY.ERROR);
+  // Client-side Liquid validation errors are blocking (genuine syntax errors) - skip in full mode
+  const hasClientSideLiquidErrors = isFullMode ? false : (validationState.htmlErrors || []).some((e) => e.source === ISSUE_SOURCES.LIQUID && e.severity === VALIDATION_SEVERITY.ERROR);
   const hasBlockingErrors = (validationState.sanitizationWarnings || []).some((w) => BLOCKING_ERROR_RULE_IDS.includes(w.rule)) || (validationState.securityIssues || []).some((s) => protocolTypes.includes(s?.type)) || hasApiErrors || hasClientSideLiquidErrors;
 
   return {