diff --git a/src/content/docs/en/basics/demo-keys.mdx b/src/content/docs/en/basics/demo-keys.mdx new file mode 100644 index 0000000000000..d984c217e4a21 --- /dev/null +++ b/src/content/docs/en/basics/demo-keys.mdx @@ -0,0 +1,116 @@ +--- +title: Demo Keys +description: Learn how to use Prosopo demo keys for testing, development, and CI/CD environments without requiring production site keys. +i18nReady: true +--- + +Demo keys provide predictable CAPTCHA behavior for testing, development, and automated CI/CD pipelines. They enable you to test your integration and display a warning banner to prevent accidental production usage. + +## What are Demo Keys? + +Demo keys are special, hardcoded site keys that bypass normal CAPTCHA verification and return predictable results. They provide trivial challenges with predetermined outcomes. + +There are two demo keys available: + +### Always Pass Key + +**Site Key:** `5DAAnrj7VHTznn2AWBemMuyBwZWs6FNFjdyVXUeYum3PTXFy` + +This key provides trivial CAPTCHA challenges that automatically verify successfully. Use this for testing success flows, UI states, and happy path scenarios. + +**Behavior:** +- Presents a trivial PoW challenge with difficulty 1 +- Verification always succeeds +- `onCaptchaVerified` callback is triggered +- Red warning banner displays on the widget + +### Always Fail Key + +**Site Key:** `5CiPPseXPECbkjWCa6MnjNokrgYjMqmKndv2rSnekmSK2DjL` + +This key provides trivial CAPTCHA challenges that always fail verification. Use this for testing error handling, failure flows, and UI error states. + +**Behavior:** +- Presents a trivial PoW challenge with difficulty 1 +- Verification always fails +- `onCaptchaFailed` callback is triggered +- Red warning banner displays on the widget +- User can retry the challenge + +## When to Use Demo Keys + +Demo keys are appropriate for: + +- **Local Development** - Test your integration without a production site key +- **CI/CD Pipelines** - Automated testing where you need predictable CAPTCHA behavior +- **Unit and Integration Tests** - Test both success and failure code paths +- **Prototyping** - Quick integration testing during development +- **Demo Environments** - Showcase integration without real CAPTCHA challenges + +## When NOT to Use Demo Keys + +Demo keys should NEVER be used in: + +- **Production Environments** - Demo keys are automatically disabled when `NODE_ENV=production` +- **Staging Environments** - Use real site keys to test actual CAPTCHA behavior +- **User Acceptance Testing** - Real site keys ensure accurate testing of the user experience +- **Load Testing** - Demo keys don't reflect real provider performance + +## Using Demo Keys + +### HTML/JavaScript + +```html +
+
+``` + +### React + +```jsx +import { Procaptcha } from '@prosopo/procaptcha-react'; + +function MyComponent() { + return ( + console.log('Verified:', output)} + onFailed={() => console.log('Failed')} + captchaType="frictionless" + /> + ); +} +``` + +### Vue + +```vue + + + +``` diff --git a/src/i18n/en/nav.ts b/src/i18n/en/nav.ts index e5f360713d146..955b1238eae4a 100644 --- a/src/i18n/en/nav.ts +++ b/src/i18n/en/nav.ts @@ -55,6 +55,11 @@ export default [ slug: 'basics/faq', key: 'basics/faq', }, + { + text: 'Demo Keys', + slug: 'basics/demo-keys', + key: 'basics/demo-keys', + }, {text: 'Advanced Usage', header: true, type: 'learn', key: 'advanced'}, { text: 'Context Awareness', diff --git a/vercel.json b/vercel.json index 9cf46d934d06a..0653e5ee7caaf 100644 --- a/vercel.json +++ b/vercel.json @@ -130,6 +130,14 @@ { "source": "/:lang/recipes/", "destination": "/:lang/community-resources/content/" + }, + { + "source": "/demo-keys/", + "destination": "/en/basics/demo-keys/" + }, + { + "source": "/:lang/demo-keys/", + "destination": "/:lang/basics/demo-keys/" } ] }