Skip to main content

Troubleshooting

Common integration issues and how to resolve them.

Blank or missing UI​

  • Confirm the script loads (Network tab → 200, not blocked by CSP).
  • In Elements, verify <glamar-captureiq> has a shadow root with content.
  • Listen for error and licenseError to surface failures.

License errors (licenseError)​

  • Ensure api-key is set and non-empty.
  • Keys are typically shaped like test_… or live_….
  • If you use config.license.validateUrl, the endpoint must be reachable and return JSON such as { "valid": true } or { "valid": false, "code": "...", "message": "..." }.
el.addEventListener("licenseError", (event) => {
  console.error("Capture IQ license error", event.detail.error);
});

Config parse or validation errors​

  • Validate JSON: JSON.parse the config string in the console.
  • Listen for configError for semantic issues (thresholds outside 0–1, invalid flow.steps).
el.addEventListener("configError", (event) => {
  console.error("Invalid config", event.detail.errors);
});

Camera permission denied or no preview​

  • Serve over HTTPS (or localhost for dev)—not file:// for camera in most browsers.
  • Listen to permission and cameraError.
  • Ask the user to re-enable camera in browser or OS settings and reload.
el.addEventListener("permission", (event) => {
  console.log("Permission", event.detail);
});
el.addEventListener("cameraError", (event) => {
  console.error("Camera error", event.detail.error);
});

Auto-capture never fires​

  • Confirm config.capture.autoCapture (or preset default) is appropriate.
  • Relax config.quality thresholds if they are too strict.
  • Inspect captureAttempt (reason: cooldown, maxAttempts, etc.) and frameQuality for live scores.
el.addEventListener("captureAttempt", (event) => {
  console.log("Attempt", event.detail);
});

Unexpected image size or format​

  • Check config.output: maxWidth / maxHeight downscale the image; mimeType must be encoder-supported; format controls blob vs data URL vs both.

Slow performance​

  • Reduce output resolution in output.
  • Lower capture.maxAttempts in difficult environments.
  • Avoid heavy work in frameQuality handlers.

Styling​

The UI lives in Shadow DOM—global CSS does not style inner nodes. Use theme and documented config; deep theming may require product-specific guidance.

Debug mode​

<glamar-captureiq api-key="YOUR_KEY" preset="face" debug="true"></glamar-captureiq>

Enables extra logging where supported.