Troubleshooting

Helper Button Not Appearing

You've added the snippet but don't see the Helper button next to your text areas.

Possible Solutions:

• Clear browser cache: Hard refresh your page (Ctrl+Shift+R on Windows/Linux, Cmd+Shift+R on Mac) to ensure you're loading the latest script version.
• Check script is loaded: Open browser developer tools (F12), go to the Console tab, and look for any JavaScript errors. Ensure the script is loading without errors.
• Verify snippet placement: Make sure the script tag is in the <head> section, not in the <body>. The script should load before page content.
• Check for text areas: The Helper only appears next to <textarea> and <input type="text"> elements. Ensure these elements exist on your page.
• Verify selector: Double-check that your CSS selector is correct and targets an actual text area element on your page.
• Disable ad blockers: Some ad blockers or privacy extensions may interfere with the Helper script. Test in an incognito/private window.

Content Security Policy (CSP) Errors

Your browser console shows CSP violations preventing the script from loading.

Content-Security-Policy: script-src 'self' https://ai-anywhere.ai;

If using meta tags in HTML:

<meta http-equiv="Content-Security-Policy" 
      content="script-src 'self' https://ai-anywhere.ai;">

Helper Button Not Responding

The Helper button appears but nothing happens when clicked.

Possible Solutions:

• Check browser console: Open developer tools (F12) and look for error messages that might indicate authentication or network issues.
• Check network requests: In the Network tab of developer tools, verify that API requests to AI Anywhere are succeeding (status 200) and not being blocked.
• Test with different browser: Rule out browser-specific issues by testing in Chrome, Firefox, or Safari.
• Disable browser extensions: Some extensions can interfere with JavaScript execution. Test with extensions disabled.

Multiple Helper Buttons Appearing

You see duplicate Helper buttons next to the same text area.

Solutions:

• Check for duplicate snippets: Search your HTML/templates to ensure the script tag only appears once in the <head> section.
• React/Vue/Angular: Ensure the script is loaded only once using useEffect (React) or mounted hooks, and add a guard to prevent re-loading.
• Use a loader guard: Check if the script already exists before adding it:
  if (!document.querySelector('script[src*="ai-anywhere.ai"]')) { // Add script here }

Performance or Loading Issues

The Helper script is slowing down your page load or causing performance problems.

Solutions:

• Use async loading: Add async attribute to the script tag (though our script already loads asynchronously).
• Defer script loading: If your page has many scripts, consider loading the Helper script with defer attribute to load it after page parsing.
• Check network timing: Use browser DevTools Network tab to see if the script is taking unusually long to download.
• Optimize your page: The Helper script is lightweight (~50KB), but if your page is already slow, optimize other resources first.

Styling Conflicts

The Helper button doesn't match your site's design or conflicts with your CSS.

Solutions:

• Override with CSS: Use more specific selectors or !important to override Helper styles:
  .ai-helper-button { background-color: #your-color !important; border-radius: 8px !important; }
• Use theme customization: Configure button colors and styles in your Helper settings to match your brand.
• Check CSS specificity: Ensure your custom styles have higher CSS specificity than the Helper's default styles.

Browser Compatibility Issues

Helper works in some browsers but not others.

If Issues Persist:

• Update your browser: Ensure you're using the latest version of your browser.
• Check JavaScript is enabled: Verify JavaScript is enabled in your browser settings.
• Test in incognito mode: Rule out extension conflicts by testing in private/incognito mode.