Skip to main content

Overview

When validation detects issues in generated code, Synapse’s self-correction system automatically attempts to fix them without manual intervention.

The Self-Correction Loop

1

Initial Generation

GPT-5 Mini generates code based on your prompt
2

Validation

MCP validator checks the code and returns a score with specific issues
3

Correction Decision

If score is below 90, self-correction is triggered
4

Fix Generation

AI analyzes the issues and generates corrected code
5

Re-validation

Corrected code is validated again
6

Success or Retry

Process repeats up to 3 times until score ≥ 90 or attempts exhausted

Success Rates

AttemptSuccess RateAvg Score
Initial13%87/100
Attempt 187%93/100
Attempt 297%96/100
Attempt 399%98/100

Common Corrections

Import Path Fixes

  • Before
  • After
// ❌ Wrong import path
import { Banner, useCart } from '@shopify/ui-extensions-react';

GraphQL Query Corrections

  • Before
  • After
# ❌ Wrong field name
query {
  cart {
    totalPrice
  }
}

Hook Usage Fixes

  • Before
  • After
// ❌ Conditional hook call
function Component() {
  if (condition) {
    const cart = useCart();
  }
}

How It Works

1. Issue Analysis

When validation fails, Synapse extracts specific issues:
{
  "issues": [
    {
      "type": "import_error",
      "message": "Module '@shopify/ui-extensions-react' has no exported member 'Banner'",
      "line": 1,
      "severity": "error"
    },
    {
      "type": "graphql_error", 
      "message": "Cannot query field 'totalPrice' on type 'Cart'",
      "line": 15,
      "severity": "error"
    }
  ]
}

2. Correction Prompt

Synapse creates a targeted correction prompt:
const correctionPrompt = `
The following Shopify extension code has validation errors:

ISSUES:
1. Import Error (Line 1): Module '@shopify/ui-extensions-react' has no exported member 'Banner'
   Fix: Add /checkout to the import path for checkout extensions

2. GraphQL Error (Line 15): Cannot query field 'totalPrice' on type 'Cart'
   Fix: Use cart.cost.totalAmount.amount instead

ORIGINAL CODE:
${originalCode}

INSTRUCTIONS:
- Fix ONLY the issues listed above
- Preserve all existing functionality
- Keep the same component structure
- Do not add new features
- Return the complete corrected code
`;

3. Intelligent Fixing

The AI understands context and makes precise fixes:
Recognizes common Shopify patterns and applies standard fixes
  • Import paths: Adds /checkout, /admin, /pos as appropriate
  • GraphQL: Uses Shopify’s schema to find correct field paths
  • Hooks: Moves to top level and restructures conditionals
  • Props: Matches TypeScript definitions
Maintains the original intent and structure
  • Keeps variable names
  • Preserves logic flow
  • Maintains comments
  • Retains error handling
Fixes multiple issues simultaneously
  • Prioritizes critical errors
  • Groups related fixes
  • Avoids creating new issues
  • Validates dependencies between fixes

Example Self-Correction Session

Original Generation

import { Banner, useCart } from '@shopify/ui-extensions-react';

export default function FreeShippingBanner() {
  const cart = useCart();
  
  if (cart.totalPrice > 50) {
    return null;
  }
  
  return (
    <Banner status="info">
      Add ${50 - cart.totalPrice} more for free shipping!
    </Banner>
  );
}
Validation Score: 62/100 Issues Found:
  • Import path missing /checkout
  • cart.totalPrice doesn’t exist
  • status prop should be tone

After Attempt 1

import { Banner, useCart } from '@shopify/ui-extensions-react/checkout';

export default function FreeShippingBanner() {
  const cart = useCart();
  
  const total = parseFloat(cart.cost.totalAmount.amount);
  
  if (total > 50) {
    return null;
  }
  
  const remaining = 50 - total;
  
  return (
    <Banner tone="info">
      Add ${remaining.toFixed(2)} more for free shipping!
    </Banner>
  );
}
Validation Score: 95/100 Result: ✅ Success! Code ready to deploy.

When Self-Correction Fails

If self-correction doesn’t reach a score of 90 after 3 attempts:
  1. User Notification: You’re informed of the persistent issues
  2. Partial Deployment: Code can still be deployed if score ≥ 75
  3. Manual Review: Recommended for scores < 75
  4. Support Escalation: Complex issues are flagged for team review

Manual Intervention

You can always view and edit the generated code:
// Click "View Code" in the dashboard
// Edit directly in the code editor
// Re-run validation manually
// Deploy when satisfied

Configuration

You can adjust self-correction behavior:
{
  "selfCorrection": {
    "enabled": true,
    "maxAttempts": 3,
    "minScore": 90,
    "autoDeployThreshold": 95
  }
}

Best Practices

Write Clear Prompts

Specific prompts lead to better initial code and fewer corrections

Review Corrections

Check what was changed to learn and improve future prompts

Report Patterns

If the same issue repeats, let us know to improve the system

Use Validation

Always validate before deploying, even with high scores

Limitations

Self-correction cannot fix:
  • Fundamental logic errors (wrong business rules)
  • Missing required features
  • Performance issues
  • Security vulnerabilities beyond basic validation
These require prompt revision or manual coding.

Next Steps