How to fix email_address_invalid: Email address validation failed in Supabase

// Test with a standard email format first
const standardEmail = '[email protected]';

const { data, error } = await supabase.auth.signUp({
  email: standardEmail,
  password: 'secure-password-123',
});

if (error) {
  console.error('Validation error:', error.message);
} else {
  console.log('Success with standard format');
}

// Instead of: [email protected]
// Use: [email protected]

// If you need to track different signups, use metadata instead
const { data, error } = await supabase.auth.signUp({
  email: '[email protected]',
  password: 'secure-password-123',
  options: {
    data: {
      signup_source: 'test_campaign',
    },
  },
});

// ❌ Will fail: domain too short
const invalidEmail = '[email protected]';

// ✅ Should work: standard domain length
const validEmail = '[email protected]';

// Validate domain length before submission
function isValidSupabaseDomain(email) {
  const domain = email.split('@')[1];
  if (!domain) return false;

  const parts = domain.split('.');
  return parts.every(part => part.length >= 2); // At least 2 chars per segment
}

if (isValidSupabaseDomain(email)) {
  await supabase.auth.signUp({ email, password });
} else {
  alert('Please use an email with a standard domain format');
}

function validateSupabaseEmail(email) {
  // Basic format check
  const emailRegex = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;

  if (!emailRegex.test(email)) {
    return { valid: false, error: 'Invalid email format' };
  }

  // Check for special characters that might cause issues
  if (email.includes('+')) {
    return {
      valid: false,
      error: 'Email addresses with + are not supported'
    };
  }

  // Verify domain length
  const domain = email.split('@')[1];
  const domainParts = domain.split('.');

  for (const part of domainParts) {
    if (part.length < 2) {
      return {
        valid: false,
        error: 'Domain segments must be at least 2 characters'
      };
    }
  }

  return { valid: true };
}

// Usage in form
async function handleSignup(email, password) {
  const validation = validateSupabaseEmail(email);

  if (!validation.valid) {
    setError(validation.error);
    return;
  }

  const { error } = await supabase.auth.signUp({ email, password });
  if (error) {
    setError(error.message);
  }
}

async function signupWithErrorHandling(email, password) {
  try {
    const { data, error } = await supabase.auth.signUp({
      email,
      password,
    });

    if (error) {
      if (error.message.includes('email_address_invalid')) {
        return {
          success: false,
          message: 'Please use a standard email format (e.g., [email protected])',
          suggestion: 'Avoid special characters and very short domain names',
        };
      }
      return { success: false, message: error.message };
    }

    return { success: true, data };
  } catch (err) {
    return {
      success: false,
      message: 'An unexpected error occurred during signup'
    };
  }
}

// In your component
const result = await signupWithErrorHandling(email, password);
if (!result.success) {
  setErrorMessage(result.message);
  if (result.suggestion) {
    setHelpText(result.suggestion);
  }
}